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

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

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

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

答案是

1、undefined, funtion arg(){}
2、undefined
3、108
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)没有疑问吧

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

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

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

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

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