js函数中this是全局变量还是当前对象

来源:互联网 发布:最全生活网络理财投资 编辑:程序博客网 时间:2024/06/05 20:01

问题:在Web项目前端实现时,有两个小功能模块,一方面想自我要求必须面向对象的方式实现,另一方面此功能模块没有相同的模式,不需要用类多次实例化,因此创建一个单例是最好的选择。单例的js实现有多种方式:



1.以对象实现

var singleton = {        prop1: "",        prop2: [],        func1 : function(){},        func2: function(){} }

   缺陷是没有构造函数,不能执行初始化方法(用为静态类方法使用还行)

2.匿名函数实现:这是最简单的实现方式,不作任何额外处理,定义类然后立即执行。3.单例的高级实现:控制不允许新的实例对象产生没有考虑第三种,是因为它过于麻烦,为创建单例需要额外花些脚本控制实例的唯一性。采用在第2种方法实现如下:
//错误的实现var singleton = function(){     // ...    return this; }();
后面发现,程序运行时,在同一页面的这两个模块互联测试时页面错乱。这两个模块的实现几乎相同,都是init、createHtml、bindEvent等基础方法。调试时发现,这个方法里面的this不是匿名函数object,而是window。经多次测试,才理解this在function中什么时候是全局对象window,什么时候是当前类对象。将function声明的函数,作为函数调用时,它始终都是全局对象(web页面中是window,如在nodejs那可能就是global了);它此函数以new实例化时,其中的this就是object对象。与是否匿名函数无关。知道原因,解决方法就简单了,还是用第2种思路上实现修改一:在前面添加new关键字
<pre name="code" class="javascript">var singleton =  new function(){      // ...      return this; }; 

修改二:结合思路1的实现,较思路1纯对象实现好的地方是,本方法可以添加初始化逻辑。

var singleton = function(){     var me = {         func1: function(){}     };     me.func2= function(){}     return me; }();

0 0
原创粉丝点击