50 個最常見的 Javascript 面試問題和答案 [2022]

Javascript面試問題和答案

在本文中，我們整理了最常見的JavaScript 面試問題。 這些問題將使您了解面試官在面試期間可能會問您的問題類型。
JavaScript 是一種腳本語言，在 Web 開發中非常有用。 Brendan Eich 早在 1995 年就開發了 JavaScript，並被 Facebook 和 Google 等巨頭使用。 很難理解 JavaScript 的多功能性。 面試官總是試圖在將任命信交給他們之前評估潛在員工的知識。

因此，複習您的 JavaScript 知識非常重要。 以下是面試官可以問你的一些Javascript 面試問題，如果你要去面試。

javascript面試問題和答案分為三類：

• 初學者級
• 中級水平
• 先進的水平

Javascript 面試問題和答案 - 初級

Q1。 JavaScript 和 Java 有何不同？

Javascript 是面向對象的編程或 OOP 腳本語言。 Java 是面向對象的編程或 OOP 編程語言

JavaScript 只能在瀏覽器上運行。 Java 有助於創建可以在瀏覽器或虛擬機上運行的應用程序。

JS 以文本形式呈現。 Java需要編譯

Q2。 什麼是 JavaScript？

JavaScript 是一種輕量級的解釋型編程語言，具有面向對象的能力。 它可以幫助您將交互性開發成靜態 HTML 頁面。

Q3。 JavaScript 支持哪些數據類型？

JavaScript 支持幾種數據類型，它們是：

• 布爾值
• 空值
• 細繩
• 不明確的
• 象徵
• 目的
• 數字
  
  

Q4。 JavaScript 有哪些不同的特性？

• Javascript 是一種輕量級的解釋型編程語言。
• 它旨在創建以網絡為中心的應用程序。
• 它是對 Java 的補充並與之集成。
• JavaScript 是一種跨平台和開放的腳本語言。

Q5。 JavaScript 是否區分大小寫？

是的，JavaScript 區分大小寫。

Q6。 JavaScript 有什麼優勢？

一些優點是：

• 降低與服務器的交互：在 JavaScript 的幫助下，您將能夠在將頁面發送到服務器之前驗證任何基於用戶的輸入。
• 對訪問者的即時反饋：即使在頁面重新加載之前，訪問者也可以立即發現他們是否忘記輸入任何內容。
• 增加交互性：使用 JavaScript，您可以創建不同的界面，一旦用戶將鼠標懸停在它們上方或使用鍵盤激活它們，這些界面就會做出反應。

Q7：如何使用 JavaScript 創建對象？

由於 JavaScript 是一種面向對象的編程腳本語言，它支持 Object 的概念。 通過使用 Object 字面量，您可以創建一個對象。

Q8。 如何使用 JavaScript 創建一個數組？

如果要在 JavaScript 中定義數組，可以使用數組字面量來實現。 例子：

變量 x = [];

變量 y = [1, 2, 3, 4, 5];

問題 9。 JavaScript 中的名稱函數是什麼，如何定義它？

JavaScript 中的命名函數在定義後聲明一個名稱。 例子：

函數命名（）{

// 這裡寫代碼

}

問題 10。 可以將匿名函數分配給變量，然後將其作為參數傳遞給另一個函數嗎？

使用 Javascript，可以將匿名函數分配給變量並將其作為參數傳遞給另一個函數。

問題 11。 在 JavaScript 中，什麼是參數對像以及如何將參數類型傳遞給函數？

JavaScript 中的變量參數表示傳遞給函數的參數。 您可以使用 typeof 運算符來獲取參數的類型。

問題 12。 在 JavaScript 中，變量的作用域是什麼？

變量的範圍是指定義它的程序區域。 有兩個範圍：

• 全局變量：全局變量具有全局範圍，這意味著它將在您的代碼中隨處可見。
• 局部變量：局部變量僅在定義它的函數中可見。

問題 13。 JavaScript 中的“This”運算符有什麼作用？

JavaScript 中使用的 'This' 關鍵字談論它所屬的對象。 它有許多不同的值，取決於它的使用位置。

問題 14。 什麼被稱為“回調”？

回調是作為選項或參數傳遞給某個方法的 JavaScript 函數。 Callback 是另一個函數執行完畢後需要執行的函數。

問題 15。 定義閉包？

當特定變量在當前範圍之外定義並且可以從某個內部範圍內訪問時，就會開發閉包。

問題 16。 JavaScript中有哪些內置方法，它們返回的值是什麼？

一些內置方法和它們返回的值是：

Concat() 有助於連接兩個或兩個以上的字符串

CharAt() 有助於返回特定索引處的字符

forEach() 有助於為數組中存在的每個元素調用一個函數

length() 有助於返回字符串的長度

indexOf() 有助於返回第一次出現特定值的調用 String 對像中的索引

push()有助於將一個或多個元素添加到數組的末尾，然後返回該數組的新長度

pop()有助於從數組中刪除最後一個元素並返回該元素

reverse()有助於反轉數組元素的順序

問題 17。 JavaScript 中有哪些命名變量的約定？

一些規則是：

• 不應使用任何 JavaScript 保留關鍵字作為變量名。
• JavaScript 中的變量名不能以 0-9 之間的數字開頭。
• JavaScript 中的變量名區分大小寫。

問題 18。 TypeOf 運算符的工作是什麼？

typeof 運算符可用於獲取其操作數的數據類型。 指定的操作數可以是數據結構或文字，例如函數、對像或變量。

問題 19。 如何在 JavaScript 的幫助下創建 cookie？

只需將字符串值分配給 document.cookie 對象，您就可以在 JavaScript 中創建 cookie。

語法：

document.cookie = “key1 = value1; 鍵 2 = 值 2； 過期 = 日期”；

Q20。 如何使用 JavaScript 讀取 cookie？

您可以像在 JavaScript 中創建 cookie 一樣簡單地讀取 cookie，因為它實際上是 document.cookie 對象的值。 如果你想訪問那個特定的 cookie，你可以隨時使用這個字符串。

• 通過使用 document.cookie 字符串，您可以保留由分號分隔的名稱-值對列表，其中名稱實際上是 cookie 的名稱，值是字符串值。
• 您還可以使用字符串的 split() 函數將字符串分解為值和鍵。

問題 21。 如何使用 JavaScript 刪除 cookie？

如果您希望刪除 cookie 以使任何後續嘗試讀取 cookie 都不會返回任何內容，那麼您必須將 cookie 的到期日期設置為過去的時間。

讓我們繼續討論更多中級 JavaScript 面試問題，這將真正測試你的 JavaScript 知識。

Javascript 面試問題和答案 - 中級

問題 22。 屬性與屬性有何不同？

屬性提供了元素的更多細節，如類型、id、值等。

屬性是分配給屬性的特定值。 例如，value = 'Name'、type = “text”等。

問題 23。 列出在 JavaScript 代碼中訪問 HTML 元素的各種方法？

幾種方法是：

• getElementById('idname')：使用該方法，可以通過元素的ID名稱獲取元素。
• getElementsByClass('classname')：使用此方法，您可以獲得具有給定類名的所有元素。
• getElementsByTagName('tagname')：使用此方法，您可以獲得具有給定標籤名稱的所有元素。
• querySelector()： querySelector() 函數採用 css 樣式選擇器並返回第一個選擇的元素。

問題 24。 在 HTML 文件中包含 JavaScript 代碼的不同方式有哪些？

三種不同的方式：

• 排隊
• 外部的
• 內部的

稱為內聯函數的 JavaScript 函數被分配給在運行時創建的變量。 另一方面，如果您需要 JavaScript 函數，您可以將腳本集成到您正在工作的頁面上，或者您可以將其作為單獨的文件放置，以便在需要時調用。 從本質上講，這成為外部腳本和內部腳本之間的區別。

問題 25。 定義 JavaScript 變量的方法有哪些？

有3種方式：

• Var – JavaScript 變量語句有助於聲明變量。 或者，它也可用於初始化該特定變量的值。
• Const：使用 const 函數是為了不允許修改調用它的對象。 因此，當一個函數被稱為 const 時，該函數可以在任何對像類型上調用。
• Let： Let 用作表明可以重新分配變量的信號，例如循環中的計數器或算法中的值交換。

問題 26。 什麼是類型化語言？

在類型化語言中，值僅與值相關聯。 它們與變量無關。 有兩種類型的類型化語言：

動態：對於動態類型語言，變量可以包含多種類型。

靜態：在靜態類型語言中，變量只能保存一種類型。

問題 27。 本地存儲與會話存儲有何不同？

本地存儲——在本地存儲中，數據不會在每次 HTTP 請求（圖像、HTML、CSS、JavaScript 等）時返回到服務器。 它有助於減少服務器和客戶端之間的流量。

會話存儲——會話存儲與本地存儲非常相似。 但是，與本地系統中具有到期時間的數據存儲不同，一旦頁面會話結束，使用會話存儲存儲的數據就會被清除。

問題 28。 運算符'=='和'==='有什麼區別？

運算符“==”和運算符“===”的區別在於前者通過類型更正來比較變量。 因此，如果您要將數字與帶有數字文字的字符串進行比較，則可以使用“==”而不是“===”進行此類比較。 '===' 檢查兩個變量的值和類型。

問題 29。 null 和 undefined 的差異如何？

未定義是指已聲明但尚未進行數據賦值的變量。 但是，null 本身就是一個賦值。

Q30。 未聲明和未定義有何不同？

未聲明的變量是程序中不存在的變量，因此未聲明。 如果程序試圖讀取它，將會出現運行時錯誤。 未定義變量是已聲明但沒有賦予它們值的變量。

問題 31。 列舉幾個 JavaScript 框架？

JavaScript 框架是指用 JavaScript 編寫的應用程序框架。 一些常見的有：

• 反應
• 角
• Vue

問題 32。 JavaScript 窗口和 JavaScript 文檔有何不同？

Window 是一個全局對象，它包含函數、變量、位置和歷史記錄。

文檔是窗口的一部分，被視為 Javascript 窗口的屬性。

問題 33。 innerText 和 innerHTML 有何不同？

innerText – 如果在字符串中找到 HTML 標記，則 innerText 不會處理它。

innerHTML – 如果在字符串中找到一個 HTML 標記，則 innerHTML 會對其進行處理。

問題 34。 在 JavaScript 中，什麼是所謂的事件冒泡？

事件冒泡是指 HTML DOM API 中事件傳播的一種特定方式。 當事件發生在另一個元素內的元素內並且兩個元素都為所述事件註冊了句柄時，就會發生這種情況。 當涉及到冒泡時，最內部元素首先捕獲的事件最終會傳遞給外部元素。

一旦從一個事件開始執行，它就會傳到父元素。 之後，執行傳遞到父元素，並一直持續到 body 元素。

問題 35。 在 JavaScript 中，什麼是 NaN？

NaN 代表非數字。 NaN 總是用於比較不等於任何數字，包括 NaN 本身。 因此，它通常用於為任何可以返回有效數字的函數顯示錯誤條件。 例如，當將字符串轉換為數字時，如果無法完成，則會出現 NaN。

問題 36。 JavaScript 原始/對像類型如何通過函數傳遞？

原始數據類型通過值傳遞，而對象通過引用傳遞。

• 按價值表示，如果它是雙胞胎，它會開發正版或原始 sd 的副本。
• 通過引用意味著它創建了正版或原始的別名。 您可以將其與常見的暱稱進行比較。

問題 37。 如何使用 JavaScript 將任何基數的字符串轉換為整數？

通過使用 parseInt() 函數，您可以在不同的基數之間轉換數字。

問題 38。 在 JavaScript 中，問題的結果是什麼：2+5+“3”？

73. 由於 2 和 5 是整數，因此將執行正常的加法。 然而，3 是一個字符串，因此會有連接。 “”代表一個字符串。

問題 39。 什麼是進口和出口？

導入和導出對於編寫模塊化 JavaScript 代碼很有用。 它可以進一步拆分為多個文件。

您已經掌握了一些棘手的 JavaScript 面試問題。 現在，是時候深入了解一些高級 JavaScript 面試問題和答案了。

Javascript 面試問題和答案 - 高級

Q40。 什麼是所謂的嚴格模式以及如何啟用它？

嚴格模式可幫助您檢查代碼中的錯誤。 當您使用嚴格模式時，您將不能使用隱式聲明的變量，也不能將任何值分配給只讀屬性。

如果您想啟用嚴格模式，您所要做的就是在程序、函數或文件的開頭添加“use strict”。

問題 41。 在 JavaScript 中，提示框有什麼用？

JavaScript 中的提示框幫助用戶在文本框的幫助下進行輸入。 prompt() 方法有助於顯示提示訪問者提供輸入的對話框。

問題 42。 這段代碼會產生什麼結果：

變量 Y = 1;

如果（函數 F（）{}）

{

y += F 類型；</span>

}

控制台.log(y);

1undefined 將是輸出。 這是因為 if 條件語句將使用 'eval' 進行評估，因此 eval(function f(){}) 將返回 function f(){} (true)。 因此，在這個 if 語句中，將執行 typeof f ，它會返回 undefined ，因為 if 語句代碼是在運行時執行的。 因此，if 條件中存在的語句將在運行時進行評估。

問題 43。 說明 Apply 和 Call 之間的區別？

call() 方法有助於調用具有給定“this”值和單獨提供的參數的函數。 語法是：

fun.call(thisArg[, arg1[, arg2[, …]]])

apply() 方法用於調用具有給定“this”值但參數以數組形式呈現的函數。 語法是：

fun.apply(thisArg, [argsArray])

Q44.在 JavaScript 中，如何清空一個數組？

有幾種方法可以清空數組。 他們是：

方法一：

數組列表 = []

如果您沒有對原始數組arrayList 的任何引用，建議使用此方法。 但是，如果您之前從不同的變量引用了此數組，則原始引用數組將保持不變。

方法二：

數組列表長度 = 0;

通過使用此代碼，您將數組長度設置為 0，從而清空它的所有引用變量更新，返回到原始數組。

方法三：

arrayList.splice(0, arrayList.length);

此方法還可用於清空所有數組，包括將所有引用更新回原始數組。

方法四：

而（數組列表。長度）

{

數組列表.pop();

}

這也是清空數組的好方法，但不是推薦的方法。

問題 45。 此代碼將呈現什麼輸出：

var 輸出 = (函數(x)

{

刪除 X；

返回 X；

}

)(0);

控制台.log（輸出）；

刪除運算符有助於從對像中刪除屬性。 在此代碼中，x 不是用作對象，而是用作局部變量。 刪除運算符對局部變量沒有任何影響。

問題 46。 此代碼將呈現什麼輸出：

var X = { Foo : 1};

var 輸出 = (函數()

{

刪除 X.foo；

返回 X.foo；

}

)();

控制台.log（輸出）；

未定義的輸出。 刪除運算符有助於從對像中刪除屬性。 在此代碼中，x 是一個對象，其屬性 used 為 foo。 這是一個自調用函數，因此，可以從 x 對像中刪除屬性 foo。 因此，結果將是不確定的。

問題 47。 此代碼將呈現什麼輸出：

var 員工 =

{

公司：'xyz'

}

var Emp1 = Object.create(employee);

刪除 Emp1.company Console.log(emp1.company);

結果 = xyz。 在此代碼中，emp1 對象使用 company 作為其原型屬性。 Delete 運算符不會刪除原型屬性。 對象 emp1 沒有 company 作為其屬性。 可以使用 delete Employee.company 直接從 Employee 對像中刪除公司屬性。

問題 48。 此代碼將呈現什麼輸出：

//nfe（命名函數表達式）

var Foo = 函數欄（）

{

返回 7；

};

類型酒吧（）；

輸出 = 參考誤差。 函數定義只能有一個引用變量作為函數名。

問題 49。 為什麼將 JavaScript 源文件的內容包裝在函數書中很常見？

許多 JavaScript 庫都使用這種技術。 它有助於圍繞文件的內容開發一個閉包，這有助於創建一個私有命名空間，從而避免與不同的 JavaScript 模塊和庫發生任何名稱衝突。

Q50。 在 JavaScript 中，什麼是轉義字符？

轉義字符可幫助您編寫特殊字符，而無需中斷應用程序。

從世界頂級大學獲得軟件工程學位。 獲得行政 PG 課程、高級證書課程或碩士課程，以加快您的職業生涯。

結論

這些是一些流行的 javascript 面試問題，以不同的難度提供，以幫助您在面試中脫穎而出。 使用這些 javascript 面試問題和答案來複習你的 JavaScript 基礎和高級知識是在任何頂級科技公司擔任開發人員的好方法。

有些人更喜歡 Web 開發的藝術方面，而另一些人則更喜歡技術方面。 但是還有第三類人都知道。 第一組是前端開發者，第二組是後端開發者，最後一組是全棧開發者。

對全棧開發人員的需求正在上升。 公司迫切需要能夠同時使用 HTML 和 PHP 的有才華的專業人士。

如果您有興趣了解有關全棧開發的更多信息，請查看 upGrad 和 IIIT-B 的全棧軟件開發執行 PG 計劃，該計劃專為在職專業人士設計，提供 500 多個小時的嚴格培訓、9 個以上的項目和任務， IIIT-B 校友身份、實用的實踐頂點項目和頂級公司的工作協助。