本文 对比了 对象中的 箭头函数 普通函数 和 函数中的 箭头函数 普通函数 四种情况问题
var name = 999
// 第一种
const obj3 = {
name: 66,
fn: () =>{
console.log(this.name)
}
}
// 第2种
const obj4 = {
name: 888,
fn: function() {
console.log(this.name)
}
}
obj3.fn() //999
var tt1 = obj3.fn
tt1()//999
obj4.fn()//888
var tt2 = obj4.fn
tt2()//999
// 第3种
function test() {
this.name = 'kk'
this.fn = ()=> {
console.log(this.name)
}
}
var aa = new test()
var aha = aa.fn
aa.fn() // kk
aha() // kk
// 第4种
function test2() {
this.name = 'kk'
this.fn = function() {
console.log(this.name)
}
}
var bb = new test2()
var cc = bb.fn
bb.fn() // kk
cc() // 999
结论
定义的对象中出现 箭头函数时 对象并没有封装this, 此时箭头函数的this一直指向最外层 也就是window
定义的对象中出现 普通函数时 对象并没有封装this, 此时调用 obj.fn() 相当于对函数执行了 显示绑定 所以this指向了这个对象
定义的函数中出现 箭头函数时 由定义时决定
定义的函数中出现 普通函数时 由运行时决定