在IT界，需要大量的 JavaScript 開發(fā)者,。如果你的能力能夠勝任這一角色,，那么你將獲得許多更換工作和提高薪水的機(jī)會。但是在你被公司錄取之前,，你需要展現(xiàn)你的技術(shù)實(shí)力,，以便通過面試環(huán)節(jié)。在這篇文章中,，我會為你展示前端面試會被問到的 5 個(gè)典型問題及相關(guān)解決方法,，這 5 個(gè)問題常被用來測試面試者的 JavaScript 技能。它們很有意思,！

問題1: 范圍（Scope）

思考以下代碼：

控制臺（console）會打印出什么,？

答案

上述代碼會打印出5。

這個(gè)問題的陷阱就是,，在立即執(zhí)行函數(shù)表達(dá)式（IIFE）中，有兩個(gè)命名,，但是其中變量是通過關(guān)鍵詞var來聲明的,。這就意味著a是這個(gè)函數(shù)的局部變量。與此相反,，b是在全局作用域下的,。

這個(gè)問題另一個(gè)陷阱就是，在函數(shù)中他沒有使用"嚴(yán)格模式" ('use strict';),。如果 嚴(yán)格模式 開啟,，那么代碼就會報(bào)出未捕獲引用錯(cuò)誤（Uncaught ReferenceError）：b沒有定義。記住,，嚴(yán)格模式要求你在需要使用全局變量時(shí),，明確地引用該變量。因此,，你需要像下面這么寫：

問題2: 創(chuàng)建 “原生（native）” 方法

在String對象上定義一個(gè)repeatify函數(shù),。這個(gè)函數(shù)接受一個(gè)整數(shù)參數(shù)，來明確字符串需要重復(fù)幾次,。這個(gè)函數(shù)要求字符串重復(fù)指定的次數(shù),。舉個(gè)例子：

應(yīng)該打印出hellohellohello.

答案

一種可能的實(shí)現(xiàn)如下所示：

這個(gè)問題測試了開發(fā)人員對于JavaScript中繼承的掌握,，以及prototype這個(gè)屬性。這也驗(yàn)證了開發(fā)人員是否有能力擴(kuò)展原生數(shù)據(jù)類型的功能（雖然不應(yīng)該這么做）,。

這個(gè)問題的另一個(gè)重點(diǎn)是驗(yàn)證你是否意識到并知道如何避免覆蓋已經(jīng)存在的函數(shù),。這可以通過在自定義函數(shù)之前判斷該函數(shù)是否存在來做到。

當(dāng)你需要為舊瀏覽器實(shí)現(xiàn)向后兼容的函數(shù)時(shí),，這一技巧十分有用,。

問題3: 變量提升（Hoisting）

執(zhí)行以下代碼會有什么結(jié)果？為什么,？

答案

這段代碼的執(zhí)行結(jié)果是 undefined 和 2,。

這個(gè)結(jié)果的原因是，變量和函數(shù)都被提升了（hoisted）,。因此,，在a被打印的時(shí)候，它已經(jīng)在函數(shù)作用域中存在（即它已經(jīng)被聲明了）,，但是它的值依然是 undefined,。換言之，上述代碼和以下代碼是等價(jià)的,。

問題4: this 在 JavaScript 中是如何工作的

以下代碼的結(jié)果是什么,？請解釋你的答案。

答案

上面的代碼打印出 Aurelio De Rosa 和 John Doe,。原因是在 JavaScript 中,，一個(gè)函數(shù)的上下文環(huán)境，也就是this關(guān)鍵詞所引用對象,，是依賴于函數(shù)是如何被調(diào)用的,，而不是依賴于函數(shù)如何被定義的。

在第一個(gè) console.log() 調(diào)用中,， getFullname() 是作為 obj.prop 的函數(shù)被調(diào)用的,。因此，這里的上下文環(huán)境指向后者并且函數(shù)返回this對象的 fullname 屬性,。相反,，當(dāng) getFullname() 被賦為test變量的值時(shí)，那個(gè)語境指向全局對象(window),。這是因?yàn)椋?code style="box-sizing: inherit;">test 被隱式設(shè)置為全局對象的屬性,。因此，函數(shù)調(diào)用返回 window 的 fullname 屬性值,，在此段代碼中,，這個(gè)值是通過第一行賦值語句設(shè)置的。

問題5: call() 和 apply()

修復(fù)上一個(gè)問題,，讓最后一個(gè) console.log() 打印出 Aurelio De Rosa,。

答案

要解決這個(gè)問題,，可以通過為函數(shù) call() 或者 apply() 強(qiáng)制函數(shù)調(diào)用的上下文環(huán)境。如果你不知道 call() 和 apply() 之間的區(qū)別,，我推薦閱讀文章“ function.call 和 function.apply 之間有和區(qū)別?”,。在以下代碼中，我會用 call(),，但是在這里,，用 apply() 也可以獲得相同的結(jié)果：

結(jié)論

在這篇文章中，我們討論了 JavaScript 面試者在面試中常被問到的 5 個(gè)典型問題,。在實(shí)際面試中,，真實(shí)的問題可能會有所不同，但涉及的概念和涵蓋的話題通常是非常類似的,。我希望你覺得前面那些測試很有趣,。如果你不知道其中一些答案，也別擔(dān)心：隨著不斷學(xué)習(xí)和經(jīng)驗(yàn)積累,，你就能解決那些問題,。

如果你在面試中被問到了其他有趣的問題，不要猶豫,，馬上來和我們分享吧,。這會幫助到很多的開發(fā)者。