1.背景介绍
这个关键字是JavaScript中最复杂的机制之一。它是一个很特别的关键字,被自动定义在所有函数的作用域中。
这个提供了一种更优雅的方式来隐式“传递”一个对象引用,因此可以将API设计得更加简洁并且易于复用。
2.知识剖析
这认知误区
1指向函数
2指向函数作用域
// 1 指向函数
function fn1 (num) {
this.count ++;
console.log('count:'+num);
}
fn1.count = 0;
for(var i =0;i <10 ;i ++) {
if(i>5) {
fn1(i);
}
}
console.log(fn1.count);
// 2 指向作用域
function fn2(){
var a= 1;
this.fn3();
}
function fn3(){
console.log(this.a);
}
this 的绑定和函数声明的位置没有任何关系,只取决于函数的调用方式。this 是函数调用时产生一个属性,会在函数执行的过程中用到。
这个绑定机制
每个函数的这是在调用时被绑定的,完全取决于函数的调用位置
1默认绑定2隐式绑定3显示绑定4 new绑定
// 1 默认绑定
var a = 'global';
function fn4(){
'use strict';
console.log(this.a);
}
// 2 隐式绑定
var obj = {
a: 'local',
fn: fn4,
};
// 3 显示绑定
fn4.call(obj);
fn4.apply(obj);
// 4 new绑定
function fn5(a) {
this.a = a;
}
var obj1 = new fn5(1);
这个绑定方式优先级
1.函数是否在新函数中调用(new绑定)?如果是的话这个绑定的是新创建的对象。
2.函数是否通过call,apply(显式绑定)或者硬绑定调用?如果是的话,this绑定的是指定的对象。
3.函数是否在某个上下文对象中调用(隐式绑定)?如果是的话,这个绑定的是那个上下文对象。
4.如果都不是的话,使用默认绑定。如果在严格模式下,就绑定到undefined,否则绑定到全局对象。
绑定机制 | 方法 | 严格模式 | 优先级 |
---|---|---|---|
默认绑定 | 全局调用 | 类型错误:未定义 | 4 |
隐式绑定 | 间接调用 | 3 | |
显示绑定 | 使用调用,应用方法 | 2 | |
新绑定 | 新调用函数 | 1 |
3.常见问题
去除这个绑定机制
4.解决方案
使用作用域代替
var self = this;
var that = this;
5.扩展思考
引入第三方库之后,第三方库可能使用此,存在这种绑定错误时效的可能。
6.参考文献
一参考 你不知道的JavaScript的上卷
7.更多讨论
问:这用来做什么
答:这是对象的引用。
问:这绑定有几种方法
答:1默认绑定2隐式绑定3显示绑定4 new绑定
问:这个绑定的优先级
答:
1.函数是否在新中调用(new绑定)?如果是的话这个绑定的是新创建的对象。
2.函数是否通过call,apply(显式绑定)或者硬绑定调用?如果是的话,this绑定的是指定的对象。
3.函数是否在某个上下文对象中调用(隐式绑定)?如果是的话,这个绑定的是那个上下文对象。
4.如果都不是的话,使用默认绑定。如果在严格模式下,就绑定到undefined,否则绑定到全局对象。