53 道 JavaScript 前端基礎(chǔ)面試題
寫在前面

由于目前現(xiàn)在求職市場(chǎng)競(jìng)爭(zhēng)激烈,許多初學(xué)者和經(jīng)驗(yàn)豐富的開發(fā)人員都面臨著求職問題。因此,最好的方法是不斷學(xué)習(xí)并提高自己的技能。
為了拿到心儀的offer,我們需要認(rèn)真準(zhǔn)備面試,因此,今天我為大家準(zhǔn)備了53道面試題,我以“一問一答”的形式將這些前端面試題分享出來(lái),希望能夠幫助到你。
雖然這些面試題主要針對(duì)初級(jí)開發(fā)人員,但其中也有包括一些中級(jí)開發(fā)人員的題。
那么,我們現(xiàn)在開始吧。
1. JavaScript 中有哪些數(shù)據(jù)類型?
- Number — 數(shù)字
- String — 字符串
- Boolean — 布爾類型,true 或 false
- Object — JavaScript 對(duì)象
- null — 表示“無(wú)”、“空”或“未知值”的特殊值。
- undefined ——“值尚未被分配”。如果聲明了變量但沒有分配值,則分配此類型。
- Symbol— 一種唯一且不可變的數(shù)據(jù)類型,可用作對(duì)象屬性的標(biāo)識(shí)符。
- BigInt — 用于創(chuàng)建大數(shù)。
const bigInt = 1234567890123456789012345678901234567890n;
2.“==”和“===”有什么區(qū)別?
運(yùn)算符“==”檢查抽象相等,而“===”檢查嚴(yán)格相等。換句話說(shuō),“==”運(yùn)算符在比較之前執(zhí)行必要的類型轉(zhuǎn)換,而“===”則不執(zhí)行類型轉(zhuǎn)換。因此,如果兩個(gè)值不是同一類型,則使用“===”運(yùn)算符時(shí)將返回 false。
3. 變量的聲明方式有哪些?
聲明變量有 4 種方法:聲明變量有 4 種方法:
foo =123;
var foo = 123;
let a = 123;
conest a = 123;使用“var”關(guān)鍵字聲明變量與第一種方法類似。 以這種方式聲明的變量具有全局或函數(shù)作用域,但缺少塊作用域,這是一個(gè)缺點(diǎn)。
“l(fā)et”和“const”是聲明變量的更好方法。 它們具有塊作用域,這意味著在函數(shù)內(nèi)部聲明的變量在該函數(shù)外部將不可見。
“const”變量是不可變的,但如果它是一個(gè)對(duì)象,你可以改變它的屬性,如果它是一個(gè)數(shù)組,你可以修改和添加元素。
4. null 和 undefined 有什么區(qū)別?
兩個(gè)選項(xiàng)都代表空值。 如果我們初始化一個(gè)變量但不給它賦值,它就會(huì)被分配一個(gè)特殊的標(biāo)記—undefined。Null 是手動(dòng)分配的。Null 是一個(gè)特殊值,表示“無(wú)”、“空”或“未知值”。 如果我們需要清除變量的值,我們?cè)O(shè)置 foo = null。
5. 箭頭函數(shù)以及與常規(guī)函數(shù)的區(qū)別。
- 箭頭函數(shù)不能使用參數(shù)對(duì)象。
- 它們有不同的語(yǔ)法。
- 箭頭函數(shù)沒有自己的 this 上下文。 當(dāng)引用 this 時(shí),箭頭函數(shù)從周圍的作用域中獲取上下文。
- 箭頭函數(shù)不能用作構(gòu)造函數(shù)。 換句話說(shuō),它們不能用 new 關(guān)鍵字調(diào)用。
6. 什么是閉包?以及為什么需要它們?
閉包是一個(gè)函數(shù)以及它可以訪問的所有外部變量。 例如,有一個(gè)具有嵌套函數(shù)的函數(shù),該函數(shù)將關(guān)閉并保留其父級(jí)的變量。

7. 什么是模板文字?
模板文字用反引號(hào) (") 括起來(lái),并允許多行字符串。 它們還允許在其中嵌入表達(dá)式。

8. 什么是Set和Map?
Map是一個(gè)集合,是一種按照鍵值對(duì)原理進(jìn)行操作的數(shù)據(jù)結(jié)構(gòu),類似于Object。 然而,Map 和 Object 之間的主要區(qū)別在于 Map 允許使用任何類型的鍵。Set 是一種沒有鍵的集合類型,是一個(gè)數(shù)組,其中每個(gè)值只能出現(xiàn)一次。 集合在其內(nèi)部存儲(chǔ)唯一的值。
9. 如何檢查對(duì)象中是否存在屬性?
第一種方法是使用 hasOwnProperty 函數(shù),該函數(shù)適用于每個(gè)對(duì)象。第二種方法是使用 in 運(yùn)算符。 但是,在使用 in 運(yùn)算符時(shí)必須小心,因?yàn)樗鼤?huì)檢查鏈中的所有原型。

10. 如何訪問對(duì)象屬性?
第一種方式是靜態(tài)的,使用點(diǎn)表示法:obj.a。
第二種方式是動(dòng)態(tài)的,使用方括號(hào):obj[‘a(chǎn)’]。

11. 使用數(shù)組的主要方法有哪些?
- forEach — 用于循環(huán)數(shù)組的迭代方法,不返回任何內(nèi)容。 它提供了比常規(guī) for 循環(huán)更優(yōu)雅的替代方案。
- filter(callback, [args]) — 一種使用提供的函數(shù)過(guò)濾數(shù)組的方法。 它創(chuàng)建一個(gè)新數(shù)組,其中僅包含回調(diào)(item, i, arr) 函數(shù)返回 true 的原始數(shù)組中的元素。
- map(callback, [args]) — 一種轉(zhuǎn)換數(shù)組的方法。 它創(chuàng)建一個(gè)新數(shù)組,其中包含為數(shù)組的每個(gè)元素調(diào)用回調(diào)(item, i, arr) 函數(shù)的結(jié)果。
- reduce(callback, [initValue]) — 一種按順序處理數(shù)組的每個(gè)元素,同時(shí)維護(hù)中間結(jié)果的方法。
12.創(chuàng)建對(duì)象的方式有哪些?
使用構(gòu)造函數(shù):

使用對(duì)象文字表示法:

使用一個(gè)類:

使用創(chuàng)建函數(shù):

13.什么是Promise?
Promise 是一個(gè)設(shè)計(jì)用于處理異步代碼的對(duì)象。它維持自己的狀態(tài)。最初,Promise 處于待處理狀態(tài),如果異步代碼執(zhí)行成功,則 Promise 轉(zhuǎn)換為已完成狀態(tài);如果發(fā)生錯(cuò)誤,則轉(zhuǎn)換為拒絕狀態(tài)。Promise 接受兩個(gè)回調(diào)函數(shù):
- onFulfilled,當(dāng)Promise履行時(shí)觸發(fā)。
- onRejected,當(dāng)Promise被拒絕時(shí)觸發(fā)。
使用模式如下:
- 需要異步執(zhí)行某些操作的代碼會(huì)創(chuàng)建一個(gè) Promise 并返回它。
- 外部代碼收到 Promise 后,將 onFulfilled 和 onRejected 回調(diào)函數(shù)傳遞給它。
- 該過(guò)程完成后,異步代碼將 Promise 轉(zhuǎn)換為已完成或已拒絕狀態(tài),并自動(dòng)調(diào)用相應(yīng)的回調(diào)函數(shù)。
14.什么是async/await以及如何使用它?
async/await 是一種處理 Promise 的特殊語(yǔ)法。
使用異步語(yǔ)法聲明的函數(shù)始終返回 Promise。
關(guān)鍵字await使JavaScript解釋器等待,直到await右側(cè)的Promise完成后才繼續(xù)執(zhí)行。然后,它將返回結(jié)果,并且代碼將繼續(xù)執(zhí)行。wait 不能在常規(guī)函數(shù)中使用。
15. 如何檢查一個(gè)對(duì)象是否是數(shù)組?
要檢查對(duì)象是否是數(shù)組,可以使用 Array.isArray() 方法。它接受一個(gè)對(duì)象作為輸入,如果該對(duì)象是數(shù)組則返回 true,如果不是數(shù)組則返回 false。

16. 擴(kuò)展運(yùn)算符 (…) 的目的是什么?
擴(kuò)展運(yùn)算符 (…) 用于解包數(shù)組或?qū)ο蟆?/span>
它允許你擴(kuò)展可迭代的元素,例如,數(shù)組和字符串。
它用在調(diào)用的預(yù)期參數(shù)數(shù)量為零或更多的函數(shù)中。
它用在數(shù)組文字或表達(dá)式中。
它用在對(duì)象文字中,其中鍵值對(duì)的數(shù)量應(yīng)為零或更多。

17. 復(fù)制對(duì)象時(shí)如何避免引用依賴?
如果對(duì)象不包含嵌套對(duì)象,例如:

在這種情況下,你可以使用展開運(yùn)算符或 Object.assign() 方法:

如果對(duì)象包含嵌套對(duì)象:

在這種情況下,你需要執(zhí)行深復(fù)制。
解決方法雖然較慢,但是:

該方法適用于沒有原型和函數(shù)的對(duì)象。
或者,你可以使用 lodash 庫(kù)的 deepClone() 函數(shù)。
18. 如何改變函數(shù)的上下文?
使用bind()方法,該方法返回一個(gè)帶有綁定上下文的新函數(shù)。

使用 call() 和 apply() 方法。主要區(qū)別在于 call() 接受參數(shù)序列,而 apply() 接受參數(shù)數(shù)組作為第二個(gè)參數(shù)。

19. 什么是三元運(yùn)算符/條件運(yùn)算符?
三元運(yùn)算符是 if-else 語(yǔ)句的簡(jiǎn)寫符號(hào)。運(yùn)算符由問號(hào)和冒號(hào)表示。它被稱為三元,因?yàn)樗俏ㄒ唤邮苋齻€(gè)參數(shù)的運(yùn)算符。
健康)狀況 ?表達(dá)式_1:表達(dá)式_2

20.什么是解構(gòu)?
解構(gòu)是一種允許我們將數(shù)組和對(duì)象解包為多個(gè)變量的語(yǔ)法。

21.什么是DOM?
DOM 代表文檔對(duì)象模型。它是將 HTML 文檔表示為標(biāo)簽樹。
例子
DOM 樹中的每個(gè)節(jié)點(diǎn)都是一個(gè)對(duì)象。
HTML 文檔的基本元素是標(biāo)簽。

根據(jù)文檔對(duì)象模型 (DOM),每個(gè) HTML 標(biāo)簽都是一個(gè)對(duì)象。嵌套標(biāo)簽是其父元素的“子元素”。標(biāo)簽內(nèi)的文本也是一個(gè)對(duì)象。所有這些對(duì)象都可以使用 JavaScript 訪問,我們可以使用它們來(lái)操作頁(yè)面。
22.什么是事件循環(huán)?
事件循環(huán)——一種管理代碼執(zhí)行的機(jī)制。它以正確的順序處理事件處理和任務(wù)執(zhí)行。
事件循環(huán)的主要思想是JavaScript在單線程環(huán)境中運(yùn)行但可以處理異步操作。當(dāng)異步操作(例如服務(wù)器請(qǐng)求)完成時(shí),它將相應(yīng)的事件放入事件隊(duì)列中。
事件循環(huán)以循環(huán)方式工作,按照事件到達(dá)的順序處理這些事件。
它從隊(duì)列中獲取一個(gè)事件并將其傳遞以供執(zhí)行。如果事件包含回調(diào)或處理程序,則會(huì)調(diào)用它,并執(zhí)行與該事件關(guān)聯(lián)的代碼。
事件循環(huán)還處理其他任務(wù),例如計(jì)時(shí)器和微任務(wù)(Promise)。它管理所有這些任務(wù)的執(zhí)行順序,以確保一致性并防止阻塞代碼執(zhí)行的主線程。
簡(jiǎn)而言之,JavaScript 中的事件循環(huán)通過(guò)處理隊(duì)列中的事件并按正確的順序執(zhí)行相應(yīng)的代碼來(lái)管理異步操作。這使得 JavaScript 在處理異步操作時(shí)能夠響應(yīng)并有效地利用其資源。

23.什么是原型繼承?
JavaScript 中的每個(gè)對(duì)象都有一個(gè)屬性——原型??梢詫⒎椒ê蛯傩蕴砑拥皆椭???梢愿鶕?jù)原型創(chuàng)建其他對(duì)象。創(chuàng)建的對(duì)象自動(dòng)繼承其原型的方法和屬性。如果對(duì)象中不存在某個(gè)屬性,則將在原型中執(zhí)行其搜索。
24.什么是可選鏈運(yùn)算符?
可選鏈接運(yùn)算符 ?。如果 ? 后面的部分停止計(jì)算并返回undefined。undefined或?yàn)閚ull。
讓我們考慮一個(gè)用戶對(duì)象。大多數(shù)用戶都有一個(gè)地址 user.address 和一個(gè)街道 user.address.street,但有些用戶沒有提供地址。在這種情況下,可選鏈接運(yùn)算符可以幫助我們?cè)趪L試訪問未在地址中指定街道的用戶街道時(shí)避免錯(cuò)誤。

25.什么是 Shadow DOM?
Shadow DOM 是一組 Web 標(biāo)準(zhǔn),允許封裝網(wǎng)頁(yè)上元素的結(jié)構(gòu)和樣式。它代表 DOM 的一個(gè)特殊片段,位于元素內(nèi)部并與頁(yè)面的其余部分分開。Shadow DOM 用于創(chuàng)建具有獨(dú)立且風(fēng)格化內(nèi)容的組件和小部件,這些內(nèi)容與頁(yè)面的整體結(jié)構(gòu)不沖突。
26.什么是遞歸?如何使用它?
遞歸是一種解決問題的方法,其中函數(shù)通過(guò)在自己的函數(shù)體內(nèi)重用自身來(lái)解決問題。簡(jiǎn)單來(lái)說(shuō),就是函數(shù)調(diào)用自身的時(shí)候。
遞歸函數(shù)包括:
- 終止條件或基本情況
- 遞歸步驟——一種將問題簡(jiǎn)化為更簡(jiǎn)單形式的方法。

基本情況是必要條件;否則,會(huì)因函數(shù)調(diào)用無(wú)限循環(huán)而導(dǎo)致堆棧溢出。
27. 函數(shù)表達(dá)式和函數(shù)聲明有什么區(qū)別?
函數(shù)聲明是聲明函數(shù)的傳統(tǒng)方式。

函數(shù)表達(dá)式:

通過(guò)函數(shù)聲明,可以創(chuàng)建函數(shù)并將其分配給變量,就像任何其他值一樣。本質(zhì)上,函數(shù)如何定義并不重要,因?yàn)樗谴鎯?chǔ)在變量“foo”中的值。
然而,函數(shù)聲明是在執(zhí)行代碼塊之前處理的,這意味著它們?cè)谡麄€(gè)代碼塊中都是可見的。另一方面,函數(shù)表達(dá)式僅在執(zhí)行流到達(dá)時(shí)才會(huì)創(chuàng)建。
28.什么是構(gòu)造函數(shù)?
構(gòu)造函數(shù)是用于創(chuàng)建對(duì)象的常規(guī)函數(shù)。但是,使用它們有兩個(gè)規(guī)則:
- 構(gòu)造函數(shù)的名稱應(yīng)以大寫字母開頭。
- 應(yīng)使用 new 運(yùn)算符調(diào)用構(gòu)造函數(shù)。

當(dāng)使用 new 運(yùn)算符創(chuàng)建構(gòu)造函數(shù)時(shí),會(huì)發(fā)生以下情況:
- 創(chuàng)建一個(gè)新的空對(duì)象并將其分配給該對(duì)象。
- 執(zhí)行構(gòu)造函數(shù)內(nèi)的代碼。通常,此代碼將修改 this 對(duì)象并添加新屬性。
- 返回此值。
29. 如何從對(duì)象中獲取鍵列表和值列表?
你可以使用 Object.keys() 獲取鍵列表,使用 Object.values() 獲取值列表。

30. 提供 ES6 中新功能的示例。
最常見的:
- let和const。引入新關(guān)鍵字 let 和 const 用于聲明具有塊作用域的變量。
- 箭頭函數(shù)。箭頭函數(shù)的概念允許更簡(jiǎn)潔和清晰的函數(shù)定義。

- 默認(rèn)參數(shù)。你可以定義函數(shù)參數(shù)的默認(rèn)值。

- 展開運(yùn)算符 (...)。擴(kuò)展運(yùn)算符允許解包函數(shù)參數(shù)的數(shù)組或?qū)ο笤鼗騽?chuàng)建新的數(shù)組/對(duì)象。

- 解構(gòu)。解構(gòu)允許從數(shù)組或?qū)ο笾刑崛≈挡⑺鼈兎峙浣o變量。

31. ES6中如何進(jìn)行類繼承?
類繼承是使用“extends”關(guān)鍵字后跟父類的名稱來(lái)完成的。

32. JavaScript 中的微任務(wù)和宏任務(wù)是什么?
在 JavaScript 中,微任務(wù)和宏任務(wù)是指需要在事件循環(huán)中執(zhí)行的任務(wù)類型。
微任務(wù)是在瀏覽器重新繪制頁(yè)面之前需要在當(dāng)前事件循環(huán)內(nèi)執(zhí)行的任務(wù)。它們通常使用 Promise.then()、process.nextTick()(在 Node.js 中)或 MutationObserver 等方法添加到執(zhí)行隊(duì)列中。
微任務(wù)的示例包括執(zhí)行 Promise 處理程序和 DOM 突變。
另一方面,宏任務(wù)是在當(dāng)前事件循環(huán)完成之后、在屏幕上呈現(xiàn)更改之前需要執(zhí)行的任務(wù)。
這包括使用 setTimeout、setInterval、requestAnimationFrame 添加到事件隊(duì)列的任務(wù),以及處理輸入事件和網(wǎng)絡(luò)請(qǐng)求。
宏任務(wù)在當(dāng)前事件循環(huán)中的所有微任務(wù)處理完畢后執(zhí)行。
微任務(wù)和宏任務(wù)之間的區(qū)別很重要,因?yàn)樗鼪Q定了執(zhí)行順序并允許管理 JavaScript 中不同任務(wù)的優(yōu)先級(jí)。
微任務(wù)具有更高的優(yōu)先級(jí),并且在宏任務(wù)之前執(zhí)行,這樣可以更快地更新界面并防止阻塞主 JavaScript 執(zhí)行線程。
33.什么是生成器?
生成器根據(jù)需要一個(gè)一個(gè)地生成一系列值。生成器可以很好地與對(duì)象配合使用,并且可以輕松創(chuàng)建數(shù)據(jù)流。
要聲明生成器,需要使用一種特殊的語(yǔ)法——生成器函數(shù)。

next() 是生成器的主要方法。調(diào)用時(shí),next() 開始執(zhí)行代碼,直到最近的yield 語(yǔ)句。該值可能不存在,在這種情況下它表示為未定義。當(dāng)達(dá)到y(tǒng)ield時(shí),函數(shù)執(zhí)行暫停,并將相應(yīng)的值返回給外部代碼。

34.瀏覽器中存儲(chǔ)數(shù)據(jù)的方法有哪些?
在瀏覽器中存儲(chǔ)數(shù)據(jù)有多種方法:
- LocalStorage 和 SessionStorage — 在瀏覽器中存儲(chǔ)鍵值對(duì)。其中存儲(chǔ)的數(shù)據(jù)在頁(yè)面刷新后仍保留。兩種存儲(chǔ)選項(xiàng)都只能使用字符串作為鍵和值,因此需要使用 JSON.stringify() 轉(zhuǎn)換對(duì)象。Cookie — 存儲(chǔ)在瀏覽器中的小數(shù)據(jù)字符串。
- Cookie 通常由 Web 服務(wù)器使用 Set-Cookie 標(biāo)頭設(shè)置。然后,瀏覽器將使用 Cookie 標(biāo)頭自動(dòng)將它們添加到幾乎每個(gè)對(duì)同一域的請(qǐng)求中。一個(gè) cookie 最多可以容納 4kb 的數(shù)據(jù)。根據(jù)瀏覽器的不同,每個(gè)站點(diǎn)允許使用 20 個(gè)以上的 cookie。
- IndexedDB — 內(nèi)置數(shù)據(jù)庫(kù),比 localStorage 更強(qiáng)大。它是一個(gè)鍵值存儲(chǔ),其中有多種類型的鍵可用,值幾乎可以是任何東西。IndexedDB 支持事務(wù)以提高可靠性,支持鍵范圍查詢和索引,并允許存儲(chǔ)比 localStorage 更多的數(shù)據(jù)。IndexedDB 是為離線應(yīng)用程序設(shè)計(jì)的,可以與 Service Workers 等技術(shù)結(jié)合。
35、sessionStorage和localStorage有什么區(qū)別?
SessionStorage 和 localStorage 允許在瀏覽器中以鍵值格式存儲(chǔ)對(duì)象。
主要區(qū)別是:
- localStorage 最多可以存儲(chǔ) 10 MB 的數(shù)據(jù),而 sessionStorage 最多可以存儲(chǔ) 5 MB 的數(shù)據(jù)。
- localStorage 中的數(shù)據(jù)不會(huì)被刪除,而 sessionStorage 中的數(shù)據(jù)會(huì)在瀏覽器選項(xiàng)卡關(guān)閉時(shí)被刪除。
- localStorage 中的數(shù)據(jù)可以從任何窗口訪問,而 sessionStorage 中的數(shù)據(jù)只能從同一瀏覽器窗口訪問。
36.什么是正則表達(dá)式?
正則表達(dá)式是由特殊規(guī)則和模式定義的字符串。它們是一個(gè)強(qiáng)大的工具,可以檢測(cè)和處理字符串中的復(fù)雜結(jié)構(gòu)。

37.WeakSet和WeakMap是什么,它們與Map和Set有何不同?
WeakMap 和 Map 之間的第一個(gè)區(qū)別是 WeakMap 中的鍵必須是對(duì)象,而不是原始值。
第二個(gè)區(qū)別在于數(shù)據(jù)結(jié)構(gòu)的內(nèi)存存儲(chǔ)。JavaScript 引擎將值保存在內(nèi)存中,只要它們是可訪問的,這意味著它們可以被使用。
通常,對(duì)象屬性、數(shù)組元素或其他數(shù)據(jù)結(jié)構(gòu)被認(rèn)為是可訪問的,并且只要數(shù)據(jù)結(jié)構(gòu)存在,它們就會(huì)保留在內(nèi)存中,即使沒有其他對(duì)它們的引用。
對(duì)于 WeakMap 和 WeakSet 來(lái)說(shuō),它的工作方式不同。一旦對(duì)象變得不可訪問,它將從數(shù)據(jù)結(jié)構(gòu)中刪除。
38. 為什么兩個(gè)具有相同字段的對(duì)象比較時(shí)返回 false?
根據(jù)對(duì)內(nèi)存區(qū)域的引用來(lái)比較對(duì)象。對(duì)于 JavaScript,test1 和 test2 對(duì)象是不同的,即使它們具有相同的字段。僅當(dāng)對(duì)象是同一個(gè)對(duì)象時(shí),它們才相等。

39. 為什么我們可以調(diào)用原始類型的方法?
JavaScript 允許使用原始數(shù)據(jù)類型(字符串、數(shù)字等),就像它們是對(duì)象一樣。原始數(shù)據(jù)類型有方法。
為了使此功能可用,每個(gè)基本數(shù)據(jù)類型都有自己的包裝對(duì)象:字符串、數(shù)字、布爾值和符號(hào)。由于這些包裝對(duì)象,原始數(shù)據(jù)類型具有不同的方法集,例如 toLowerCase() 或 toUpperCase()。
40. 如何檢查對(duì)象是從哪個(gè)類創(chuàng)建的?
你可以使用instanceof運(yùn)算符檢查對(duì)象是從哪個(gè)類創(chuàng)建的,同時(shí)考慮繼承。

41. 編寫代碼,每 10 秒記錄一次在網(wǎng)站上花費(fèi)的時(shí)間(以秒為單位)。

42.什么是純函數(shù)?
純函數(shù)需要滿足以下兩個(gè)條件的函數(shù):
- 每次使用相同的參數(shù)集調(diào)用該函數(shù)時(shí),它都會(huì)返回相同的結(jié)果。
- 它沒有副作用,這意味著它不會(huì)修改函數(shù)外部的變量。

43.什么是高階函數(shù)?
高階函數(shù)是接受另一個(gè)函數(shù)作為參數(shù)或返回一個(gè)函數(shù)作為結(jié)果的函數(shù)。

44. 如果我們可以使用回調(diào)來(lái)處理異步代碼,為什么還需要 Promise?
如果我們想使用回調(diào)函數(shù)從服務(wù)器異步獲取一些數(shù)據(jù),則會(huì)導(dǎo)致以下結(jié)果:

這稱為回調(diào)地獄,因?yàn)槊總€(gè)回調(diào)都嵌套在另一個(gè)回調(diào)中,并且每個(gè)內(nèi)部回調(diào)都依賴于父函數(shù)。
使用Promises,我們可以重寫上面的代碼:

有了Promises,執(zhí)行順序就清晰了,讓代碼更具可讀性。
45. 編寫你自己的bind 方法的實(shí)現(xiàn)。
為了實(shí)現(xiàn)它,我們可以使用閉包和 apply() 方法將函數(shù)綁定到上下文。

46. 用加、減、乘、除和 get 方法編寫一個(gè)計(jì)算器函數(shù)。該函數(shù)必須通過(guò)可選鏈來(lái)工作。

47. 編寫一個(gè) randomSort 函數(shù),該函數(shù)接受一個(gè)數(shù)字?jǐn)?shù)組并按隨機(jī)順序?qū)?shù)組進(jìn)行排序。
你可以使用 sort() 方法和 Math.random() 來(lái)實(shí)現(xiàn)此目的。

48. 編寫一個(gè)deleteGreatestValue 函數(shù),該函數(shù)接受一個(gè)二維數(shù)字?jǐn)?shù)組,并從每個(gè)嵌套數(shù)組中刪除最大的數(shù)字。
我們應(yīng)該迭代每個(gè)嵌套數(shù)組,獲取每個(gè)嵌套數(shù)組的最大值并將其刪除。

49. 編寫一個(gè) sortPeople 函數(shù),它接受一個(gè)字符串名稱數(shù)組和一個(gè)數(shù)字高度數(shù)組,其中名稱[i] == heights[i]。它應(yīng)該根據(jù)高度數(shù)組對(duì)名稱數(shù)組進(jìn)行排序。

50. 編寫一個(gè)subsets 函數(shù),它接受一個(gè)數(shù)字?jǐn)?shù)組nums 并返回這些數(shù)字的所有可能的數(shù)組變體。

51.如何反轉(zhuǎn)鏈表?
讓我們創(chuàng)建一個(gè)函數(shù)reverseLinkedList,它將鏈表作為輸入并返回該列表的反轉(zhuǎn)版本。
方法:
- 它用 null 初始化結(jié)果變量,該變量將保存反轉(zhuǎn)的列表。
- 它使用 head 初始化 root 變量,該變量指向列表的開頭。
- 它進(jìn)入一個(gè) while 循環(huán),一直持續(xù)到 root 變?yōu)?null,表示列表末尾。
- 在循環(huán)內(nèi)部,它檢查結(jié)果是否已經(jīng)有元素。如果是,它會(huì)使用當(dāng)前值 root.val 和指向下一個(gè)節(jié)點(diǎn)結(jié)果的指針創(chuàng)建一個(gè)新的列表節(jié)點(diǎn)。然后它用這個(gè)新節(jié)點(diǎn)更新結(jié)果。
- 如果 result 還沒有任何元素,它將創(chuàng)建一個(gè)新的列表節(jié)點(diǎn),其中當(dāng)前值 root.val 和 null 作為指向下一個(gè)節(jié)點(diǎn)的指針。然后它用這個(gè)新節(jié)點(diǎn)更新結(jié)果。
- 更新結(jié)果后,通過(guò)將 root.next 分配給 root 來(lái)移動(dòng)到列表中的下一個(gè)元素。
- while 循環(huán)完成后,它返回結(jié)果中存儲(chǔ)的反轉(zhuǎn)列表。
總之,該函數(shù)通過(guò)從頭到尾迭代每個(gè)節(jié)點(diǎn),為每個(gè)值創(chuàng)建一個(gè)新的列表節(jié)點(diǎn)并相應(yīng)地更新指針來(lái)反轉(zhuǎn)鏈表。

52.如何對(duì)鏈表進(jìn)行排序?
讓我們創(chuàng)建一個(gè)函數(shù) sortList,它將鏈表作為輸入并返回該列表的排序版本。
方法:
- 檢查給定的鏈表是否為空。
- 遍歷鏈表并將節(jié)點(diǎn)值存儲(chǔ)到數(shù)組中。
- 使用內(nèi)置的 sort() 方法對(duì)數(shù)組進(jìn)行排序。
- 使用排序后的數(shù)組創(chuàng)建一個(gè)新的鏈表。
- 返回創(chuàng)建的鏈表的頭。

53. Observables 和 Promise 之間有什么區(qū)別?
Observables 和 Promises 都用于處理 JavaScript 中的異步操作。
一個(gè)關(guān)鍵的區(qū)別是 Observables 可以隨著時(shí)間的推移發(fā)出多個(gè)值。
它們適合處理數(shù)據(jù)流,例如用戶交互、事件或來(lái)自 API 的隨時(shí)間變化的數(shù)據(jù)。另一方面,承諾只能用單個(gè)值解析一次。
它們適合處理要么成功要么失敗的單個(gè)異步操作。
總之,Promises 最適合處理具有單個(gè)結(jié)果的一次性異步操作,而 Observables 在處理持續(xù)的數(shù)據(jù)流、事件和復(fù)雜的數(shù)據(jù)處理管道時(shí)更強(qiáng)大。
它們之間的選擇取決于特定的用例以及你正在處理的異步操作的性質(zhì)。
寫在最后
在準(zhǔn)備這些面試題以及研究所涵蓋的主題并查看相關(guān)資源的時(shí)候,相當(dāng)于又把一些知識(shí)做了復(fù)習(xí),對(duì)于之前沒有記住的內(nèi)容,通過(guò)對(duì)這些內(nèi)容的掌握,可以提升你的面試成功通過(guò)機(jī)率。































