JavaScript面試題

2024-04-27 15:09:57

字體：大中小

來源：轉載

供稿：網友

五個典型的javaScript面試題

本文轉載自：眾成翻譯譯者：cherryvenus 鏈接：http://www.zcfy.cc/article/1960 原文：https://www.sitepoint.com/5-typical-Javascript-interview-exercises/

在IT界，需要大量的javascript開發者。如果這個角色能夠最佳地展現你的能力，那么你有許多機會換家公司，以及提高薪水。但是在你被公司錄取之前，你需要展現你的技術，以便通過面試環節。在這篇文章中，我會展示你五個典型的問題。

問題1: 范圍（Scope）

思考以下代碼：

(function() { var a = b = 5;})();console.log(b);

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

答案

上述代碼會打印出5。

這個問題的陷阱就是，在立即執行函數表達式（IIFE）中，有兩個命名，但是其中變量是通過關鍵詞var來聲明的。這就意味著a是這個函數的本地變量。與此相反，b是屬于這個函數的全局變量的。

這個問題另一個陷阱就是，在函數中他沒有使用“嚴格模式” ('use strict';)。如果嚴格模式開啟，那么代碼就會報出未捕獲引用錯誤（Uncaught ReferenceError）：b沒有定義。記住嚴格模式要求，如果這個是預期的行為，你需要明確地引用全局變量，。因此，你需要像下面這么寫：

(function() { 'use strict'; var a = window.b = 5;})();console.log(b);

問題2: 創建 “原生（native）” 方法

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

``console.log('hello'.repeatify(3));``

應該打印出hellohellohello.

答案

一種可能的實現如下所示：

String.PRototype.repeatify = String.prototype.repeatify || function(times) { var str = ''; for (var i = 0; i < times; i++) { str += this; } return str;};

這個問題測試了開發人員對于javascript中繼承的掌握，以及prototype這個屬性。這也驗證了開發人員是否有能力擴展原生數據類型函數（雖然不應該這么做）。

在這里，另一種重點是，展示你意識到如何在不重寫可能已經定義的函數。這個需要在自定義函數之前判斷函數不存在。

``String.prototype.repeatify = String.prototype.repeatify || function(times) {/* code here */};``

當你被要求一個墊片javascript函數時，這個技巧十分有用。

問題3: 提升變量（Hoisting）

執行以下代碼會有什么結果？為什么會這樣？

function test() { console.log(a); console.log(foo()); var a = 1; function foo() { return 2; }}test();

答案

這段代碼的執行結果是undefined 和 2。

這個結果的原因是，變量和函數都被提升了（hoisted）。因此，那個時候a被打印了，它存在函數之中（也就是聲明了），但是依然是 undefined。換言之，上述代碼和以下代碼是相同的。

function test() { var a; function foo() { return 2; } console.log(a); console.log(foo()); a = 1;}test();

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

以下代碼的結果是什么？請解釋你的答案。

答案

代碼打印了Aurelio De Rosa和John Doe。原因是在javascript中，一個函數的語境，也就是this這個關鍵詞引用的，依賴于函數是如何調用的，不是如何定義的。

在第一個console.log()調用中， getFullname()是作為obj.prop的函數被調用的。因此，這里的語境指向后者并且函數返回對象的 fullname屬性。相反，當 getFullname() 被指定為test的變量，那個語境指向全局對象(window)。因為test相當于設置為全局對象的屬性。因為這個原因，函數返回window的一個fullname屬性，這在這個案例中是在代碼片段中第一行設置的。

問題5: `call()` 和 `apply()`

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

答案

這個問題可以通過函數call()或者apply()強制函數語境。如果你不知道call()和apply()之間的區別，我推薦閱讀文章function.call和function.apply之間有和區別?。在以下代碼中，我會用call()，但是在這個案例中，apply()也可以獲得相同的結果：

``console.log(test.call(obj.prop));``