作用域学习--------this

我们知道，无论何时，this都是有值的。this的取值也是不确定的，定义函数时这个this值是暂时的，函数真正执行时才确定。因为this的取值是执行上下文环境中的一部分，每次调用函数时，都会产生一个新的上下文执行环境，所以，this的取值有可能不同。

全局函数

var a = 5;
function fn(){
    console.log(this);   //window
    console.log(this.a);    //5
}
fn();

在全局环境下，this永远是window.

构造函数

function Fn(){
    this.a = 10;
    this.b = 20;
    console.log(this);//Fn{a=10,b=20};
}
var fn = new Fn();
console.log(fn.a);//10
console.log(fn.b);//20

函数作为构造函数用，那么其中的this就代表它即将new出来的对象。

函数作为对象的一个属性

var mask = {
    a : 10,
    fn : function(){
        console.log(this);     // Object { a=10,  fn=function()}
        console.log(this.a);   //10
    }
}
mask.fn();

函数作为对象的一个属性时，并且作为对象的一个属性被调用时，函数中的this指向该对象。

var mask = {
    a : 10,
    fn : function(){
        console.log(this);     // Window
        console.log(this.a);   //undefined
    }
}
var b = mask.fn;
b();

函数被赋值到了另一个变量中，并没有作为mask的一个属性被调用，那么this的值就是window，this.a为undefined。

函数用call或者apply调用

当一个函数被call和apply调用时，this的值就取传入的对象的值。

function fn(){
    console.log(this);    // Object { a=10}
    console.log(this.a);    //10
}
var mask = {
    a : 10,
}
fn.call(mask);

需要注意的一个情况

var mask = {
    a : 10,
    fn : function(){
        function fnn(){
            console.log(this);    // Window
            console.log(this.a);    //undefined
        }
        fnn();
    }
}
mask.fn();

fnn在对象mask的属性fn中定义的，但是它仍然是一个普通的函数，this仍然指向window。