细说 Javascript 函数篇(二) : this 的事情机制

与其他编程言语比拟,Javascriptthis 的运用是一套完整差别的机制。this 在五种情况下的值是各有差别的。

全局作用域下

this;

当在全局作用域中运用 this,它指向全局对象。
这里细致引见下全局对象:

全局对象(Global object) 是在进入任何实行上下文之前就已建立了的对象;
这个对象只存在一份,它的属性在顺序中任何处所都能够接见,全局对象的生命周期终止于顺序退出那一刻。
全局对象初始建立阶段将 Math、String、Date、parseInt 作为自身属性,等属性初始化,一样也能够有分外建立的别的对象作为属性(其能够指向到全局对象自身)。比方,在 DOM 中,全局对象的 window 属性就能够援用全局对象自身。
所以在 console 内输入 windowthis.window 是一样的。

挪用一个函数时

foo();

在这里,this 一样指向全局对象。

挪用一个要领时

test.foo(); 

在这个例子中,this 将会指向 test 对象。

挪用一个组织函数时

new foo();

一个函数在被挪用时和关键字 new 一同运用,我们称之为组织函数。此时在函数内,this 指向新建的对象。

显式设置时

function foo(a, b, c) {}//

var bar = {};
foo.apply(bar, [1, 2, 3]); // array will expand to the below
foo.call(bar, 1, 2, 3); // results in a = 1, b = 2, c = 3

当运用 Function.prototypeapplycall 要领时,this 的值为显式设置为该要领的第一个参数。
因而,差别于挪用一个函数时的划定规矩,上例中 this 指向了 bar
这里引见下 callapply 要领:

call 要领:
语法:call([thisObj[,arg1[, arg2[, [,.argN]]]]])
定义:挪用一个对象的一个要领,以另一个对象替代当前对象。

apply 要领:
语法:apply([thisObj[,argArray]])
定义:运用某一对象的一个要领,用另一个对象替代当前对象。

在这里我们要注意一点,在对象的字面声明时,this 不能用来指向对象自身。以下:

var obj = {me: this}

这里,this 不会指向 objthis 的运用只限于以上五种情况。

总结

只管上述情况在大多时刻是有意义的,然则第二种情况(即挪用一个函数时)的 this 实际上是很少有用处的,这被认为是 Javascript 设想上的另一个毛病。

Foo.method = function() {
    function test() {
        // this is set to the global object
    }
    test();
}

依据我们上面所述,这里的 this 将会指向全局对象,而不是 Foo 函数。
为了在 test 中取得指向 Foo 的门路,我们需要在 method 内部建立一个局部变量指向 Foo

Foo.method = function() {
    var that = this;
    function test() {
        // Use that instead of this here
    }
    test();
}

that 只是一般的变量名,然则它经常被用来指向外部的 this
另有一个比较有意思的处所与函数别号相干,行将一个要领赋值给一个变量时。

var test = someObject.methodTest;
test();

上例中,test 将会被当作一个一般函数对待,所以依据第二种情况(即挪用一个函数时),其内部的 this 将会指向全局变量,而不是 someObject
只管,this 晚绑定初看上去是个不好的决议,但实际上这是原型式继续事情的基本。

function Foo() {}
Foo.prototype.method = function() {};

function Bar() {}
Bar.prototype = Foo.prototype;

new Bar().method();

此时,当 method 被挪用时,它将指向 Bar 的实例对象。

参考

http://bonsaiden.github.io/JavaScript-Garden/#function.this

    原文作者:StephenLee
    原文地址: https://segmentfault.com/a/1190000000483402
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞