this
this是js的关键字
他是根据执行上下文(执行环境)动态指向当前调用的对象;
谁调用,就指谁
一、全局作用域下:this始终指向window对象
二、函数作用域下:函数被谁调用,this就指向谁
三、对象中的函数作用域下:this指向该方法所属的对象
四、在构造函数中:this始终指向新对象
五、自执行函数中:this指向window
六、箭头函数中:this是在定义是绑定到了父级对象上,不是在执行过程中绑定的
注意:匿名函数的this就指向window,没有其他结果
// 1,全局this指window
console.log(this); // window
function foo() {
console.dir(this);
}
// 2,全局函数的this也指window
foo(); // window
// 3,事件处理函数this指事件触发对象
document.body.onclick = foo; // body
// 4,对象方法里的this 指对象本身
var obj = {foo}; // {foo: foo}
obj.foo(); // obj
// 4.1, 谁调用就指谁
var obj1 = {};
obj1.foo = obj.foo;
obj1.foo(); // obj1
var obj2 = {};
//5,匿名函数的this指window
(obj2.foo = obj1.foo)(); // window
(obj2.foo)();
function () {
// this window
obj2.foo(); // obj2
}
js改变this指向的3种方法: call apply bind
call(thisObj, 参数1,参数2 …)
方法可以指定this 的指向(即函数执行时所在的的作用域),然后再指定的作用域中,执行函数
方法的参数,应该是对象obj,如果参数为空或null,undefind,则默认传参全局对象
第一个参数是this指向的对象,第二个及后面的是函数回调所需的入参
var person = {
name: 'zhangsan',
age: 20
}
function say(x, y){
console.log(this.name)
console.log(this.age)
console.log(x, y)
}
say.call(person, 1, 2)
// zhangsan
// 20
// 1 2
apply(thisObj, [参数1,参数2 …])
第一个参数也是this所要指向的那个对象,如果设为null或undefined,则等同于指定全局对象。
第二个参数则是一个数组,该数组的所有成员依次作为参数,传入原函数。在apply方法中,必须以数组形式添加。
var person = {
name: 'zhangsan',
age: 20
}
function say(x, y){
console.log(this.name)
console.log(this.age)
console.log(x, y)
}
say.apply(person, [1, 2])
// zhangsan
// 20
// 1 2
bind(thisObj, 参数1,参数2 …)
bind 用于将函数体内的this绑定到某个对象,然后返回一个新函数
var person = {
name: 'zhangsan',
age: 20
}
function say(x, y){
console.log(this.name)
console.log(this.age)
console.log(x, y)
}
say.bind(person, 1, 2)();
// zhangsan
// 20
// 1 2
三种方法的比较
call 、 apply 、bind 均能改变this 指向
bind 每次执行产生一个新函数,call、apply 不会
call ,bind 接收多个参数绑定到函数并且参数单一传入,apply 接收方式为数组