函数的this指向
1.this的指向
-
this指向函数的调用对象
-
this指事件的调用对象
-
在构造函数中this指向示例对象
-
再prototype原型的方法中,this指向示例对象、
-
找不到函数的调用的this指向window
-
箭头函数没有自己的this,它的this指向上下文中的this(即所处环境的this)
function fn(x, y) { console.log('coming',this); console.log(x + y); } let obj={ name:'nick', hobby:'basketball' } // 调用函数,改变函数中的this fn.call(obj,5,7) //第一个参数改变了this的指向,其他参数对应函数里的参数,立即执行=>call fn.apply(obj,[5,7]) //第一个参数改变了this的指向,第二个参数是个数组,立即执行=>apply let emit = fn.bind(obj,5,7) //第一个参数改变了this的指向,其他参数对应函数里的参数, //但需调用再执行=>bind emit()
call、apply、bind
- call、apply、bind都是Function.prototype的方法,所以每个函数都有call、apply、bind属性。
- call、apply、bind的作用都可改变函数内部的this指向
1.call
- call()的作用
- 改变了原来函数的this指向
- 绑定函数内部的this指向,this指向obj
- 没有返回值,会执行当前函数。
- 传参方式:call()里的第一个参数一个对象,后边参数是用逗号隔开的列表。
fn.call(obj,2,3,4,5)
2.apply
- apply()的作用
- 改变了原来函数的this指向
- 绑定函数内部的this指向,this指向obj
- 没有返回值,会执行当前函数。
- 传参方式:apply()里只有两个参数,第一个参数是一个对象,第二个参数是一个数组
fn.apply(obj,[2,3,4,5])
3.bind
-
bind(obj)的作用
-
改变了原来函数的this指向
-
绑定函数内部的this指向,this指向obj
-
返回值是调用bind方法的函数体本身,不会执行当前函数,要调用一下f()。
-
var obj={
a:1,
b:2
}
function fn(){
console.log(this)
}
var f = fn.bind(obj)
f()//{a:1,b:2}
总结
- call、apply和bind都可以改变函数的this指向
- call、apply和bind第一个参数的是this要指向的对象
- call、apply和bind都可以后续为函数传参,apply是将参数并成一个数组,call和bind是将参数依次列出。
- call、apply都是直接调用,bind生成的this指向改变函数需要手动调用。