
课程咨询: 400-996-5531 / 投诉建议: 400-111-8989
认真做教育 专心促就业
多对Java有了解的人都知道JavaScript中this有四种绑定模式,分别是:默认绑定,隐式绑定,显式绑定和new绑定。这里小编请烟台IT培训的老师分析一下他们的优先级。
上面说的这四种绑定规则基本上涵盖了所有函数调用情况。但是如果同时应用了这四种规则中的两种甚至更多,又该是怎么样的一个情况,或者说这四种绑定的优先级顺序又是怎么样的。
首先,很容易理解,默认绑定的优先级是最低的。这是因为只有在无法应用其他this绑定规则的情况下,才会调用默认绑定。那隐式绑定和显式绑定呢?还是上代码吧,代码可从来不会说谎。
function speak() {
console.log(this.name)
}
var obj1 = {
name: 'obj1',
speak: speak
}
var obj2 = {
name: 'obj2'
}
obj1.speak() // obj1 (1)
obj1.speak.call(obj2) // obj2 (2)
所以在上面代码中,执行了obj1.speak(),speak函数内部的this指向了obj1,因此(1)处代码输出的当然就是obj1,但是当显式绑定了speak函数内的this到obj2上,输出结果就变成了obj2,所有从这个结果可以看出显式绑定的优先级是要高于隐式绑定的。事实上我们可以这么理解obj1.speak.call(obj2)这行代码,obj1.speak只是间接获得了speak函数的引用,这就有点像前面所说的隐式绑定丢失了上下文。好,既然显式绑定的优先级要高于隐式绑定,那么接下来再来比较一下new 绑定和显式绑定。
function foo(something) {
this.a = something
}
var obj1 = {}
var bar = foo.bind(obj1) // 返回一个新函数bar,这个新函数内的this指向了obj1 (1)
bar(2) // this绑定在了Obj1上,所以obj1.a === 2
console.log(obj1.a)
var baz = new bar(3) // 调用new 操作符后,bar函数的this指向了返回的新实例baz (2)
console.log(obj1.a)
console.log(baz.a)
我们可以看到,在(1)处,bar函数内部的this原本指向的是obj1,但是在(2)处,由于经过了new操作符调用,bar函数内部的this却重新指向了返回的实例,这就可以说明new 绑定的优先级是要高于显式绑定的。
至此,四种绑定规则的优先级排序就已经得出了,分别是
new 绑定 > 显式绑定 > 隐式绑定 > 默认绑定
如果你还有什么疑问,就来烟台it培训班咨询吧!