摘要：在第四次調用時，回調函數依然沒有返回值。累加器再次為，當前值為。

經常寫業務就容易忽視對基礎知識的補充和加強，但在面試中，基礎知識點是非常重要的考核部分。本文要分享的是，一位開發者每天都會發布的 JavaScript 問題。有的容易，有的會有難度，對基礎知識的查缺補漏非常有幫助，也是你進階路上必然要掌握的知識。

以下挑選了10個問題，緊跟其后的就是對這道題的詳細解答。如果你想看所有的題目，最后有鏈接直達。

for (var i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 1)
}

for (let i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 1)
}

A: 0 1 2 和 0 1 2

B: 0 1 2 和 3 3 3

C: 3 3 3 和 0 1 2

答案: C

由于 JavaScript 的事件循環，setTimeout 回調會在遍歷結束后才執行。因為在第一個遍歷中遍歷 i 是通過 var 關鍵字聲明的，所以這個值是全局作用域下的。在遍歷過程中，我們通過一元操作符 ++ 來每次遞增 i 的值。當 setTimeout 回調執行的時候，i 的值等于 3。

在第二個遍歷中，遍歷 i 是通過 let 關鍵字聲明的：通過 let 和 const 關鍵字聲明的變量是擁有塊級作用域（指的是任何在 {} 中的內容）。在每次的遍歷過程中，i 都有一個新值，并且每個值都在循環內的作用域中。

function getPersonInfo(one, two, three) {
  console.log(one)
  console.log(two)
  console.log(three)
}

const person = "Lydia"
const age = 21

getPersonInfo`${person} is ${age} years old`

A: "Lydia" 21 ["", " is ", " years old"]

B: ["", " is ", " years old"] "Lydia" 21

C: "Lydia" ["", " is ", " years old"] 21

答案: B

如果使用標記模板字面量，第一個參數的值總是包含字符串的數組。其余的參數獲取的是傳遞的表達式的值！

function sayHi() {
  return (() => 0)()
}

typeof sayHi()

A: "object"

B: "number"

C: "function"

D: "undefined"

答案: B

sayHi 方法返回的是立即執行函數(IIFE)的返回值.此立即執行函數的返回值是 0， 類型是 number

參考：只有7種內置類型：null，undefined，boolean，number，string，object 和 symbol。 function 不是一種類型，函數是對象，它的類型是object。

const a = {}
const b = { key: "b" }
const c = { key: "c" }

a[b] = 123
a[c] = 456

console.log(a[b])

A: 123

B: 456

C: undefined

D: ReferenceError

答案: B

對象的鍵被自動轉換為字符串。我們試圖將一個對象 b 設置為對象 a 的鍵，且相應的值為 123。

然而，當字符串化一個對象時，它會變成 "[object Object]"。因此這里說的是，a["[object Object]"] = 123。然后，我們再一次做了同樣的事情，c 是另外一個對象，這里也有隱式字符串化，于是，a["[object Object]"] = 456。

然后，我們打印 a[b]，也就是 a["[object Object]"]。之前剛設置為 456，因此返回的是 456。

const person = { name: "Lydia" }

function sayHi(age) {
  console.log(`${this.name} is ${age}`)
}

sayHi.call(person, 21)
sayHi.bind(person, 21)

A: undefined is 21 Lydia is 21

B: function function

C: Lydia is 21 Lydia is 21

D: Lydia is 21 function

答案: D

使用這兩種方法，我們都可以傳遞我們希望 this 關鍵字引用的對象。但是，.call 是立即執行的。

.bind 返回函數的副本，但帶有綁定上下文！它不是立即執行的。

[1, 2, 3, 4].reduce((x, y) => console.log(x, y));

A: 1 2 and 3 3 and 6 4

B: 1 2 and 2 3 and 3 4

C: 1 undefined and 2 undefined and 3 undefined and 4 undefined

D: 1 2 and undefined 3 and undefined 4

答案: D

reducer 函數接收4個參數:

Accumulator (acc) (累計器)

Current Value (cur) (當前值)

Current Index (idx) (當前索引)

Source Array (src) (源數組)

reducer 函數的返回值將會分配給累計器，該返回值在數組的每個迭代中被記住，并最后成為最終的單個結果值。

reducer 函數還有一個可選參數initialValue, 該參數將作為第一次調用回調函數時的第一個參數的值。如果沒有提供initialValue，則將使用數組中的第一個元素。

在上述例子，reduce方法接收的第一個參數(Accumulator)是x, 第二個參數(Current Value)是y。

在第一次調用時，累加器x為1，當前值“y”為2，打印出累加器和當前值：1和2。

例子中我們的回調函數沒有返回任何值，只是打印累加器的值和當前值。如果函數沒有返回值，則默認返回undefined。 在下一次調用時，累加器為undefined，當前值為“3”, 因此undefined和3被打印出。

在第四次調用時，回調函數依然沒有返回值。 累加器再次為 undefined ，當前值為“4”。 undefined和4被打印出。

const firstPromise = new Promise((res, rej) => {
  setTimeout(res, 500, "one");
});

const secondPromise = new Promise((res, rej) => {
  setTimeout(res, 100, "two");
});

Promise.race([firstPromise, secondPromise]).then(res => console.log(res));

A: "one"

B: "two"

C: "two" "one"

D: "one" "two"

答案: B

當我們向Promise.race方法中傳入多個Promise時，會進行 優先 解析（注：只要有一個成功或失敗，就立馬結束）。在這個例子中，我們用setTimeout給firstPromise和secondPromise分別設定了500ms和100ms的定時器。這意味著secondPromise會首先解析出字符串two。那么此時res參數即為two，是為輸出結果。

function greeting() {
  throw "Hello world!";
}

function sayHi() {
  try {
    const data = greeting();
    console.log("It worked!", data);
  } catch (e) {
    console.log("Oh no an error!", e);
  }
}

sayHi();

A: "It worked! Hello world!"

B: "Oh no an error: undefined

C: SyntaxError: can only throw Error objects

D: "Oh no an error: Hello world!

答案: D

通過throw語句，我么可以創建自定義錯誤。 而通過它，我們可以拋出異常。異常可以是一個字符串, 一個 數字, 一個 布爾類型 或者是一個 對象。在本例中，我們的異常是字符串"Hello world".

通過 catch語句，我們可以設定當try語句塊中拋出異常后應該做什么處理。在本例中拋出的異常是字符串"Hello world". e就是這個字符串，因此被輸出。最終結果就是"Oh an error: Hello world".

// index.js
console.log("running index.js");
import { sum } from "./sum.js";
console.log(sum(1, 2));

// sum.js
console.log("running sum.js");
export const sum = (a, b) => a + b;

A: running index.js, running sum.js, 3

B: running sum.js, running index.js, 3

C: running sum.js, 3, running index.js

D: running index.js, undefined, running sum.js

答案: B

import命令是編譯階段執行的，在代碼運行之前。因此這意味著被導入的模塊會先運行，而導入模塊的文件會后執行。

這是CommonJS中require（）和import之間的區別。使用require()，您可以在運行代碼時根據需要加載依賴項。 如果我們使用require而不是import，running index.js，running sum.js，3會被依次打印。

const settings = {
  username: "lydiahallie",
  level: 19,
  health: 90
};

const data = JSON.stringify(settings, ["level", "health"]);
console.log(data);

A: "{"level":19, "health":90}"

B: "{"username": "lydiahallie"}"

C: "["level", "health"]"

D: "{"username": "lydiahallie", "level":19, "health":90}"

答案: A

JSON.stringify的第二個參數是 _替代者(replacer)_. 替代者(replacer)可以是個函數或數組，用以控制哪些值如何被轉換為字符串。

如果替代者(replacer)是個 數組 ，那么就只有包含在數組中的屬性將會被轉化為字符串。在本例中，只有名為"level" 和 "health" 的屬性被包括進來， "username"則被排除在外。 data 就等于 "{"level":19, "health":90}".

而如果替代者(replacer)是個 _函數_，這個函數將被對象的每個屬性都調用一遍。
函數返回的值會成為這個屬性的值，最終體現在轉化后的JSON字符串中（譯者注：Chrome下，經過實驗，如果所有屬性均返回同一個值的時候有異常，會直接將返回值作為結果輸出而不會輸出JSON字符串），而如果返回值為undefined，則該屬性會被排除在外。

題目來源：https://github.com/lydiahallie/javascript-questions/blob/master/README-zh_CN.md

如果對你有幫助，請關注【前端技能解鎖】：