意想不到的的控制台输出?(预编译、隐式类型转换、强制类型转换、this指向、事件循环)

原文链接,讲解更加详细:www.yuque.com/yw8upm/gr7b…

仔细看下,内容如图,你觉得会输出什么?

不要再想着直接复制粘贴到浏览器运行了[狗头]

image.png

答案是

1undefined, funtion arg(){}
2undefined
3108
4、undefind
5、我是熊大,年龄77
6、我是熊大,年龄188
7、我是熊大, 年龄88
复制代码

why?听我娓娓道来

第一条:demo(18)执行 触发console.log(obj1, arg)

答案undefined, funtion arg(){}

  • obj1 >>> undefined 这里可能大部分人都知道,因为函数的变量提升
  • arg >>> function 是为啥呢?为啥不是 18

这里要引出第一个知识点:预编译

预编译

运行函数demo的前一刻发生了预编译环节

  • 第一步,生创建AO(Activation Object)对象:可以理解为demo这个函数拥有的一个冰箱,在执行内部代码时就通过这个冰箱来取东西(变量,函数…)
  • 第二步,将形参和变量声明当作AO的属性名,值为undefined
  • 第三步,将形参和实参相统一。
  • 第四步,在函数体里找函数声明,将值赋为函数体

实参18 其实是在第三步。而第四步又被函数体所覆盖。所以第一条arg是function…

第二条 执行console.log(length)

答案undefined。 这个不用讲。

第三条 执行console.log(length)没有疑问吧

答案108。 这里已经执行了赋值length = 108

第四条 执行if(console.log("undefined") || ....

答案undefined, 没有想到吧?if判断条件内的也会被浏览器执行。
不光是可以执行,而且还没有返回值。所以这个时候回走进后面的或 (!!”” + “1” && typeof typeof null && !!length)
然后进行一系列操作:

  • !!”” + “1” >>> 字符串false1(强制类型转换)
  • typeof typeof null >>> typeof “object” >>> 字符串string

第五条 执行obj2.say(光头强,77)没有疑问吧

答案熊大,77setTimeout 你先等等!! 为啥不是光头强呢?因为say的this是obj1呀。

第六条 执行promise.then : obj2.say(光头强,age)

第七条 执行obj1.say(熊三,88)

第六第七条,就是setTimeout 和promise的较量,也就是当然是微任务promise.then先执行了。

原文链接,讲解更加详细:www.yuque.com/yw8upm/gr7b…

© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享