后续:
原帖传送门 (是一个讨论氛围非常好的论坛)
也就是说console.log(this)
的this
不指向console
对象
是因为此this
非彼this
在调用console.log(this)
时,这里的this
已经由当前作用域确定了
传进去之后在log
方法里只是一个普通的参数,而不是我之前混淆的log
方法内的this
也就是说之前提到的通法依旧是奏效的,只不过是自己因为惯性思维,把重点放在了log
方法上总以为,从没有怀疑自己是否找错了log
方法上有奥妙this
虽然是一次公开处刑 ,但是让我更加深刻地理解了this的含义以及学到了新的探究问题的方法
这是Uni之前和我讨论的一个问题
找this指向一向是一个重点,也是一个基本功,比较通用的方法就是,方法是被哪个对象调用的,这个方法中的this就指向那个对象
除了箭头函数或使用了
apply, call, bind
的场景下,这个方法一般是奏效的
今天抓住一个大佬问了一波
大佬说的是log方法是由window调用的,但我也知道console对象是挂载在window上面的,可log方法是挂载在console对象上的,window到底是怎么通过window.console.log去调用呢,这跟我平时的认知(指 ↑ 面那个通法)不一样啊!!!(无限钻牛角尖 && 纠结)
虽然最终以console.log.bind(window)(this)
也可以是apply, bind糊弄了过去,但这个理解只能用于理解某个特定对象上,对于函数来说应该具有通用性
也因为有这个模糊的解释,启发我想到了另一个跟this有关的方法——箭头函数,
所以最终用js实现了一个log方法找this的一个方式
const MyConsole = {
log: (...arg) => {
return arg
}
}
const a = {
sayLog: function() {
console.log(...MyConsole.log(this))
console.log(...MyConsole.log(this === a))
}
}
a.sayLog()
箭头函数不绑定this,会捕获其所在的上下文的this值,作为自己的this值
最终打印结果
可以看到和我们平时用的console.log
是一个表现
算是解决了一个小小的疑惑,心情畅快不少
这里算是一个取巧,用了ES6的箭头函数,浏览器底层肯定不是这么实现的,但好奇心也让我想知道在没有ES6的箭头函数的情况下应该怎么去找这个this
(继续钻牛角尖x),对babel更加敬畏了