Web 前端开发

关于this对象的一个易错点

2017-04-26  本文已影响0人  aermin

tips:接下去会在github写博客,简书不再更新和修改文章,欢迎大家逛逛我的新博客点击查看 ,我会尽量用更容易理解的方式写好每一篇博客,大家一起学习交流😄。

先给一个例子

var name = "The Window"
var object = {
    name : "My Object",
    
    f1 : function(){
       return function(){
           return this.name;
        };
    }
 };

  alert(object.f1()());  
       

这个例子返回的字符串是 "The Window",为啥不是"My Object"呢?

修改后的例子如下

var name = "The Window"
var object = {
    name : "My Object",
    
    f1 : function(){
       var that = this; //添加这行
       return function(){
           return this.name;
        };
    }
 };

  alert(object.f1()()); 

返回"My Object"

另外一个例子

var name = "The Window•;
var object = {
    name : "My Object";
    getName: function() {
         return this.name;
    }
 };

上一个例子中的
return function(){
return this.name;
}
被换掉了,不再是闭包

object.getName(); //'My Object'
(object.getName)(); //'My Object"
(object.getName = object.getNamel (); //"The Window•, 在非严格模式下

第一行代码跟平常一样词用了object.getName (), 返回的是飞y Object", 因为this.name就是object.name。

第二行代码在调用这个方法前先给它加上了括号。虽然加上括号之后, 就好􀉀只是在引用一个函数, 但this的值得到了维持, 因为objec七.getName 和(object.getName)的定义是相同的。

第三行代码先执行了一条赋值语句,然后再诮用赋值后的结果。因为这个赋值表达式的值是函数本身, 所以this的值不能得到维持, 结果就返回了崎The Window飞

上一篇 下一篇

猜你喜欢

热点阅读