this指window
简单说说this指向
全局中的this 指 window;
普通函数中的this指 window;
自调用函数中的this window;
定时器中的this指 window;
事件函数中的this 指的是 事件源;
箭头函数中的this 指的是 上一级中的this;
对象方法中的this指的是 对象;
改变this的指向:
this 指向:
1. 全局上下文(函数外)
无论是否为严格模式,均指向全局对象。注意:严格模式下全局对象为undifined
2. 函数上下文(函数内)
默认的,指向函数的调用对象,且是最直接的调用对象:
简单调用,指向全局对象注意:严格模式下全局对象为undifined,某些浏览器未实现此标准也可能会是window
说这么多那我们就来段代码玩玩this指向
改变this指向的方式:
1. 第一种: new关键字改变this指向
//构造函数版this
function Fn(){
this.user = "李某";
}
var a = new Fn();
console.log(a.user); //李某
/*----------------------------------------*/
2. 第二种: call()
// 把b添加到第一个参数的环境中,简单来说,this就会指向那个对象
var a = {
user:"李某",
fn:function(){
console.log(this.user); //李某
}
}
var b = a.fn;
b.call(a); //若不用call,则b()执行后this指的是Window对象
/*----------------------------------------*/
3. 第三种:apply()
// apply方法和call方法有些相似,它也可以改变this的指向,也可以有多个参数,但是不同的是,第二个参数必须是一个数组
var a = {
user:"李某",
fn:function(){
console.log(this.user); //李某
}
}
var b = a.fn;
b.apply(a);
/*----------------------------------------*/
4. 第四种:bind()
// bind方法返回的是一个修改过后的函数,
// bind也可以有多个参数,并且参数可以执行的时候再次添加,但是要注意的是,参数是按照形参的顺序进行的。
var a = {
user:"张三",
fn:function(){
console.log(this.user); //张三
}
}
var b = a.fn;
var c = b.bind(a);
c();
bind()方法主要就是将函数绑定到某个对象,
bind()会创建一个函数,函数体内的this对象的值会被绑定到传入bind()第一个参数的值
箭头函数this:
由于箭头函数不绑定this, 它会捕获其所在(即定义的位置)上下文的this值, 作为自己的this值
1. 所以 call() / apply() / bind() 方法对于箭头函数来说只是传入参数,对它的 this 毫无影响。
2. 考虑到 this 是词法层面上的,严格模式中与 this 相关的规则都将被忽略
作为方法的箭头函数this指向全局window对象,而普通函数则指向调用它的对象
|