JavaScript九大面試問題集錦

人們認為JavaScript是最適合初學者的語言。一部分原因在于JavaScript在互聯網中運用廣泛，另一部分原因在于其自身特性使得即使編寫的代碼不那么好依然可以運行：無論是否少了一個分號或是內存管理問題，它都不像許多其他語言那樣嚴格，但在開始學習之前，要確保你已經知道JavaScript的來龍去脈，包括可以自動完成的事情和“幕后”的操作。

本文將介紹一些面試時關于JavaScript的常見問題，以及一些突發(fā)難題。當然，每次面試都是不同的，你也可能不會遇見這類問題。但是知道的越多，準備的就越充分。

第一部分：突發(fā)難題

如果在面試中突然問到下列問題，似乎很難回答。即便如此，這些問題在準備中仍發(fā)揮作用：它們揭示了JavaScript的一些有趣的功能，并強調在提出編程語言時，首先必須做出的一些決定。

了解有關JavaScript的更多功能，建議訪問https://wtfjs.com。

1. 為什么Math.max()小于Math.min()?

Math.max()> Math.min()輸出錯誤這一說法看上去有問題，但其實相當合理。

如果沒有給出參數，Math.min()返回infinity(無窮大)，Math.max()返回-infinity(無窮小)。這只是max()和min()方法規(guī)范的一部分，但選擇背后的邏輯值得深議。了解其中原因，請看以下代碼：

Math.min(1) // 1  
Math.min(1, infinity)// 1  
Math.min(1, -infinity)// -infinity 

如果-infinity(無窮小)作為Math.min()的默認參數，那么每個結果都是-infinity(無窮小)，這毫無用處! 然而，如果默認參數是infinity(無窮大)，則無論添加任何參數返回都會是該數字 - 這就是我們想要的運行方式。

2. 為什么0.1+0.2不等于0.3

簡而言之，這與JavaScript在二進制中存儲浮點數的準確程度有關。在Google Chrome控制臺中輸入以下公式將得到：

0.1 + 0.2// 0.30000000000000004   
0.1 + 0.2 - 0.2// 0.10000000000000003   
0.1 + 0.7// 0.7999999999999999 

如果是簡單的等式，對準確度沒有要求，這不太可能產生問題。但是如果需要測試相等性，即使是簡單地應用也會導致令人頭疼的問題。解決這些問題，有以下幾種方案。

(1) Fixed Point固定點

例如，如果知道所需的大精度(例如，如果正在處理貨幣)，則可以使用整數類型來存儲該值。因此，可以存儲499而非4.99美元，并在此基礎上執(zhí)行任何等式，然后可以使用類似result =(value / 100).toFixed(2)的表達式將結果顯示給最終用戶，該表達式返回一個字符串。

(2) BCD代碼

如果精度非常重要，另一種方法是使用二進制編碼的十進制(BCD)格式，可以使用BCD庫(https://formats.kaitai.io/bcd/javascript.html)訪問JavaScript。每個十進制值分別存儲在一個字節(jié)(8位)中。鑒于一個字節(jié)可以存儲16個單獨值，而該系統(tǒng)僅使用0-9位，所以這種方法效率低下。但是，如果十分注重精確度，采用何種方法都值得考量。

3. 為什么018減017等于3?

018-017返回3實際是靜默類型轉換的結果。這種情況，討論的是八進制數。

(1) 八進制數簡介

你或許知道計算中使用二進制(base-2)和十六進制(base-16)數字系統(tǒng)，但是八進制(base-8)在計算機歷史中的地位也舉足親重：在20世紀50年代后期和 20世紀60年代間，八進制被用于簡化二進制，削減高昂的制造系統(tǒng)中的材料成本。

不久以后Hexadecimal(十六進制)開始登上歷史舞臺：

1965年發(fā)布的IBM360邁出了從八進制到十六進制的決定性一步。我們這些習慣八進制的人對這一舉措感到震驚! 沃恩·普拉特(Vaughan Pratt)

(2) 如今的八進制數

但在現代編程語言中，八進制又有何作用呢?針對某些案例，八進制比十六進制更具優(yōu)勢，因為它不需要任何非數字(使用0-7而不是0-F)。

一個常見用途是Unix系統(tǒng)的文件權限，其中有八個權限變體：

• 4 2 1
• 0 - - - no permissions
• 1 - - x only execute
• 2 - x - only write
• 3 - x x write and execute
• 4 x - - only read
• 5 x - x read and execute
• 6 x x - read and write
• 7 x x x read, write and execute

出于相似的原由，八進制也用于數字顯示器。

(3) 回到問題本身

在JavaScript中，前綴0將所有數字轉換為八進制。但是，八進制中不使用數字8，任何包含8的數字都將自動轉換為常規(guī)十進制數。

因此，018-017實際上等同于十進制表達式：18-15，因為017使用八進制而018使用十進制。

第二部分：常見問題

本節(jié)中，將介紹面試中一些更加常見的JavaScript問題。第一次學習JavaScript時，這些問題容易被忽略。但在編寫好代碼時，了解下述問題用處頗大。

4. 函數表達式與函數聲明有哪些不同?

函數聲明使用關鍵字function，后跟函數的名稱。相反，函數表達式以var，let或const開頭，后跟函數名稱和賦值運算符=。請看以下代碼：

// Function Declaration 
function sum(x, y) { 
  return x + y; 
}; 
 
// Function Expression: ES5 
var sum = function(x, y) { 
  return x + y; 
}; 
  
// Function Expression: ES6+ 
const sum = (x, y) => { return x + y }; 

實際操作中，關鍵的區(qū)別在于函數聲明要被提升，而函數表達式則沒有。這意味著JavaScript解釋器將函數聲明移動到其作用域的頂部，因此可以定義函數聲明并在代碼中的任何位置調用它。相比之下，只能以線性順序調用函數表達式：必須在調用它之前解釋。

如今，許多開發(fā)人員偏愛函數表達式有如下幾個原因：

• 首先，函數表達式實施更加可預測的結構化代碼庫。當然，函數聲明也可使用結構化代碼庫; 只是函數聲明讓你更容易擺脫凌亂的代碼。
• 其次，可以將ES6語法用于函數表達式：這通常更為簡潔，let和const可以更好地控制是否重新賦值變量，我們將在下一個問題中看到。

5. var，let和const有什么區(qū)別?

自ES6發(fā)布以來，現代語法已進入各行各業(yè)，這已是一個極其常見的面試問題。Var是第一版JavaScript中的變量聲明關鍵字。但它的缺點導致在ES6中采用了兩個新關鍵字：let和const。

這三個關鍵字具有不同的分配，提升和域 - 因此我們將單獨討論。

(1) 分配

最基本的區(qū)別是let和var可以重新分配，而const則不能。這使得const成為不變變量的好選擇，并且它將防止諸如意外重新分配之類的失誤。注意，當變量表示數組或對象時，const確實允許變量改變，只是無法重新分配變量本身。

Let 和var都可重新分配，但是正如以下幾點應該明確的那樣，如果不是所有情況都要求更改變量，多數選擇中，let具有優(yōu)于var的顯著優(yōu)勢。

(2) 提升

與函數聲明和表達式(如上所述)之間的差異類似，使用var聲明的變量總是被提升到它們各自的頂部，而使用const和let聲明的變量被提升，但是如果你試圖在聲明之前訪問，將會得到一個TDZ(時間死區(qū))錯誤。由于var可能更容易出錯，例如意外重新分配，因此運算是有用的。請看以下代碼：

var x = "global scope"; 
 
function foo() { 
  var x = "functional scope"; 
  console.log(x); 
} 
 
foo(); // "functional scope" 
console.log(x); // "global scope" 

這里，foo()和console.log(x)的結果與預期一致。但是，如果去掉第二個變量又會發(fā)生什么呢?

var x = "global scope"; 
 
function foo() { 
  x = "functional scope"; 
  console.log(x); 
} 
foo(); // "functional scope" 
console.log(x); // "functional scope" 

盡管在函數內定義，但x =“functional scope”已覆蓋全局變量。需要重復關鍵字var來指定第二個變量x僅限于foo()。

(3) 域

雖然var是function-scoped(函數作用域)，但let和const是block-scoped(塊作用域的：一般情況下，Block是大括號{}內的任何代碼，包括函數，條件語句和循環(huán)。為了闡明差異，請看以下代碼：

var a = 0; 
let b = 0; 
const c = 0; 
if (true) { 
  var a = 1; 
  let b = 1; 
  const c = 1; 
} 
console.log(a); // 1 
console.log(b); // 0 
console.log(c); // 0 

在條件塊中，全局范圍的var a已重新定義，但全局范圍的let b和const c則沒有。一般而言，確保本地任務保持在本地執(zhí)行，將使代碼更加清晰，減少出錯。

6. 如果分配不帶關鍵字的變量會發(fā)生什么?

如果不使用關鍵字定義變量，又會如何?從技術上講，如果x尚未定義，則x = 1是window.x = 1的簡寫。

要想完全杜絕這種簡寫，可以編寫嚴格模式，——在ES5中介紹過——在文檔頂部或特定函數中寫use strict。后，當你嘗試聲明沒有關鍵字的變量時，你將收到一條報語法錯誤：Uncaught SyntaxError：Unexpected indentifier。

7. 面向對象編程(OOP)和函數式編程(FP)之間的區(qū)別是什么?

JavaScript是一種多范式語言，即它支持多種不同的編程風格，包括事件驅動，函數和面向對象。

編程范式各有不同，但在當代計算中，函數編程和面向對象編程最為流行 - 而JavaScript兩種都可執(zhí)行。

(1) 面向對象編程

OOP以“對象”這一概念為基礎的數據結構，包含數據字段(JavaScript稱為類)和程序(JavaScript中的方法)。

一些JavaScript的內置對象包括Math(用于random，max和sin等方法)，JSON(用于解析JSON數據)和原始數據類型，如String，Array，Number和Boolean。

無論何時采用的內置方法，原型或類，本質上都在使用面向對象編程。

(2) 函數編程

FP(函數編程)以“純函數”的概念為基礎，避免共享狀態(tài)，可變數據和副作用。這可能看起來像很多術語，但可能已經在代碼中創(chuàng)建了許多純函數。

輸入相同數據，純函數總是返回相同的輸出。這種方式沒有副作用：除了返回結果之外，例如登錄控制臺或修改外部變量等都不會發(fā)生。

至于共享狀態(tài)，這里有一個簡單的例子，即使輸入是相同的，狀態(tài)仍可以改變函數的輸出。設置一個具有兩個函數的代碼：一個將數字加5，另一個將數字乘以5。

const num = { 
 val: 1 
}; 
const add5 = () => num.val += 5; 
const multiply5 = () => num.val *= 5; 

如果先調用add5在調用乘以5，則整體結果為30。但是如果以相反的方式執(zhí)行函數并記錄結果，則輸出為10，與之前結果不一致。

這違背了函數式編程的原理，因為函數的結果因Context調用方法而異。 重新編寫上面的代碼，以便結果更易預測：

const num = { 
 val: 1 
}; 
const add5 = () => Object.assign({}, num, {val: num.val + 5}); const multiply5 = () => Object.assign({}, num, {val: num.val * 5}); 

現在，num.val的值仍然為1，無論Context調用的方法如何，add5(num)和multiply5(num)將始終輸出相同的結果。

8. 命令式和聲明性編程之間有什么區(qū)別?

關于命令式編程和聲明式編程的區(qū)別，可以以OOP(面向對象編程)和FP(函數式編程)為參考。

這兩種是描述多種不同編程范式共有特征的概括性術語。FP(函數式編程)是聲明性編程的一個范例，而OOP(面向對象編程)是命令式編程的一個范例。

從基本的意義層面，命令式編程關注的是如何做某事。它以最基本的方式闡明了步驟，并以for和while循環(huán)，if和switch陳述句等為特征。

const sumArray = array => { 
  let result = 0; 
  for (let i = 0; i < array.length; i++) { 
     result += array[i] 
  }; 
  return result; 
} 

相比之下，聲明性編程關注的是做什么，它通過依賴表達式將怎樣做抽出來。這通常會產生更簡潔的代碼，但是在規(guī)模上，由于透明度低，調試會更加困難。

這是上述的sumArray()函數的聲明方法。

const sumArray = array => { return array.reduce((x, y) => x + y) }; 

9. 是什么基于原型的繼承?

最后，要講到的是基于原型的繼承。面向對象編程有幾種不同的類型，JavaScript使用的是基于原型的繼承。該系統(tǒng)通過使用現有對象作為原型，允許重復運行。

即使是首次遇到原型這一概念，使用內置方法時也會遇到原型系統(tǒng)。 例如，用于操作數組的函數(如map，reduce，splice等)都是Array.prototype對象的方法。實際上，數組的每個實例(使用方括號[]定義，或者 -不常見的 new Array())都繼承自Array.prototype，這就是為什么map，reduce和spliceare等方法都默認可用的原因。

幾乎所有內置對象都是如此，例如字符串和布爾運算：只有少數，如Infinity，NaN，null和undefined等沒有類或方法。

在原型鏈的末尾，能發(fā)現 Object.prototype，幾乎JavaScript中的每個對象都是Object的一個實例。比如Array. prototype和String. prototype都繼承了Object.prototype的類和方法。

要想對使用prototype syntax的對象添加類和方法，只需將對象作為函數啟動，并使用prototype關鍵字添加類和方法：

function Person() {}; 
Person.prototype.forename = "John"; 
Person.prototype.surname = "Smith"; 

是否應該覆蓋或擴展原型運算?

可以使用與創(chuàng)建擴展prototypes同樣的方式改變內置運算，但是大多數開發(fā)人員(以及大多數公司)不會建議這樣做。

如果希望多個對象進行同樣的運算，可以創(chuàng)建一個自定義對象(或定義你自己的“類”或“子類”)，這些對象繼承內置原型而不改變原型本身。如果打算與其他開發(fā)人員合作，他們對JavaScript的默認行為有一定的預期，編輯此默認行為很容易導致出錯。

總的來說，這些問題能夠幫助你更好理解JavaScript，包括其核心功能和其他鮮為人知的功能 ，并且望能助你為下次的面試做好準備。

當前題目：JavaScript九大面試問題集錦
標題來源：http://bm7419.com/news/104194.html

成都網站建設公司_創(chuàng)新互聯，為您提供手機網站建設、網站設計公司、全網營銷推廣、品牌網站制作、定制網站、虛擬主機

廣告

聲明：本網站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯