ES5中提供了三种改变函数中this指针指向的方法,分别如下:
分别为call() apply() bind()
1.call()
var obj={name:"李四"} console.log(this) //在函数中当前的this指向全局对象,此处为window
var obj = {
name: "张三",
say: function (str1, str2) {
console.log(this.name + str1 + str2)
}
}
obj.say.call({ name: "李四" },"参数1", "参数2") // 通过call()方法 改变当前的this指向 现指向为obj
2.apply()
var obj = {
name: "张三",
say: function (str1, str2) {
console.log(this.name + str1 + str2)
}
}
obj.say.apply({ name: "李四" }, ["str1", "str2"]) //通过apply()方法 改变当前得this指向 现指向为obj
1. apply()的用法与call()相似,唯一的不同在于传参的形式 apply传参方式是以数组的方式传参
2. 多个参数用逗号隔开即可 例如:
obj.say.apply({ name: "李四" }, ["参数1", "参数2"])
3.bind()
bind() 方法不会调用函数,但是能改变函数内部this 指向,返回的是原函数改变this之后产生的 新函数
var obj = {
name: "张三",
say: function (str1, str2) {
console.log(this.name + str1 + str2)
}
}
obj.say.bind({ name: "李四" }, "参数1", "参数2")() //通过bind()方法 改变当前得this指向 现指向为obj
1. 不会调用原来的函数 可以改变原来函数内部的this 指向
2. 返回的是原函数改变this之后产生的新函数
3. 如果有的函数我们不需要立即调用,但是又想改变这个函数内部的this指向此时用bind
call、apply、bind三者的异同
共同点 :
都可以改变this指向
不同点:
call 和 apply 会调用函数, 并且改变函数内部this指向.
call 和 apply传递的参数不一样,call传递参数使用逗号隔开,apply使用数组传递
bind 不会调用函数, 可以改变函数内部this指向.
关于js中的this指向见解如下:
在函数定义的时候是无法确定this的指向 只有函数执行的时候才能确定函数的this的指向以及它的 调用者
特殊情况下 如果他的 上一级对象 对它进行调用 那么它的this指向的就是它的上级 俗称调用者 反之 如果没有对象对它进行调用 那指向就是 window
window this指向:
var name = 'jary'; // 当前 (this指向)调用者就是window window.name = jary;
**指向上级调用者:
var a = { //调用者
name:'Tom',
say:function(){ //当前say作为(被)调用者
console.log(this.name); //输出结果为TOM
}
}
a.say(); //当前的this指向为 a
var name = 'jary'; // 当前name没有上级调用 this指向为window
var a = {
name:'Tom',
say:function(name){
console.log(this.name); //输出结果jary 因为a.say()的this指向被重新定义为window 所以它只能获取到在全局声明的name 所以指向为window
}
}
a.say(name);// name:Tom 因为还没有重定义this指向 所以当前name 指向的是函数内部的name Tom
var f = a.say;
f(); // 因为a.say()该方法没有上级调用者 所以该指向为window 函数内的this是window 所以f()的调用者也是window