this指向

116 阅读1分钟

this指向

一共三个规则.

function foo() {
  console.log(this.a)
}
var a = 1
foo() // 1

const obj = {
  a: 2,
  foo: foo
}
obj.foo() // 2

const c = new foo()
  • foo()直接调用, this指向window
  • obj.foo() 谁调用, 谁是this
  • new 之后, this 永远被绑定在c上面, 不被任何方式改变.

箭头函数中的this

箭头函数没有this, 取决于包裹层.

对箭头函数使用.bind是无效的.

bind函数

bind函数中的this取决于第一个参数, 为空是window

let a = {}
let fn = function () { console.log(this) }
fn.bind().bind(a)() // => window

不管bind几次,都是第一次bind

this指向的优先级

new > bind > obj.foo() > foo()
flowchart TD
寻找函数foo中的this --> juedge[判断函数类型] 
juedge -- 箭头函数 --> 包裹箭头函数的第一个普通函数中的this
juedge -- 普通函数 --> how[函数被如何调用]
juedge -- bind,call,apply --> this是第一个参数

how -- 除了new的方式 --> how2[foo还是obj.foo]
how -- new的方式 --> this被固化在实例上

how2 -- foo --> this为window
how2 -- obj.foo --> this为obj