53 道 JavaScript 前端基礎(chǔ)面試題
當(dāng)前位置:點晴教程→知識管理交流
→『 技術(shù)文檔交流 』
3. 變量的聲明方式有哪些? 聲明變量有 4 種方法:聲明變量有 4 種方法:
使用“var”關(guān)鍵字聲明變量與第一種方法類似。 以這種方式聲明的變量具有全局或函數(shù)作用域,但缺少塊作用域,這是一個缺點。 “l(fā)et”和“const”是聲明變量的更好方法。 它們具有塊作用域,這意味著在函數(shù)內(nèi)部聲明的變量在該函數(shù)外部將不可見。 “const”變量是不可變的,但如果它是一個對象,你可以改變它的屬性,如果它是一個數(shù)組,你可以修改和添加元素。 4. null 和 undefined 有什么區(qū)別? 兩個選項都代表空值。 如果我們初始化一個變量但不給它賦值,它就會被分配一個特殊的標(biāo)記—undefined。Null 是手動分配的。Null 是一個特殊值,表示“無”、“空”或“未知值”。 如果我們需要清除變量的值,我們設(shè)置 foo = null。 5. 箭頭函數(shù)以及與常規(guī)函數(shù)的區(qū)別。
6. 什么是閉包?以及為什么需要它們? 閉包是一個函數(shù)以及它可以訪問的所有外部變量。 例如,有一個具有嵌套函數(shù)的函數(shù),該函數(shù)將關(guān)閉并保留其父級的變量。 7. 什么是模板文字? 模板文字用反引號 (") 括起來,并允許多行字符串。 它們還允許在其中嵌入表達(dá)式。 8. 什么是Set和Map? Map是一個集合,是一種按照鍵值對原理進(jìn)行操作的數(shù)據(jù)結(jié)構(gòu),類似于Object。 然而,Map 和 Object 之間的主要區(qū)別在于 Map 允許使用任何類型的鍵。Set 是一種沒有鍵的集合類型,是一個數(shù)組,其中每個值只能出現(xiàn)一次。 集合在其內(nèi)部存儲唯一的值。 9. 如何檢查對象中是否存在屬性? 第一種方法是使用 hasOwnProperty 函數(shù),該函數(shù)適用于每個對象。第二種方法是使用 in 運算符。 但是,在使用 in 運算符時必須小心,因為它會檢查鏈中的所有原型。 10. 如何訪問對象屬性? 第一種方式是靜態(tài)的,使用點表示法:obj.a。 第二種方式是動態(tài)的,使用方括號:obj[‘a(chǎn)’]。 11. 使用數(shù)組的主要方法有哪些?
12.創(chuàng)建對象的方式有哪些? 使用構(gòu)造函數(shù): 使用對象文字表示法: 使用一個類: 使用創(chuàng)建函數(shù): 13.什么是Promise? Promise 是一個設(shè)計用于處理異步代碼的對象。它維持自己的狀態(tài)。最初,Promise 處于待處理狀態(tài),如果異步代碼執(zhí)行成功,則 Promise 轉(zhuǎn)換為已完成狀態(tài);如果發(fā)生錯誤,則轉(zhuǎn)換為拒絕狀態(tài)。Promise 接受兩個回調(diào)函數(shù):
使用模式如下:
async/await 是一種處理 Promise 的特殊語法。 使用異步語法聲明的函數(shù)始終返回 Promise。 關(guān)鍵字await使JavaScript解釋器等待,直到await右側(cè)的Promise完成后才繼續(xù)執(zhí)行。然后,它將返回結(jié)果,并且代碼將繼續(xù)執(zhí)行。wait 不能在常規(guī)函數(shù)中使用。 15. 如何檢查一個對象是否是數(shù)組? 要檢查對象是否是數(shù)組,可以使用 Array.isArray() 方法。它接受一個對象作為輸入,如果該對象是數(shù)組則返回 true,如果不是數(shù)組則返回 false。 16. 擴(kuò)展運算符 (…) 的目的是什么? 擴(kuò)展運算符 (…) 用于解包數(shù)組或?qū)ο蟆?/span> 它允許你擴(kuò)展可迭代的元素,例如,數(shù)組和字符串。 它用在調(diào)用的預(yù)期參數(shù)數(shù)量為零或更多的函數(shù)中。 它用在數(shù)組文字或表達(dá)式中。 它用在對象文字中,其中鍵值對的數(shù)量應(yīng)為零或更多。 17. 復(fù)制對象時如何避免引用依賴? 如果對象不包含嵌套對象,例如:
在這種情況下,你可以使用展開運算符或 Object.assign() 方法: 如果對象包含嵌套對象: 在這種情況下,你需要執(zhí)行深復(fù)制。 解決方法雖然較慢,但是: 該方法適用于沒有原型和函數(shù)的對象。 或者,你可以使用 lodash 庫的 deepClone() 函數(shù)。 18. 如何改變函數(shù)的上下文? 使用bind()方法,該方法返回一個帶有綁定上下文的新函數(shù)。 使用 call() 和 apply() 方法。主要區(qū)別在于 call() 接受參數(shù)序列,而 apply() 接受參數(shù)數(shù)組作為第二個參數(shù)。 19. 什么是三元運算符/條件運算符? 三元運算符是 if-else 語句的簡寫符號。運算符由問號和冒號表示。它被稱為三元,因為它是唯一接受三個參數(shù)的運算符。 健康)狀況 ?表達(dá)式_1:表達(dá)式_2 20.什么是解構(gòu)? 解構(gòu)是一種允許我們將數(shù)組和對象解包為多個變量的語法。 21.什么是DOM? DOM 代表文檔對象模型。它是將 HTML 文檔表示為標(biāo)簽樹。 例子 DOM 樹中的每個節(jié)點都是一個對象。 HTML 文檔的基本元素是標(biāo)簽。 根據(jù)文檔對象模型 (DOM),每個 HTML 標(biāo)簽都是一個對象。嵌套標(biāo)簽是其父元素的“子元素”。標(biāo)簽內(nèi)的文本也是一個對象。所有這些對象都可以使用 JavaScript 訪問,我們可以使用它們來操作頁面。 22.什么是事件循環(huán)? 事件循環(huán)——一種管理代碼執(zhí)行的機(jī)制。它以正確的順序處理事件處理和任務(wù)執(zhí)行。 事件循環(huán)的主要思想是JavaScript在單線程環(huán)境中運行但可以處理異步操作。當(dāng)異步操作(例如服務(wù)器請求)完成時,它將相應(yīng)的事件放入事件隊列中。 事件循環(huán)以循環(huán)方式工作,按照事件到達(dá)的順序處理這些事件。 它從隊列中獲取一個事件并將其傳遞以供執(zhí)行。如果事件包含回調(diào)或處理程序,則會調(diào)用它,并執(zhí)行與該事件關(guān)聯(lián)的代碼。 事件循環(huán)還處理其他任務(wù),例如計時器和微任務(wù)(Promise)。它管理所有這些任務(wù)的執(zhí)行順序,以確保一致性并防止阻塞代碼執(zhí)行的主線程。 簡而言之,JavaScript 中的事件循環(huán)通過處理隊列中的事件并按正確的順序執(zhí)行相應(yīng)的代碼來管理異步操作。這使得 JavaScript 在處理異步操作時能夠響應(yīng)并有效地利用其資源。 23.什么是原型繼承? JavaScript 中的每個對象都有一個屬性——原型??梢詫⒎椒ê蛯傩蕴砑拥皆椭?。可以根據(jù)原型創(chuàng)建其他對象。創(chuàng)建的對象自動繼承其原型的方法和屬性。如果對象中不存在某個屬性,則將在原型中執(zhí)行其搜索。 24.什么是可選鏈運算符? 可選鏈接運算符 ?。如果 ? 后面的部分停止計算并返回undefined。undefined或為null。 讓我們考慮一個用戶對象。大多數(shù)用戶都有一個地址 user.address 和一個街道 user.address.street,但有些用戶沒有提供地址。在這種情況下,可選鏈接運算符可以幫助我們在嘗試訪問未在地址中指定街道的用戶街道時避免錯誤。 25.什么是 Shadow DOM? Shadow DOM 是一組 Web 標(biāo)準(zhǔn),允許封裝網(wǎng)頁上元素的結(jié)構(gòu)和樣式。它代表 DOM 的一個特殊片段,位于元素內(nèi)部并與頁面的其余部分分開。Shadow DOM 用于創(chuàng)建具有獨立且風(fēng)格化內(nèi)容的組件和小部件,這些內(nèi)容與頁面的整體結(jié)構(gòu)不沖突。 26.什么是遞歸?如何使用它? 遞歸是一種解決問題的方法,其中函數(shù)通過在自己的函數(shù)體內(nèi)重用自身來解決問題。簡單來說,就是函數(shù)調(diào)用自身的時候。 遞歸函數(shù)包括:
基本情況是必要條件;否則,會因函數(shù)調(diào)用無限循環(huán)而導(dǎo)致堆棧溢出。 27. 函數(shù)表達(dá)式和函數(shù)聲明有什么區(qū)別? 函數(shù)聲明是聲明函數(shù)的傳統(tǒng)方式。 函數(shù)表達(dá)式: 通過函數(shù)聲明,可以創(chuàng)建函數(shù)并將其分配給變量,就像任何其他值一樣。本質(zhì)上,函數(shù)如何定義并不重要,因為它是存儲在變量“foo”中的值。 然而,函數(shù)聲明是在執(zhí)行代碼塊之前處理的,這意味著它們在整個代碼塊中都是可見的。另一方面,函數(shù)表達(dá)式僅在執(zhí)行流到達(dá)時才會創(chuàng)建。 28.什么是構(gòu)造函數(shù)? 構(gòu)造函數(shù)是用于創(chuàng)建對象的常規(guī)函數(shù)。但是,使用它們有兩個規(guī)則:
當(dāng)使用 new 運算符創(chuàng)建構(gòu)造函數(shù)時,會發(fā)生以下情況:
29. 如何從對象中獲取鍵列表和值列表? 你可以使用 Object.keys() 獲取鍵列表,使用 Object.values() 獲取值列表。 30. 提供 ES6 中新功能的示例。 最常見的:
31. ES6中如何進(jìn)行類繼承? 類繼承是使用“extends”關(guān)鍵字后跟父類的名稱來完成的。 32. JavaScript 中的微任務(wù)和宏任務(wù)是什么? 在 JavaScript 中,微任務(wù)和宏任務(wù)是指需要在事件循環(huán)中執(zhí)行的任務(wù)類型。 微任務(wù)是在瀏覽器重新繪制頁面之前需要在當(dāng)前事件循環(huán)內(nèi)執(zhí)行的任務(wù)。它們通常使用 Promise.then()、process.nextTick()(在 Node.js 中)或 MutationObserver 等方法添加到執(zhí)行隊列中。 微任務(wù)的示例包括執(zhí)行 Promise 處理程序和 DOM 突變。 另一方面,宏任務(wù)是在當(dāng)前事件循環(huán)完成之后、在屏幕上呈現(xiàn)更改之前需要執(zhí)行的任務(wù)。 這包括使用 setTimeout、setInterval、requestAnimationFrame 添加到事件隊列的任務(wù),以及處理輸入事件和網(wǎng)絡(luò)請求。 宏任務(wù)在當(dāng)前事件循環(huán)中的所有微任務(wù)處理完畢后執(zhí)行。 微任務(wù)和宏任務(wù)之間的區(qū)別很重要,因為它決定了執(zhí)行順序并允許管理 JavaScript 中不同任務(wù)的優(yōu)先級。 微任務(wù)具有更高的優(yōu)先級,并且在宏任務(wù)之前執(zhí)行,這樣可以更快地更新界面并防止阻塞主 JavaScript 執(zhí)行線程。 33.什么是生成器? 生成器根據(jù)需要一個一個地生成一系列值。生成器可以很好地與對象配合使用,并且可以輕松創(chuàng)建數(shù)據(jù)流。 要聲明生成器,需要使用一種特殊的語法——生成器函數(shù)。 next() 是生成器的主要方法。調(diào)用時,next() 開始執(zhí)行代碼,直到最近的yield 語句。該值可能不存在,在這種情況下它表示為未定義。當(dāng)達(dá)到y(tǒng)ield時,函數(shù)執(zhí)行暫停,并將相應(yīng)的值返回給外部代碼。 34.瀏覽器中存儲數(shù)據(jù)的方法有哪些? 在瀏覽器中存儲數(shù)據(jù)有多種方法:
35、sessionStorage和localStorage有什么區(qū)別? SessionStorage 和 localStorage 允許在瀏覽器中以鍵值格式存儲對象。 主要區(qū)別是:
36.什么是正則表達(dá)式? 正則表達(dá)式是由特殊規(guī)則和模式定義的字符串。它們是一個強(qiáng)大的工具,可以檢測和處理字符串中的復(fù)雜結(jié)構(gòu)。 37.WeakSet和WeakMap是什么,它們與Map和Set有何不同? WeakMap 和 Map 之間的第一個區(qū)別是 WeakMap 中的鍵必須是對象,而不是原始值。 第二個區(qū)別在于數(shù)據(jù)結(jié)構(gòu)的內(nèi)存存儲。JavaScript 引擎將值保存在內(nèi)存中,只要它們是可訪問的,這意味著它們可以被使用。 通常,對象屬性、數(shù)組元素或其他數(shù)據(jù)結(jié)構(gòu)被認(rèn)為是可訪問的,并且只要數(shù)據(jù)結(jié)構(gòu)存在,它們就會保留在內(nèi)存中,即使沒有其他對它們的引用。 對于 WeakMap 和 WeakSet 來說,它的工作方式不同。一旦對象變得不可訪問,它將從數(shù)據(jù)結(jié)構(gòu)中刪除。 38. 為什么兩個具有相同字段的對象比較時返回 false? 根據(jù)對內(nèi)存區(qū)域的引用來比較對象。對于 JavaScript,test1 和 test2 對象是不同的,即使它們具有相同的字段。僅當(dāng)對象是同一個對象時,它們才相等。 39. 為什么我們可以調(diào)用原始類型的方法? JavaScript 允許使用原始數(shù)據(jù)類型(字符串、數(shù)字等),就像它們是對象一樣。原始數(shù)據(jù)類型有方法。 為了使此功能可用,每個基本數(shù)據(jù)類型都有自己的包裝對象:字符串、數(shù)字、布爾值和符號。由于這些包裝對象,原始數(shù)據(jù)類型具有不同的方法集,例如 toLowerCase() 或 toUpperCase()。 40. 如何檢查對象是從哪個類創(chuàng)建的? 你可以使用instanceof運算符檢查對象是從哪個類創(chuàng)建的,同時考慮繼承。 41. 編寫代碼,每 10 秒記錄一次在網(wǎng)站上花費的時間(以秒為單位)。 42.什么是純函數(shù)? 純函數(shù)需要滿足以下兩個條件的函數(shù):
43.什么是高階函數(shù)? 高階函數(shù)是接受另一個函數(shù)作為參數(shù)或返回一個函數(shù)作為結(jié)果的函數(shù)。 44. 如果我們可以使用回調(diào)來處理異步代碼,為什么還需要 Promise? 如果我們想使用回調(diào)函數(shù)從服務(wù)器異步獲取一些數(shù)據(jù),則會導(dǎo)致以下結(jié)果: 這稱為回調(diào)地獄,因為每個回調(diào)都嵌套在另一個回調(diào)中,并且每個內(nèi)部回調(diào)都依賴于父函數(shù)。 使用Promises,我們可以重寫上面的代碼: ? 有了Promises,執(zhí)行順序就清晰了,讓代碼更具可讀性。 45. 編寫你自己的bind 方法的實現(xiàn)。 為了實現(xiàn)它,我們可以使用閉包和 apply() 方法將函數(shù)綁定到上下文。 46. 用加、減、乘、除和 get 方法編寫一個計算器函數(shù)。該函數(shù)必須通過可選鏈來工作。 47. 編寫一個 randomSort 函數(shù),該函數(shù)接受一個數(shù)字?jǐn)?shù)組并按隨機(jī)順序?qū)?shù)組進(jìn)行排序。 你可以使用 sort() 方法和 Math.random() 來實現(xiàn)此目的。 48. 編寫一個deleteGreatestValue 函數(shù),該函數(shù)接受一個二維數(shù)字?jǐn)?shù)組,并從每個嵌套數(shù)組中刪除最大的數(shù)字。 我們應(yīng)該迭代每個嵌套數(shù)組,獲取每個嵌套數(shù)組的最大值并將其刪除。 49. 編寫一個 sortPeople 函數(shù),它接受一個字符串名稱數(shù)組和一個數(shù)字高度數(shù)組,其中名稱[i] == heights[i]。它應(yīng)該根據(jù)高度數(shù)組對名稱數(shù)組進(jìn)行排序。 50. 編寫一個subsets 函數(shù),它接受一個數(shù)字?jǐn)?shù)組nums 并返回這些數(shù)字的所有可能的數(shù)組變體。 51.如何反轉(zhuǎn)鏈表? 讓我們創(chuàng)建一個函數(shù)reverseLinkedList,它將鏈表作為輸入并返回該列表的反轉(zhuǎn)版本。 方法:
總之,該函數(shù)通過從頭到尾迭代每個節(jié)點,為每個值創(chuàng)建一個新的列表節(jié)點并相應(yīng)地更新指針來反轉(zhuǎn)鏈表。 52.如何對鏈表進(jìn)行排序? 讓我們創(chuàng)建一個函數(shù) sortList,它將鏈表作為輸入并返回該列表的排序版本。 方法:
53. Observables 和 Promise 之間有什么區(qū)別? Observables 和 Promises 都用于處理 JavaScript 中的異步操作。 一個關(guān)鍵的區(qū)別是 Observables 可以隨著時間的推移發(fā)出多個值。 它們適合處理數(shù)據(jù)流,例如用戶交互、事件或來自 API 的隨時間變化的數(shù)據(jù)。另一方面,承諾只能用單個值解析一次。 它們適合處理要么成功要么失敗的單個異步操作。 總之,Promises 最適合處理具有單個結(jié)果的一次性異步操作,而 Observables 在處理持續(xù)的數(shù)據(jù)流、事件和復(fù)雜的數(shù)據(jù)處理管道時更強(qiáng)大。 它們之間的選擇取決于特定的用例以及你正在處理的異步操作的性質(zhì)。 寫在最后 在準(zhǔn)備這些面試題以及研究所涵蓋的主題并查看相關(guān)資源的時候,相當(dāng)于又把一些知識做了復(fù)習(xí),對于之前沒有記住的內(nèi)容,通過對這些內(nèi)容的掌握,可以提升你的面試成功通過機(jī)率。 最后,感謝你的閱讀,祝編程愉快! 該文章在 2024/10/14 11:18:38 編輯過 |
關(guān)鍵字查詢
相關(guān)文章
正在查詢... |