如果您符合高級開發人員的資格，其作業涉及 JavaScript，那么在編碼面試中很有可能會被問到棘手的問題，
遵循這個建議:“熟能生巧”，深入有規律地學習 JavaScript 將提高您的編碼能力，并且可以提高您的面試技巧，
在這篇文章中，你會發現 7 個乍一看很簡單但很棘手的 JavaScript 面試問題，
雖然一開始這些問題看起來是隨意的，但是它們試圖與 JavaScript 的重要概念掛鉤，所以你最好在下次面試前練習一下！
1、意外全域變數
Question
以下代碼段中用于運算 typeof a 和 typeof b 的內容：
function foo() {
let a = b = 0;
a++;
return a;
}
foo();
typeof a; // => ???
typeof b; // => ???
Answer
讓我們看一下第 2 行：let a = b = 0，該陳述句宣告一個區域變數 a，然兒，它也宣告了全域變數 b，
在 foo() 范圍或全域范圍中都沒有宣告變數 b，因此 JavaScript 將 b = 0 運算式解釋為 window.b = 0，換句話說，b 是意外創建的全域變數，
在瀏覽器中，以上代碼片段等效于：
function foo() {
let a;
window.b = 0;
a = window.b;
a++;
return a;
}
foo();
typeof a; // => 'undefined'
typeof window.b; // => 'number'`
typeof a 等于 'undefined'，變數 a 存在于 foo() 范圍內，而在外部范圍內不使用，
因為 b 是一個值為 0 的全域變數，所以 b 的型別的值為 'number'，
2、陣列的 length 屬性
Question
clothes[0] 的值是什么?
const clothes = ['jacket', 't-shirt'];
clothes.length = 0;
clothes[0]; // => ???
Answer
陣列物件的 length 屬性具有特殊的行為：減少 length 屬性的值的副作用是洗掉自己的陣列元素，因此，當 JavaScript 執行 clothes.length = 0 的時候將洗掉所有元素，
clothes [0] 等于 undefined 的，因為 clothes 陣列已被清空，
3、鷹眼測驗
Question
numbers 陣列的內容是什么？
const length = 4;
const numbers = [];
for (var i = 0; i < length; i++);{
numbers.push(i + 1);
}
numbers; // => ???
Answer
讓我們仔細看一下分號 ；出現在左大括號 {：
這個分號很容易被忽略，它創建了一個空陳述句，空陳述句是不做任何事情的空陳述句，
for() 在空陳述句上進行 4 次迭代（不執行任何操作），而忽略實際將專案推入陣列的塊：{number.push（i + 1）;}，上面的代碼等效于以下代碼：
const length = 4;
const numbers = [];
var i;
for (i = 0; i < length; i++) {
// does nothing
}
{
// a simple block
numbers.push(i + 1);
}
numbers; // => [5]
for() 將 i 變數遞增到4，然后 JavaScript 一次進入塊 {number.push（i + 1）;}，將 4 +1 推入數字陣列，另外，關注微信公眾號：Java技術堆疊，在后臺回復：面試，可以獲取我整理的 N 篇 Java 面試題，
因此，numbers 陣列的內容為 [5]，
4、自動分號插入
Question
arrayFromValue() 回傳什么值？
function arrayFromValue(item) {
return
[item];
}
arrayFromValue(10); // => ???
Answer
很容易錯過 return 關鍵字和 [item] 運算式之間的換行符，此換行符使 JavaScript 自動在 return 和 [item] 運算式之間插入分號，
這是等效的代碼，在回傳后插入了分號：
function arrayFromValue(item) {
return;
[item];
}
arrayFromValue(10); // => undefined
return; 函式內部使其回傳 undefined，因此 arrayFromValue(10) 的值為 undefined，
5、經典問題：棘手的閉包
Question
以下代碼將輸出什么到控制臺？
let i;
for (i = 0; i < 3; i++) {
const log = () => {
console.log(i);
}
setTimeout(log, 100);
}
Answer
如果您以前從未聽說過這個棘手的問題，則很可能您的答案是 0、1 和 2：這是錯誤的，當我第一次嘗試解決它時，這也是我的答案！
執行此代碼段有兩個階段，
Phase 1
1、for() 重復3次，在每次迭代程序中，都會創建一個新的函式 log() 來捕獲變數 i，然后 setTimout() 計劃執行 log()，
2、當 for() 回圈完成時，i 變數的值為 3，
log() 是一個捕獲變數 i 的閉包，該變數在 for() 回圈的外部范圍中定義，請務必注意，閉包可以詞法捕獲 i 變數，
Phase 2
第二階段發生在 100ms 之后：setTimeout() 呼叫了 3 次計劃的 log() ，log() 讀取變數i的當前值為 3，并記錄到控制臺 3，這就是為什么控制臺輸出為3、3 和 3 的原因，
您知道如何將代碼段記錄為0、1 和 2 嗎？請在下面的評論中寫下您的解決方案！
6、浮點數計算
Question
這個等式的結果是什么？
0.1 + 0.2 === 0.3 // => ???
Answer
首先，讓我們看一下 0.1 + 0.2 的值：
0.1 + 0.2; // => 0.30000000000000004
0.1 和 0.2 的總和不完全是 0.3，而是略高于 0.3，
由于以二進制方式對浮點數進行編碼，因此像浮點數相加之類的操作會產生舍入誤差，
簡而言之，直接比較浮點數并不精確，
因此 0.1 + 0.2 === 0.3 的結果是 false，
打開 www.javastack.cn 網站學習更多教程，
7、變數提升
Question
如果在宣告前訪問 myVar 和 myConst，會發生什么情況？
myVar; // => ???
myConst; // => ???
var myVar = 'value';
const myConst = 3.14;
Answer
提升和臨時死區是影響 JavaScript 變數生命周期的兩個重要概念，
在宣告之前訪問 myVar 的結果為 undefined，在初始化之前，提升的 var 變數具有 undefined 的值，
然兒，在宣告行之前訪問 myConst 會引發 ReferenceError，const 變數處于臨時死區，直到宣告行 const myConst = 3.14，
最后
您可以認為某些問題對面試毫無用處，我有同樣的感覺，特別是關于鷹眼測驗，盡管如此，他們可能會被問到，
無論如何，其中許多問題都可以真正評估您是否精通 JavaScript，例如棘手的閉包，如果您在閱讀帖子時遇到一些困難，這很好地表明了您接下來必須學習什么！
在面試中提出棘手的問題是否公平？讓我知道你的意見，關注微信公眾號：Java技術堆疊，在后臺回復：面試，可以獲取我整理的 N 篇 Java 面試題干貨，
原文：dmitripavlutin.com/simple-but-tricky-javascript-interview-questions
作者：Dmitri Pavlutin
翻譯：做工程師不做碼農
譯文：blog.csdn.net/duninet/article/details/104886321
推薦去我的博客閱讀更多：
1.Java JVM、集合、多執行緒、新特性系列教程
2.Spring MVC、Spring Boot、Spring Cloud 系列教程
3.Maven、Git、Eclipse、Intellij IDEA 系列工具教程
4.Java、后端、架構、阿里巴巴等大廠最新面試題
覺得不錯，別忘了點贊+轉發哦！
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/190798.html
標籤：Java