JavaScript this的理解

一直对js的this不怎么理解，最近看了JavaScript 语言精髓的相关章节，有点清晰的理解了，记录记录

/*

 来自： JavaScript 语言精髓

 方法：当一个函数被定义为对象的一个属性时，我们称它为一个方法.

 this : 在函数访问this时，this被绑定到了 全局对象.

 */

//全局函数

var log = function(msg){

    document.writeln("<br>" + msg + "<br>");

};

log("**************thistest.js***************");

//定义一个全局变量

var value = 100;

//函数

var add = function(a, b){

    var value = 11;

    //访问内部变量

    log("add:value = " + value); // 输出 add:value = 11

    //此时访问this时，this绑定的全局对象，如 this.value 可以访问到上面定义的 value

    log("add:this.value = " + this.value); // 输出 100

    return a + b;

}

// add是一个函数，在add里访问 this ，this绑定到的是全局对象

add(1, 2);

//输出：

//add:value = 11

//add:this.value = 100

下面定义一个对象

//对象

var myObj = {

    //对象的属性

    value:0,

    //方法

    increment:function(inc){

        //此时访问this时，this绑定的时myObj对象

        log("myObj.increment():myObj.value = " + this.value);//输出 myObj.value 的值

        //调用一次 value的值增加1

        this.value += typeof inc ==='number'?inc : 1;

    }

};

有时候我们在方法内部会定义函数，那么函数怎么调用对象属性呢,如果在函数内容直接用this是访问不到对象的

//对象

var myObj = {

    //对象的属性

    value:0,

    //方法

    increment:function(inc){

        //此时访问this时，this绑定的时myObj对象

        log("myObj.increment():myObj.value = " + this.value);//输出 myObj.value 的值

        //调用一次 value的值增加1

        this.value += typeof inc ==='number'?inc : 1;

        //定义内部函数，注意还是函数，所以函数内部访问this还是只能访问到 全局对象

        var inFun = function(){

            //此时访问this时，this绑定的全局对象，如 this.value 可以访问到上面定义的 value

            log("myObj.increment.inFun:this.value = " + this.value);

        };

        inFun();

    }

};

为了能在inFun函数内访问到myObj对象，我们先把myObj对象保存在一个变量里,

//对象

var myObj = {

    //对象的属性

    value:0,

    //方法

    increment:function(inc){

        //把当前对象myObj引用保存在self变量,随后的函数就可以访问self 来代替访问myObj对象

        var self = this;

        //此时访问this时，this绑定的时myObj对象

        log("myObj.increment():myObj.value = " + this.value);//输出 myObj.value 的值

        //调用一次 value的值增加1

        this.value += typeof inc ==='number'?inc : 1;

        //定义内部函数，注意还是函数，所以函数内部访问this还是只能访问到 全局对象

        var inFun = function(){

            //此时访问this时，this绑定的全局对象，如 this.value 可以访问到上面定义的 value

            log("myObj.increment.inFun:this.value = " + this.value);

            //

            log("myObj.increment.inFun:myObj.value = " + self.value);

        };

        inFun();

    }

};

给 myObj增一个double方法

myObj.double = function(){

    var self = this;

    var helper = function(){

        //此处不能用 this.value 访问到myObj.value的值

        //add函数前的this可以省略，也可以用 this.add(a,b);

        self.value = add(self.value, self.value);

    };

    helper();

};

调用double方法，即可使用myObj.value的值翻倍

巴特西

JavaScript this的理解

最新文章

热门文章