this的用法想必大家都是知道,简单理解this就是谁调用我,我只向谁。
在一般文章介绍中,都是介绍改变this指向的方法,如使用call、apply、bind
但经过测试,这句话一说出来就很不严谨。
关于this指向的细节
举例
var obj = {
name:'vicer'
}
function person(){
console.log(this.name)
}
person.call(obj)
这里很容易得出,打印{name: "vicer"}。
不就是改变了this的指向吗?怎么不严谨了。我们接着往下看
我们添加一行代码
var obj = {
name:'obj'
}
function person(){
this.currentname = 'person'
console.log(this)
}
person.call(obj)
此时this打印的是谁的this?
{name: "obj", currentname: "person"}
两个this指向都打印出来了,所以这里使用call()、apply()、bind()时,他们都是添加this的指向(而不是改变)
唯一的区别只不过用法不同。
还有一种情况,让我们直接看代码
var obj = {
name:'obj'
}
function person(){
this.name = 'person'
console.log(this)
}
person.call(obj)
此时this中有两个name,这里就不卖关子了,优先打印的是person中的this
{name : "person"}
call、apply、bind的区别
这里再介绍一下区别
-
call后面传参数时,参数用逗号分隔
var obj = { name: 'vicer' } function person(height, age) { console.log('名字:'+this.name) console.log('身高'+height) console.log('年龄'+age) } person.call(obj, 185, 18) //名字:vicer //身高185 //年龄18
-
apply后面传参数时,只能以数组方式传入
person.apply(obj, [185, 18])
-
bind传入参数,可以用逗号分隔,也可以传入数组,但需要主动调动才能改变this
var p = person.bind(obj, 185, 18); p();