JS—-this指向（二）

摘要： 箭頭函式中this物件就是定義時所在的作用域，也就是說箭頭函式本身沒有this，內部的this就是外層程式碼塊作用域中的this。 1、獨立函式 var a = 0 var test = ()=> { var a = 1 console.log(this.a) }...

箭頭函式中this物件就是定義時所在的作用域，也就是說箭頭函式本身沒有this，內部的this就是外層程式碼塊作用域中的this。

1、獨立函式

var a = 0
var test = ()=> {
var a = 1
console.log(this.a)
}

test()//0

該箭頭函式在全域性環境中定義，即this指向window

2、物件的方法

var a = 0
var obj = {
a: 1,
foo: ()=> {
console.log(this.a)
}
}

obj.foo()//0

即：
var a = 0
var obj = new Object
obj.a = 1
obj.foo = ()=> {
console.log(this.a)
}
obj.foo()

如上所示，foo在全域性中定義,所以this指向window，那麼如何使this指向obj?

根據上一篇介紹，當函式作為物件的方法呼叫時this指向該物件，可以這樣改寫：

var a = 0
function foo(){
var func = () => {
console.log(this.a)
}
return func
}
var obj = {
a : 1,
foo:foo
}
obj.foo()()//1

func在foo呼叫時定義，此時的foo所在作用域為obj，因此this指向obj

3、建構函式,因箭頭函式沒有this,固不能用作建構函式，否則會報錯

var foo = ()=> {
console.log(this)
}
var boo = new foo()//foo is not a constructor

4、bind/call

var a = 0

var func = ()=> {
console.log(this.a)
}

var obj = {
a: 1
}

func.call(obj)//0

如上：func定義在全域性，因此列印0，同對象方法，我們可以通過如下改寫，打印出1

var a = 0

var func = function() {
var boo = ()=> {
console.log(this.a)
}
return boo
}

var obj = {
a: 1
}

func.call(obj)() //1