分享9个让人迷惑的前端面试题（中）

大家好，今天我继续给大家分享8个让人有点迷惑的前端面试题，有些题会有解释，有些不太好解释，主要有点怪异，也不会这样写，也不知道怎么解释，欢迎大家在评论区完善，通过这些面试题，可以帮我梳理前端相关的知识盲点。

问题11，函数的 .length 属性

答案 ：

2
2

函数的 .length 属性打印函数期望的参数长度。

如果有任何可选参数，那么之后的所有参数都将被视为可选参数，无论我们是否声明它们是可选的。因此 ，如果是可选参数，在最后包含可选参数始终是一个好习惯。

问题12，static function 中的 This 输出啥

this 在静态函数中的值是什么？

答案：

// Output
class Test { 
   constructor(lang) {    
      this.lang  = lang; 
   }  
  static showName() {    
    console.log(this, this.lang); 
  } 
}

静态函数中 this 的值是类本身。

当我们在静态方法中使用This，整个类的信息将会输出。

问题13，控制台会打印什么？

答案：

true
true
true
false

问题14，如何检查对象的值是否为对象？

答案：

这里你需要注意加上null的验证，因为null的类型是object。

延伸阅读

在 JavaScript 中，typeof null 也会返回 "object"，这是一个锅。针对这个问题，你还可以使用另一种方法来检查一个变量是否是对象，例如使用Object.prototype.toString.call(obj) 或者 Object.prototype.toString.apply(obj) 如果是对象会返回 "[object Object]"

const x = {};
console.log(Object.prototype.toString.call(x) === "[object Object]")  // true

const y = null;
console.log(Object.prototype.toString.call(y) === "[object Object]")  // false

或者使用 instanceof 操作符来检查一个变量是否是 Object 类的实例。

const x = {};
console.log(x instanceof Object) // true

const y = null;
console.log(y instanceof Object) //false

问题15

Hello
How
HelloHow are you?

问题16

答案：

4,5,6,3,4,5

当我们在数组中执行 .toString() 时，如果它包含原始值，它会将其中的元素字符串化。而 toString() 也将数组展平。

问题17

事件的三个阶段是什么？按照它们出现的顺序写下来。

答案：

1. Capturing phase – the event goes down to the element.2. Target phase – the event reached the target element.3. Bubbling phase – the event bubbles up from the element.

1. 捕获阶段——事件深入到元素。

2. 目标阶段——事件到达目标元素。

3. 冒泡阶段——事件从元素中冒出来。

问题18

答案：

obj.showLang() will print undefined
x.showLang() will print Vue

首先，这段代码创建了一个名为 "obj" 的对象，其中有一个属性 "lang" 和一个方法 "showLang"。在 "showLang" 方法中，使用了 "console.log(this.lang)" 来输出对象的 "lang" 属性。

使用"=>" 箭头函数 定义函数，这种类型的函数会有一个特殊的语法特性，就是箭头函数中的 this 关键字会绑定到其所在的上下文中，这里的上下文是全局对象，所以 this 指的是全局对象。而在全局对象中并没有定义 lang 属性，所以输出的结果是 undefined。

如果把 "showLang" 中的箭头函数换成普通函数，就会得到正确的结果，因为普通函数中的 this 会绑定到调用它的对象上。

如果想在箭头函数中使用对象本身的属性，可以将对象本身赋给一个变量，如下：

const obj = {
  lang: 'react',
  showLang: () => {
    const self = obj;
    console.log(self.lang);
  }
}
obj.showLang();  // react

问题19

答案：

1
1
2
undefined

Promise.resolve(1) 和 Promise.resolve(2) 分别创建了一个已经完成的 promise，它们的值分别为 1 和 2。

第一个 p1.then(console.log) 调用会将值 1 传递给 console.log 函数并打印出来。第二个 p1.then(console.log) 调用会再次将值 1 传递给 console.log 函数并打印出来。

第一个 p2.then(console.log) 调用会将值 2 传递给 console.log 函数并打印出来。第二个 p2.then(console.log) 调用并不会再次将值 2 传递给 console.log 函数并打印出来，因为第二个 then 方法返回的是一个新的 promise，并没有指定回调函数，所以输出了 undefined.

结束

今天的分享就到这里，你是如何理解这些问题的？欢迎大家在评论区交流，希望今天的分享对大家有所帮助，感谢你的阅读，如果你喜欢我的分享，别忘了点赞转发，让更多的人看到，最后别忘记点个关注，你的支持将是我分享最大的动力，后续我会持续输出更多内容，敬请期待。

推荐阅读

JS小知识，分享一些让我迷惑的前端面试题1~10（上）

原文：
https://rahuulmiishra.medium.com/javascript-interview-questions-that-made-me-think-do-i-really-know-javascript-part-2-cfc5f2c919c5

非直接翻译，有自行改编和添加部分。