你應該知道的基本 JavaScript 面試問題

作為一個經歷過多次 JavaScript 面試的人，我整理了一系列基本問題來測試我的技能和對核心概念的理解。在本系列的第一部分中，我將分享我個人遇到的 40 個問題，涵蓋從基礎知識到關鍵面試主題的所有內容。

這些問題不只是理論上的；而且是現實的。他們要求您展示您的實踐知識和解決問題的能力。無論您是準備擔任前端還是全端角色，這些問題都將幫助您提高技能。

Chalo Shuru karte hai！

1。 javaScipt是​​動態類型還是變數類型語言？

答案：JavaScript 是一種動態類型語言，這意味著變數類型可以在運行時更改，而不是在編譯時設定。

2。如何向後端發送http請求？

答案：Fetch API、Axios、XMLHttpRequest

3。什麼是執行上下文？

答案：在 JavaScript 中，執行上下文是程式碼運行的環境並決定哪些變數、物件和函數可供使用。每次函數執行時，都會為該函數建立新的執行上下文，並儲存自己的變數和作用域。

每個執行上下文有兩個主要階段：

1. 記憶體建立階段：JavaScript 首先掃描程式碼並為變數和函數分配記憶體。
2. 執行階段：程式碼逐行運行。

4。什麼是詞彙環境？

答案：JavaScript 中的詞法環境是一種資料結構，用於儲存目前作用域中定義的變數和函數，以及對所有外部作用域的引用。它也稱為詞法範圍。

5。 null 和 undefined 有什麼不同？

答案：null：賦值值，表示變數沒有指向任何對象，表示它沒有具體值。

未定義：表示變數被宣告但沒有賦值，表示變數本身缺少值。

null 的型別是 object。
undefined 的類型是未定義的。

6。 JavaScript 如何處理記憶體？

答案：JavaScript 主要透過自動垃圾回收來管理內存，這意味著它在程式碼執行期間自動分配和釋放記憶體。

7。解釋一下事件循環？

答案：JavaScript 是一種單執行緒語言，這表示它一次只能在單一呼叫堆疊中執行一個任務。然而，儘管具有單執行緒特性，JavaScript 仍能夠透過事件循環執行非同步、非阻塞操作。

事件循環是 JavaScript 中處理非同步操作的基本機制。當一個任務（例如 HTTP 請求或 DOM 事件）啟動時，它會被移交給瀏覽器 API。

事件循環持續監控呼叫堆疊與任務
隊列。如果呼叫堆疊為空，事件循環首先檢查
任何待處理任務的微任務佇列並執行它們。

一旦微任務佇列為空，事件循環就會檢查巨集任務佇列並將任務從那裡移到呼叫堆疊中執行。此過程可確保高優先級任務（微任務）在低優先級任務（巨集任務）之前執行。

8。提升和暫時死區？

答案：提升是一項 JavaScript 功能，可讓您在宣告變數和函數之前使用它們。這意味著您可以在程式碼中定義變數和函數之前對其進行定義。提升是由 JavaScript 引擎完成的，它將變數和函數的宣告移到其 「範圍」.

的頂部

在 JavaScript 中，在執行任何程式碼之前，JavaScript 引擎會執行稱為提升的記憶體準備階段。在此階段，引擎為變數和函數分配記憶體。

函數聲明被完全提升，這意味著它們可以在其範圍內的任何位置調用，甚至在它們的實際聲明行之前。

用 var 宣告的變數會被提升並用 undefined 初始化。這意味著您可以在聲明之前訪問 var 變量，但它們的值將是未定義的。

另一方面：用 let 和 const 宣告的變數也會被提升，但保持未初始化狀態。在程式碼中聲明之前訪問它們會導致引用錯誤。

暫時死區：

區塊的開始和let或const變數的實際宣告之間的這段時間稱為臨時死區（TDZ）。 TDZ 從區塊的開頭一直存在到宣告和初始化變數的行。

臨時死區是 JS 中與 let 和 const 聲明相關的概念。具有 let 或 const 宣告的變數會提升到其作用域的頂部，但它們在程式碼中並不立即可用。這意味著您可以在宣告變數之前使用它，但在為其分配值之前，該變數的值將是未定義的。

9。作用域和作用域鏈？

答案：作用域控製程式碼不同部分變數的可存取性。它決定了變數可以被存取的位置並且
不能的地方。

範圍分為三種：

全域範圍： 在全域範圍內宣告的變數可以是
從程式碼中的任何位置存取。
局部作用域：函數內宣告的變數僅
在該函數中可以存取。
區塊作用域：在區塊內宣告的變數（如在curly
內） 大括號 {}) 只能在該區塊內存取。

範圍鏈：

作用域鏈意味著引用鏈。 JavaScript 不會放棄；它有變數狩獵機制。它不斷搜尋變數。首先，它將檢查本地範圍以查看該變數是否可存取。如果沒有，它將在外部範圍中找到。它將繼續下去，直到到達全域範圍或全域執行上下文。這種在鏈中不斷尋找變數的過程稱為作用域鏈。執行上下文總是從內部作用域到外部作用域進行搜索，但不能從外部作用域到內部作用域。

10。原型繼承？

答案：將父物件的原型連結到子物件以共享和利用父類別的屬性。這意味著屬性和方法可以透過原型從一個物件轉移到另一個物件。

例如，.join 和 .length 等方法是原型繼承的一部分，因為這些屬性來自 JavaScript 中的主 Object 類，並且在您的物件中可用。

在 JavaScript 中，一切都是對象，因此對象可以共用屬性。這意味著數組可以使用物件的方法，字串也可以這樣做。

let faang = {
    name: "google",
    salary: function(){
        console.log("100K Salary")
    }
}

let engineer = {
    employeeId: 1278,
    role: function(){
        console.log("Frontend Developer")
    }
}

舊方法：

engineer.__proto__ = faang;

新方式：

let engineer = Object.create(faang, {
    role: function(){
        console.log("Backend Developer")
    }
})

Object.setPrototypeOf(engineer, faang);

// let res = Object.getPrototypeOf(faang);

11。解釋一下 JavaScript 中的 Promise？

答案：Promise 是 JavaScript 中處理非同步操作的一種方式。它們允許您編寫可以非同步執行的程式碼，而不會阻塞主執行緒。 Promise 是使用 Promise 建構函數建立的，並且可以使用 then 方法連結在一起。

JavaScript 中的 Promise 充當佔位符，可以在將來解析或拒絕。

Promise 有三種狀態：待處理、完成和拒絕。當 Promise 處於掛起狀態時，表示非同步操作仍在進行中。當 Promise 被履行時，就表示非同步操作已成功完成。當 Promise 被拒絕時，表示非同步操作失敗。

處理承諾

Promise 提供了處理非同步操作結果的方法：

.then()：用於處理已完成狀態並取得已解決的
值。
.catch()：用於處理拒絕狀態並捕獲任何錯誤
執行期間發生的事情。
.finally()：promise為
時，此方法執行回調 已解決，這意味著無論承諾是否兌現，它都會運行
被拒絕了。

12。解釋一下異步等待？

答：Async/await 是 JavaScript 中的一個語法特性，它允許您以更同步的方式編寫非同步程式碼。它使用 async 和await 關鍵字來定義非同步函數

在 JavaScript 中，非同步函數傳回一個 Promise。 wait 關鍵字暫停非同步函數的執行，直到等待的 Promise 解析。在等待之後，非同步函數的其餘部分進入微任務佇列。這使得非同步程式碼更具可讀性和可管理性。

let faang = {
    name: "google",
    salary: function(){
        console.log("100K Salary")
    }
}

13。解釋一下這個關鍵字？

答案：「this」關鍵字指的是目前正在執行函數的物件。它的值取決於呼叫該函數的上下文。在全域上下文中（例如在瀏覽器中），this 指的是 window 物件

14。解釋一下閉包和詞法範圍？

答案：閉包是可以從其外部作用域存取變數的函數，即使在外部函數完成執行之後也是如此。

這是 JavaScript 中閉包的範例：

let engineer = {
    employeeId: 1278,
    role: function(){
        console.log("Frontend Developer")
    }
}

在此範例中，outerFunction 函數定義了一個變數outerVariable 和一個可以存取outerVariable 的函數innerFunction。 innerFunction 傳回outerFunction 函數，這允許稍後呼叫它。

一個與 DOM 相關的閉包範例是 addEventListener 方法。 addEventListener 方法可讓您將事件偵聽器附加到 DOM 中的元素。即使元素已從 DOM 中刪除，事件偵聽器函數也可以存取元素的屬性和方法。

這是使用有閉包的 addEventListener 方法的範例：

engineer.__proto__ = faang;

在此範例中，handleClick 函數是在 addEventListener 方法內定義的。即使按鈕元素已從 DOM 中刪除，handleClick 函數也可以存取按鈕元素。

詞彙範圍：

在 JavaScript 中，詞法作用域是根據變數宣告來決定變數作用域的概念。這意味著變數的範圍由
中的程式碼區塊決定 它是由它聲明的，而不是由使用它的程式碼區塊聲明的。

15。 javascript是單線程還是多線程？

答案：JavaScript 是一種單執行緒語言，這表示它有一個呼叫堆疊和一個記憶體堆。它會依序執行程式碼，完成一段程式碼後再繼續執行下一段。這種結構允許 JavaScript 處理非同步操作而不阻塞主執行緒。

異步行為讓我們可以使用 setTimeout、AJAX 和 Promise 等功能。這些函數由瀏覽器管理，而不是 JavaScript 本身，這有助於在等待這些操作完成時保持主執行緒自由運行其他程式碼。

16。解釋一下 JavaScript 引擎是如何運作的？

答案：JavaScript引擎是執行JavaScript程式碼的程式。它們存在於 Web 瀏覽器和其他託管 JavaScript 的環境中。最受歡迎的 JavaScript 引擎是 Google 的 V8、SpiderMonkey 和 JavaScriptCore。這些引擎是用 C 語言編寫的，用於執行 JavaScript 程式碼。

17。 var、let 和 const 之間的差異？

答案：

-var：用關鍵字「var」定義的變數的範圍僅限於定義它的「函數」。如果在函數外部定義，則變數的作用域是全域的。 var 的預設值未定義。

• let：用關鍵字“let”或“const”定義的變數的範圍僅限於大括號定義的“區塊”，即{}。 let 的預設值未初始化。
• const：用關鍵字「const」定義的變數的範圍僅限於花括號定義的區塊。但是，如果使用關鍵字 const 定義變數，則無法重新指派該變數。 const 預設值未初始化。

18。 javascript中不同類型的資料類型？

答：JavaScript 中的資料型別主要有兩種：原始資料型別和物件（引用）資料型態。

原始資料型別是 JavaScript 中的基本資料型別。它們包括數字、字串、布林值、null 和未定義。符號也是原始資料類型，代表唯一識別碼。

物件資料型別是包含其他資料型別的資料型別。它們是使用物件文字或建構函數創建的。物件、陣列和函數是物件資料類型的範例。

19。討論回調？

答案：回呼函數是作為參數傳遞給其他函數並在某個事件發生時被呼叫的函數。它們通常在 JavaScript 中用於處理非同步操作，例如發出 HTTP 請求或從檔案中讀取。

20。討論回調地獄？

答案：回調地獄是 JavaScript 中的一個問題，其中函數相互嵌套，使得程式碼難以閱讀和理解。它可能導致回調被多次調用或根本不被調用，從而導致意外行為。

這是回調地獄的例子：

let faang = {
    name: "google",
    salary: function(){
        console.log("100K Salary")
    }
}

21。 如何在 JavaScript 中建立物件？

答案：物件是 JavaScript 中的基本資料型別。它們可以使用物件文字或建構函數來建立。

物件字面量括在大括號 {} 中，用於建立具有鍵值對的物件。這是物件文字的範例：

let engineer = {
    employeeId: 1278,
    role: function(){
        console.log("Frontend Developer")
    }
}

建構函式用於建立具有自訂屬性和方法的物件：

engineer.__proto__ = faang;

儘管還有其他方法來建立對象，例如使用 Object.create() 方法，但物件字面量和建構函式是在 JavaScript 中建立物件最常見的方法。

22。如何在 JavaScript 中複製物件？

答案：

1. 使用Object.assign()：

let engineer = Object.create(faang, {
    role: function(){
        console.log("Backend Developer")
    }
})

Object.setPrototypeOf(engineer, faang);

// let res = Object.getPrototypeOf(faang);

1. 使用擴充運算子：

async function fetchData() {
  try {
    const response = await fetch('https://api.freeapi.app/v1/jokes/random');
    const data = await response.json();
    console.log(data);
  } catch (error) {
    console.error(error);
  }
}

fetchData()
  .then(() => console.log('Data fetched'))
  .catch(error => console.error(error));

23。 javascript 中的休息和展開運算子是什麼？

答案：休息和擴充運算子是 JavaScript 中的兩個重要功能，它們允許您以更簡潔和可讀的方式處理陣列和物件。

剩餘運算子允許您將陣列或物件作為參數並在函數呼叫中使用它。

擴充運算子可讓您將陣列或物件擴充為單一元素。

function outerFunction() {
  const outerVariable = 'I am an outer variable';

  function innerFunction() {
    console.log(outerVariable); // Output: I am an outer variable
  }

  return innerFunction;
}

const closure = outerFunction();
closure(); // Output: I am an outer variable

在此範例中，sum 函數使用剩餘運算子將數字陣列作為參數。
擴充運算子用於將數組擴展為單一元素，然後將其傳遞給reduce函數。

24。 JavaScript 中的高階函數是什麼？

答案：高階函數是將其他函數作為參數或傳回函數作為結果的函數。它們是 JavaScript 中的強大工具，可讓您編寫更靈活且可重複使用的程式碼。

const button = document.getElementById('myButton');

function handleClick() {
  console.log('Button clicked');
}

button.addEventListener('click', handleClick);

25。用 javascript 說出 ES6 的一些特性。

答案：以下是 ES6 的一些主要特性：

• 箭頭函數：箭頭函數為編寫函數提供了更簡潔的語法。它們是使用 => 定義的。運算符。
• 範本文字：範本文字允許您在字串中嵌入表達式。它們用反引號 (`) 括起來，可用來建立多行字串。
• 解構賦值：解構賦值可讓您從陣列或物件中提取值並將它們指派給變數。這是使用 = 運算子完成的。
• 擴充運算子：擴充運算子可讓您將陣列或物件擴充為單一元素。它用於將多個參數傳遞給函數。
• 類別：類別提供了一種用屬性和方法定義物件的方法。它們是使用 class 關鍵字定義的。
• 模組：模組可讓您將程式碼分割為單獨的檔案並在它們之間匯入/匯出功能。它們是使用 import 和 export 關鍵字定義的。
• Promises：Promises 提供了一種處理 JavaScript 中非同步操作的方法。它們用於表示非同步操作的最終完成或失敗。
• 生成器：生成器可讓您定義可以暫停和復原的函數。它們是使用 function 關鍵字定義的。
• 映射和集合：映射和集合是允許您儲存鍵值對的資料結構。它們是使用 Map 和 Set 建構函數定義的。

為什麼這些問題很重要

這些問題反映了我在面試中遇到的核心概念。它們旨在測試您在現實場景中對 JavaScript 的理解。

準備 JavaScript 面試嗎？重新審視這些問題並練習你的答案。如需更深入的學習體驗，請查看我在 Quicknxt.com 上的課程，以獲得實用知識並提高您的程式設計技能。讓我們一起繼續學習吧！

以上是你應該知道的基本 JavaScript 面試問題的詳細內容。更多資訊請關注PHP中文網其他相關文章！