函数上下文调用与this

139 阅读1分钟
函数this指向

普通函数 普通函数():this 指向window
对象方法 对象名.方法():this 指向对象
构造函数 new 函数名():this 指向创建的实例对象
箭头函数 是没有this指向的.本质是访问上级作用域的this `

let obj = {
  name: '张三',
  eat: function () {
    console.log(this)
  }
}

let fn2 = () => {
  console.log(this)
}

fn()
obj.eat()
new fn()
fn2()

`

image.png

apply(),call(),bind()三种的区别和使用场景

作用:默认情况下,函数的this指向是固定的无法修改.如果需要修改就需要使用函数上下文调用
语法:
函数名.apply(修改this,数组/伪数组)
函数名.call(修改this,形参1,形参2...)
函数名.bind(修改this)
三者的相同点和不同点:
相同点:作用一致,都可以修改this的指向
不同点:传参方式不同
执行机制不同:apply()和call()会立即执行函数
bind()不会立即执行,而是会返回一个修改this之后的新函数