this解析

89 阅读2分钟
var length = 10;
function fn () {
    console.log(this.length);
}
var obj = {
    length: 5,
    method: function (fn) {
        fn();
        arguments[0]();
    }
};
 
obj.method(fn, 1);
/* 
复制代码问:浏览器的输出结果是什么?
它的答案是:先输出一个 10,然后输出一个 2。
让我们来解析一下原因:

在我们这道题中,虽然 fn 作为 method 的参数传了进来,
但它的调用者并不受影响,任然是 window,所以输出了 10。
arguments[0]();这条语句并不常见,可能大家有疑惑的点在这里。 
其实,arguments 是一种特殊的对象。在函数中,我们无需指出参数名,就能访问。
可以认为它是一种,隐式的传参形式。
当执行 arguments0; 时,其实调用了 fn()。
而这时,fn 函数中 this 就指向了 arguments,这个特殊的对象。
obj.method 方法接收了 2 个参数,
所以 arguments 的 length,很显然就是 2 了。 */



var length = 10;
function fn () {
    console.log(this.length);
}
var obj = {
    length: 5,
    method: function (fn) {
        // 在这里用call 将 this 指向 obj 自己
        fn.call(this);
    }
};
obj.method(fn);
/* 复制代码输出的结果就是 5 了,搞定。 */


window.val = 1;
var obj = {
    val: 2,
    dbl: function () {
        this.val *= 2; 
        val *= 2;
        console.log('val:', val);
        console.log('this.val:', this.val);
    }
};

obj.dbl();
var func = obj.dbl;
func();

/* 复制代码答案是输出:2 、 4 、 8 、 8 。
解析:
执行 obj.dbl(); 时, this.val 的 this 指向 obj,而下一行的 val 指向 window。所以,由 window.val 输出 2,obj.val 输出 4 。
最后一行 func(); 的调用者是 window。 所以,现在的 this.val 的 this 指向 window。
别忘了刚才的运算结果,window.val 已经是 2 了,所以现在 this.val *= 2; 的执行结果就是 4。
val *= 2; 的执行结果,就是 8 了。 所以,最终的结果就是输出 8 和 8 。

 */

 
 
window.val = 1;
var obj = {
    val : 10,
    dbl: function(){
        this.val *= 2;
    }
} 
obj.dbl();  //obj.val 变为20
var dbl = obj.dbl;
dbl(); //作为普通函数调用,window.val变为2
obj.dbl.call(window);  //函数借用,window.val变为4
alert(window.val + obj.val );   //24


(function(){
    var val = 1;
    var obj = {
        val: 10,
        dbl: function(){
            this.val *= 2;
        }
    }
    obj.dbl();  //obj.val变为20
    alert( obj.val + val ); //21
})();   
 

 
var num = 10;
var myObject = {       
    num : 2,       
    add : function(){        
        this.num = 3;   //将myObject.num改为3
        (function(){
            console.log( this.num );  //立即自行函数中this指向window,即10
            this.num = 4;  //将windwo.num改为4
        })();
        console.log( this. num );  //输出myObject.num 3
    },    
    sub : function(){
        console.log( this.num );
    }   
}
myObject.add();  //10, 3
console.log( myObject.num );  //3
console.log( num );  //4
var sub = myObject.sub;  //sub作为普通函数调用,this指向window
sub();  //4
 


Function.prototype.pointTo = function(o){
    var _this = this;
    return  function(){           
        return _this.apply(o, arguments);       
    };
};

var o = {
    name:"this=o"
};
o.b = ( function(){
    return this;
}).pointTo(o);
   
var o1 = {
    name: "this=o1",
    b: o.b
};
    
var a = o1.b();
alert(a.name); //this=o

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

\