javascript
原生JS面试题
1. 什么是事件委托？為什么這樣做？
答：它還有一個名字叫事件代理，事件委托就是利用事件冒泡，只指定一個事件處理程序，就可以管理某一類型的所有事件。
為什么這樣做呢？通過事件委托可以減少事件處理程序數量，這樣就能大大的減少與dom的交互次數，提高性能；
2. js數據類型？
答：JS的數據類型有8種。
在ES5的時候，我們認知的數據類型確實是 6種：Number、String、Boolean、undefined、object、Null。
ES6 中新增了一種 Symbol?。這種類型的對象永不相等，即始創建的時候傳入相同的值，可以解決屬性名沖突的問題，做為標記。
谷歌67版本中還出現了一種 bigInt。是指安全存儲、操作大整數。（但是很多人不把這個做為一個類型）。
JS數據類型：Object 中包含了哪幾種類型？其中包含了Date、function、Array等（這三種比較常用）。
3. for in、Object.keys()區別？哪個要用于遍歷原型鏈上的屬性？
答：for-in 是javaScript中最常見的迭代語句，常常用來枚舉對象的屬性。某些情況下，可能按照隨機順序遍歷數組元素；而Object.keys()，可以返回以對象的屬性為元素的數組。數組中屬性名的順序跟使用???????for-in遍歷返回的順序是一樣的。
二者遍歷的數量是不同的，for-in 不單可以枚舉自身屬性，也可以枚舉繼承自原型鏈上的屬性，Object.keys()只可以枚舉自身屬性。
for-in會遍歷原型鏈上的屬性，而Object.keys不會。
4.NaN == NaN 的結果是什么？為什么?
答：NaN == NaN ?的執行結果是 false。因為JavaScript規定，NaN表示的是非數字，但是這個非數字也是不同的，因此 NaN 不等于 NaN，兩個NaN永遠不可能相等。 ?
5.說一下你對Promise的了解？說說你對Promise的原理的理解？
答：Promise 是異步編程的一種解決方案，比傳統的解決方案——回調函數和事件——更合理和更強大。
所謂promise，簡單說就是一個容器，里面保存著某個未來才會結束的事件（通常是一個異步操作）的結果。從語法上說，Promise 是一個對象，從它可以獲取異步操作的消息。
6.?Promise.all()，一個失敗后，其他的還返回嗎？
答：不會返回,promise.all()失敗的時候只返回最先被reject失敗狀態的那個實例對象的值
7.Promise.all()、Promise.race()區別？‘
答：兩者都是可以同時調用多個promise實現，Promise.all可以將多個實例組裝成一個新的實例，成功的時候返回一個成功數組，失敗的時候則返回最先被reject失敗狀態的值；其中有一個實例不成功則返回reject;race()是賽跑的意思，也就是說Promise.race([p1, p2, p3])里面的結果哪個獲取的快，就返回哪個結果，不管結果本身是成功還是失敗
8.Promise有哪些狀態。
答：有三個狀態：pending : 等待 ????fullfilled(resolved) ：成功 ????reject: 失敗
9.簡單說一下async/await的了解？（****）（請參考https://www.jianshu.com/p/fd6933ff6b81）
答：async/await是寫異步代碼的新方式，它是generator的語法糖，以前的方法有回調函數和 Promise。async/await是基于Promise實現的，它不能用于普通的回調函數。async/await與Promise一樣，是非阻塞的。async/await使得異步代碼看起來像同步代碼，這正是它的魔力所在。單一的 Promise 鏈并不能發現 async/await 的優勢，但是，如果需要處理由多個 Promise 組成的 then 鏈的時候，優勢就能體現出來了
10. Async&await和promise有什么區別？（參考https://www.jianshu.com/p/51f5fd21588e）
答：（1）函數前面多了一個async關鍵字。await關鍵字只能用在async定義的函數內。async函數會引式返回一個promise
（2）簡潔：使用async和await明顯節約了不少代碼，不需要.then,不需要寫匿名函數處理promise的resolve的值，不需要定義多余的data變量，還避免了嵌套代碼。
（3）async/await讓try/catch 可以同時處理同步和異步錯誤。try/catch不能處理JSON.parse的錯誤，因為他在promise中。此時需要.catch，這樣的錯誤處理代碼非常冗余。并且，在我們的實際生產代碼會更加復雜
（4）async/await能夠使得代碼調試更簡單
11.有10個任務，使用promise如何同時運行5個任務
答：可以利用Promise.all()方法來同時支行5個任務
12.簡單介紹原型鏈？
答：所有對象都有自己的原型對象（prototype）。一方面，任何一個對象，都可以充當其他對象的原型；另一方面，由于原型對象也是對象，所以它也有自己的原型。因此，就會形成一個“原型鏈”（prototype?chain）最終都可以上溯到Object.prototype Object.prototype對象有沒有它的原型呢？回答Object.prototype的原型是null。null沒有任何屬性和方法，也沒有自己的原型。因此，原型鏈的盡頭就是null。
13.如果后端有3個請求，如何保證順序
答：可以使用Promise鏈式調用，按順序執行;也可以使用async函數和關鍵字await順序執行
14.如果Promise沒有all方法的話，你怎么實現all。
?
15.await后面可以是一個普通的函數嗎？
答：可以，但是其結果會轉化為promise的resolve狀態
16.es6的set、map介紹？
答：set和map都是es6新增的數據結構。其中set是一個類數組結構，值是唯一的，沒有重復的值。map類似于對象，也是鍵值對的集合，但是“鍵”的范圍不限于字符串，各種類型的值（包括對象）都可以當作鍵。也就是說，Object 結構提供了“字符串—值”的對應，Map 結構提供了“值—值”的對應，是一種更完善的 Hash 結構實現。如果你需要“鍵值對”的數據結構，Map 比 Object 更合適。
17.數組去重除了set外，還可以怎么做？
答：
filter()和indexOf()實現去重
reduce()和includes()實現去重
雙重for循環 + splice() 或 雙重for循環 + ?push() ?????(ES5的方法）
18.簡述一下對閉包理解？
答：閉包：在一個外函數中定義了一個內函數，內函數里運用了外函數的臨時變量，并且外函數的返回值是內函數的引用。這樣就構成了一個閉包。一般情況下，在我們認知當中，如果一個函數結束，函數的內部所有東西都會釋放掉，還給內存，局部變量都會消失。但是閉包是一種特殊情況，如果外函數在結束的時候發現有自己的臨時變量將來會在內部函數中用到，就把這個臨時變量綁定給了內部函數，然后自己再結束。經常用閉包來實現面向對象編程
一個函數和它的周圍狀態的引用捆綁在一起的組合
是一個可以讀取其他函數內部變量的函數，在js中只有函數內部的函數才可以讀取該函數內部的變量，因此，閉包可以是一個函數中返回的函數。
閉包的好處：可以讀取其他函數你內部的變量，并將其一直保存在內存中。
壞處：?可能會造成內存泄露或者內存溢出
19.es6相關的知識知道哪些？
答：有很多，如Promise async函數 箭頭函數 Symbol新的基本數據類型，class類等等
20.對箭頭函數的了解，箭頭函數的優缺點？
答：箭頭函數是匿名函數，ES5匿名函數的語法糖，并且沒有自己的this，arguments，super或 new.target。
它的優點是：
（1）簡潔的語法、???
（2）隱士返回，如 下面的代碼可以去掉return,代碼移到一行，減少代碼量numbers.map((number)=>number*2)
（3）解決了this的指向問題，原生的寫法this指向的是調用者，箭頭函數this綁定的是定義時的那個對象。如果有對象嵌套的情況，則this綁定到最近的一層對象上
它的缺點是：
（1）做為構造函數的時候不能使用箭頭函數
（2）真正需要this的時候如給元素綁定click事件的 時候，執行的回調函數不能使用箭頭函數。
（3）我們需要使用arguments對象的時候不能使箭頭函數。箭頭函數中沒有arguments對象。
21.箭頭函數與普通函數的區別？
答：
（1）定義的形式不同。
（2）箭頭函數全都是匿名函數。
（3）普通函數的this指向調用者，箭頭函數的 this 永遠指向其上下文的 this，任何方法都改變不了箭頭函數this指向，如 call() , bind() , apply()
（4）箭頭函數不具有prototype屬性，新建的對象的隱式原型無法被指定為箭頭函數的原型
（5）箭頭函數不能用于構造函數
（6）箭頭函數不能Generator函數
（7）箭頭函數不具有arguments對象
22.const、let、var的區別？?
答：var 聲明的變量屬于函數作用域，let 和 const 聲明的變量屬于塊級作用域；
var 存在變量提升現象，而 let 和 const 沒有此類現象；
var 變量可以重復聲明，而在同一個塊級作用域，let 變量不能重新聲明，const 變量不能修改
Var 不存在暫時性死區，而let const存在暫時性死區
23.get、post區別？
答：?Get 方法通過 URL 請求來傳遞用戶的數據，將表單內各字段名稱與其內容，以成對的字符串連接，置于 action 屬性所指程序的 url 后，數據都會直接顯示在 url 上，就像用戶點擊一個鏈接一樣；Post 方法通過 HTTP post 機制，將表單內各字段名稱與其內容放置在 HTML 表頭(header)內一起傳送給服務器端交由 action 屬性能所指的程序處理，該程序會通過標準輸入(stdin)方式，將表單的數據讀出并加以處理；
Get 方式需要使用 Request，QueryString 來取得變量的值；而 Post 方式通過RequestForm 來訪問提交的內容；
Get 方式傳輸的數據量非常小，一般限制在 2 KB 左右，但是執行效率卻比 Post 方法好；而 Post 方式傳遞的數據量相對較大，它是等待服務器來讀取數據，不過也有字節限制，這是為了避免對服務器用大量數據進行惡意攻擊。建議：除非你肯定你提交的數據可以一次性提交，否則請盡量用 Post 方法；
Get 方式提交數據，會帶來安全問題，比如一個登陸頁面，通過 Get 方式提交數據時，用戶名和密碼將出現在 URL 上，如果頁面可以被緩存或者其他人可以訪問客戶這臺機器，就可以從歷史記錄獲得該用戶的帳號和密碼，所以表單提交建議使用 Post 方法；
get是從服務器上獲取數據，post是向服務器傳送數據。
get方式的安全性較Post方式要差些，包含機密信息的話，建議用Post數據提交方式；
在做數據查詢時，建議用Get方式；而在做數據添加、修改或刪除時，建議用Post方式。
24.axios的原理，基于什么實現的。
答：Axios 是一個基于 promise 的 HTTP 庫，可以用在瀏覽器和 node.js 中。
axios還是屬于 XMLHttpRequest， 因此需要實現一個ajax；還需要一個promise對象來對結果進行處理。
25.Axios二次分裝的目的?
答：二次封裝axios，方便我們后續項目的使用。
api統一管理,不管接口有多少,所有的接口都可以非常清晰,容易維護.通常我們的項目會越做越大,頁面也會越來越多,如果頁面非常的少,直接用axios也沒有什么大的影響,那頁面組件多了起來,上百個接口呢,這個時候后端改了接口,多加了一個參數什么的呢?那就只有找到那個頁面,進去修改.整個過程很繁瑣不易于項目的維護和迭代.
26.說說constructor()？
答：?constructor的作用是可以知道實例對象的構造函數是誰，constructor屬性表示原型對象與構造函數之間的關聯關系，如果修改了原型對象，一般會同時修改constructor屬性，防止引用的時候出錯。
27.class與function定義類的區別？
答：
（5）class定義的類沒有私有方法和私有屬性
28.Session Storage一刷新還有嗎？
答：?刷新頁面session stroage是不會消失的，只有關閉瀏覽器才會消失，如果出現了頁面刷新導致session storag消失的問題，請排查頁面刷新時是否執行了sessionStroage.clear()操作。
29.1+2等于3嗎，在程序里面？
答：?等于，但是0.1+0.2 = 0.30000000000000004。原因是由于JS浮點數存儲機制：
解決方法：自己實現浮點數加法，先轉化可以計算的整數，再相加，最后轉化為小數，精度取一定位數如5
30.發布訂閱怎么實現的？
答：發布---訂閱模式又叫觀察者模式，它定義了對象間的一種一對多的關系，讓多個觀察者對象同時監聽某一個主題對象，當一個對象發生改變時，所有依賴于它的對象都將得到通知。
訂閱者（Subscriber）把自己想訂閱的事件注冊（Subscribe）到調度中心（Event Channel），當發布者（Publisher）發布該事件（Publish Event）到調度中心，也就是該事件觸發時，由調度中心統一調度（Fire Event）訂閱者注冊到調度中心的處理代碼。
31.自己實現發布訂閱者模式 如何實現？
答：
1. 創建一個對象
2. 在該對象上創建一個緩存列表（調度中心）
3. on 方法用來把函數 fn 都加到緩存列表中（訂閱者注冊事件到調度中心）
4. emit 方法取到 arguments 里第一個當做 event，根據 event 值去執行對應緩存列表中的函數（發布者發布事件到調度中心，調度中心處理代碼）
5. off 方法可以根據 event 值取消訂閱（取消訂閱）
6. once 方法只監聽一次，調用完畢后刪除緩存函數（訂閱一次）
32.如何移除訂閱發布者模式
答：實現一個off方法根據event值取消訂閱，從訂閱列表中移除即可。
33.如果用本機存儲的方式實現定時任務過期？
答：本題的核心是考查的是如何實現localstorage本地定時緩存？方案：ES5擴展Storage，思路很簡單，存儲的值加一個時間戳，下次取值時驗證時間戳；注意：?localStorage只能存儲字符，存入時將對象轉為json字符串,讀取時也要解析
34.暫時性死區的報錯是什么樣的，為什么會有暫時性死區，Var為什么沒有暫時性死區？
答：
if(true){console.log(tmp); let tmp = 90;}如上代碼會出現暫時性死區報錯，報措信息“Uncaught ReferenceError: Cannot access 'tmp' before initialization at <anonymous>:3:7”
出現暫時性死區的原因：let/const 命令會使區塊形成封閉的作用域。若在聲明之前使用變量，就會報錯。總之，在代碼塊內，使用 let 命令聲明變量之前，該變量都是不可用的。這在語法上，稱為 “暫時性死區”（ temporal dead zone，簡稱 TDZ）。
Var 具有聲明提升的特性，所以在使用前調用該變量值為undefined,并不會出現暫時性死區現象
35.數組里面常用的方法
答：
1. push ??向數組的末尾添加一項或多項元素
2. pop ????刪除數組的最后一項
3. shift ???刪除數組的首項
4. unshift ?向數組的開頭添加一或多項
5. splice ?增刪改
6. slice ???截取數組(復制數組)
7. join ?????用指定的分隔符將數組每一項拼接為字符串
8. concat ?用于連接兩個或多個數組
9. sort ??對數組的元素進行排序
10. reverse ?倒序數組
36.forEach和map循環區別
答：最大的區別是forEach沒有返回值，map有返回值，可以return;
37.影響js性能的操作
答：
38.談談對深淺拷貝的理解，怎么實現深淺拷貝的？
答：淺拷貝只復制指向某個對象的指針，而不復制對象本身，新舊對象還是共享同一塊內存。但深拷貝會另外創造一個一模一樣的對象，新對象跟原對象不共享內存，修改新對象不會改到原對象。
淺拷貝的實現方式：
（1）Object.assign()
深拷貝的實現方式：
（2）手寫遞歸方法：遞歸方法實現深度克隆原理：遍歷對象、數組直到里邊都是基本數據類型，然后再去復制，就是深度拷貝（源碼可參考：https://www.cnblogs.com/secretAngel/p/10188716.html）
39.類數組有用過嗎，什么情況下用，怎么轉化成真正數組
?答：有用過，比如document.getElementsByTagName()的返回值就是一個類數組，比如函數中的arguments對象也是一個類數組。 ?
常用的類數組轉數組的方法有3種:
40.談談this指向。
答：this是函數運行時自動生成的一個內部對象，只能在函數內部使用，但總指向調用它的對象。它的指向由調用它的對象來決定，如：
?????1.在全局中this指向window ?
?????2.直接調用函數this指向window
?????3.事件處理函數中this指向綁定事件的元素
?????4.obj.fn(); ?fn函數中this指向obj
?????5.回調函數中this指向window
?????6.構造函數中this指向實例化對象 ???
41.js里哪些操作會造成內存泄漏
答：（1）在函數中定義全局變量（2）閉包。閉包可以維持函數內局部變量，使其得不到釋放。（3）刪除元素卻沒有清除DOM元素引用（4）被遺忘的定時器或者回調（5）子元素存在引用引起的內存泄漏
42.js里什么是垃圾回收機制
答：找出不再使用的變量，然后釋放掉其占用的內存，但是這個過程不是實時的，因為其開銷比較大，所以垃圾回收系統（GC）會按照固定的時間間隔,周期性的執行。
兩種方法:1.標記清除 ??2.引用計數
43.js延遲加載都有哪些方式
答：JS延遲加載，也就是等頁面加載完成之后再加載 JavaScript 文件。
44.js緩存的三種方法及區別與特點
答：H5本地存儲：sessionStorage：臨時的會話存儲，只要當前的會話窗口未關閉，存儲的信息就不會丟失，即便刷新了頁面或者在編輯器中更改了代碼，存儲的會話信息也不會丟失。localStorage是一種永久存儲，會一直將數據存儲在客戶端的儲存方式，即使關閉了瀏覽器，下次打開的時候仍然可以看到之前存儲的未主動清除的數據（即便是殺毒軟件或者瀏覽器自帶的清除功能，也不能將localStorage存儲的數據清除掉）
Cookie：Cookie是存儲在用戶計算機上的小文件，保存特定客戶端和網站的適量數據，并可以由Web服務器或客戶端瀏覽器訪問，允許服務器提供針對特定用戶定制的頁面，或者頁面本身可以包含一些知道cookie中的數據的腳本。
cookie和H5本地存儲的區別
1.cookie兼容所有的瀏覽器（本地cookie谷歌不支持），storage不支持IE6~8;
2.二者對存儲的內容均有大小限制，前者同源情況寫一般不能存儲4kb的內容，后者同源一般能存儲只能存儲5MB的數據
3.cookie有過期時間，localStorage是永久存儲（如果你不手動去刪除的話）
4.一些瀏覽器處于安全的角度可能會禁用cookie,但無法禁用localStorage
45.cookie有什么弊端
答：cookie兼容所有的瀏覽器，但其存儲的數據是有大小限制的，一般同源是4kb；cookie本地存儲的數據會被發送到服務器（所以建議在服務器環境下使用cookie）；存在跨域訪問問題；浪費帶寬等等；
46.怎么阻止冒泡和瀏覽器默認事件
答：標準瀏覽器: ?阻止冒泡e.stopPropagation() 阻止默認事件e.preventDefault()
????ie瀏覽器: ?阻止冒泡e.cancleBubble=true?阻止默認事件e.returnValue = fasle;
47.什么是面向對象編程，三個屬性是什么
答：面向對象編程是一種編程開發思想。?它將真實世界各種復雜的關系，抽象為一個個對象，然后由對象之間的分工與合作，完成對真實世界的模擬。，每一個對象都是功能中心，具有明確分工，可以完成接受信息、處理數據、發出信息等任務。?因此，面向對象編程具有靈活、代碼可復用、高度模塊化等特點，容易維護和開發，比起由一系列函數或指令組成的傳統的過程式編程（procedural programming），更適合多人合作的大型軟件項目。
三個屬性:封裝、繼承、多態
48.前端調試bug都有哪些方法
答：
49.Js里面的事件循環
答：答案參考https://www.jianshu.com/p/184988903562來學習
50.怎么實現圖片懶加載（答案參考：https://www.jianshu.com/p/6d3e38728c10）
答：定義：當打開一個有很多圖片的頁面時，先只加載頁面上看到的圖片，等滾動到頁面下面時，再加載所需的圖片。這就是圖片懶加載。
作用：減少或延遲請求數，緩解瀏覽器的壓力，增強用戶體驗
實現方式：
設置圖片src屬性為同一張圖片，同時自定義一個data-src屬性來存儲圖片的真實地址
頁面初始化顯示的時候或者瀏覽器發生滾動的時候判斷圖片是否在視野中
當圖片在視野中時，通過js自動改變該區域的圖片的src屬性為真實地址
51.數組里面的排序有哪些方法，怎么用
插入排序：
52.多維數組怎么拍平，扁平，怎么去實現這個方法呢！
答：方法1：ES6的方法數組.flat();
方法2：ES5的方法
53.數組元素的求和，除了循環還有沒有更好的方式
答:不考慮算法復雜度，用遞歸做
函數式編程 map-reduce：
forEach遍歷：
eval
54.假如有一個很長的數字，怎么給他做千分位的格式化分元呢！ （數字從右往左每三位一個逗號）
答:正則匹配
的下標,但是foreach循環中的i表示的是數組的key是string類型,因為js中一切皆為對象。強烈要求不要用for in 遍歷數組.
55.什么是塊作用域，什么是函數作用域？
答:塊作用域:ES5中沒有塊作用域；ES6的塊級作用域,任何一對花括號中的語句集都屬于一個塊，在這之中定義的所有變量在代碼塊外都是不可見的，我們稱之為塊級作用域
函數作用域:函數作用域是針對局部變量來說的，在函數中定義的變量在函數外不能獲取
56.我聲明了一個構造函數，調用的時候 ?我寫new 和沒有寫new有什么區別？
答:任何函數，如果不通過 new 操作符來調用，就是直接執行函數體。
如果使用 new調用，則不單執行函數，還會返回個實例對象。以這種方式調用構造函數實際上會經歷以下4個步驟：
(1) 創建一個新對象；
(2) 將構造函數的作用域賦給新對象（因此 this 就指向了這個新對象）；
(3) 執行構造函數中的代碼（為這個新對象添加屬性）；
(4) 返回新對象。
57.通過ES5的方法怎么把類數組轉成真正的數組？
答:方法1：遍歷類數組，將類數組里面的元素依次放入一個新的數組
方法2：使用 apply 和 call，apply方法的第二個參數是數組，也可以是類數組，在調用的時候會將第二個參數依次展開
58.簡單說一下事件冒泡
答:IE 的事件流叫做事件冒泡（event bubbling），即事件開始時由最具體的元素（文檔中嵌套層次最深
的那個節點）接收，然后逐級向上傳播到較為不具體的節點（文檔）。事件沿 DOM 樹向上傳播，在每一級節點上都會發生，直至傳播到 document 對象。
所有現代瀏覽器都支持事件冒泡，但在具體實現上還是有一些差別。IE5.5 及更早版本中的事件冒泡會跳過<html>元素（從<body>直接跳到 document）。IE9、Firefox、Chrome 和 Safari 則將事件一直冒泡到 window 對象。
59.普通函數和箭頭函數的this指向的區別
答：普通函數this指向由調用決定，this指向調用該函數的對象，而箭頭函數this指向由定義時決定，this指定父級作用域的this
60.new一個關鍵字做了哪些事情
答：使用 new 操作符。以這種方式調用構造函數實際上會經歷以下4個步驟：
(1) 創建一個新對象；
(2) 將構造函數的作用域賦給新對象（因此 this 就指向了這個新對象）；
(3) 執行構造函數中的代碼（為這個新對象添加屬性）；
(4) 返回新對象。
61.有一串手機號，我想把中間的四位替換成****，我要用什么方法實現？
答：利用正則表達式：
var tel = 15617076160;
tel = "" + tel;
var reg=/(\d{3})\d{4}(\d{4})/;
var newTel = tel.replace(reg, "$1****$2")；
console.log(newTel);//156****6160
62.我現在有一個數組，數組里面是對象，我要給對象里面的每一項添加一個a:1我要怎么去做呢？
答：
63.循環的方法有哪些，每個循環有哪些特點呢？
答：1.for循環：特點是先判斷后執行，當條件成立才會執行，適用于循環次數已知的循環；2.while循環：特點也是先判斷后執行，當條件成立才會執行，適用于循環次數未知的循環；3.do...while循環：特點是先執行后判斷，先執行一遍循環體，再判斷條件是否成立，成立則繼續循環，不成立則結束循環。
64.Async函數用法和promise區別
答：簡單的說async函數就相當于自執行的Generator函數，相當于自帶一個狀態機，在await的部分等待返回， 返回后自動執行下一步。而且相較于Promise,async的優越性就是把每次異步返回的結果從then中拿到最外層的方法中，不需要鏈式調用，只要用同步的寫法就可以了。更加直觀而且，更適合處理并發調用的問題。但是async必須以一個Promise對象開始 ，所以async通常是和Promise結合使用的。總的來說，async函數主要就是為了解決異步的并發調用使用的 ，直接將參數從then里取出來，相比promise的鏈式調用，傳參更加方便，異步順序更加清晰。
65.Async和promise如何捕捉錯誤信息
答: async可以使用try...catch語句；promise可以使用實例方法catch捕獲異常
66.Extends繼承和js5核心區別？
答：這道題面試官考查的是你對Es5與ES6繼承的理解，它倆的區別主要集中在以下幾點：
（1）ES5的繼承實質上是先創建子類的實例對象，然后再將父類的方法添加到this上（Parent.apply(this)）.
(2)ES6的繼承機制完全不同，實質上是先創建父類的實例對象this（所以必須先調用父類的super()方法），然后再用子類的構造函數修改this。
(3)ES5的繼承時通過原型或構造函數機制來實現。
(4)ES6通過class關鍵字定義類，里面有構造方法，類之間通過extends關鍵字實現繼承。子類必須在constructor方法中調用super方法，否則新建實例報錯。因為子類沒有自己的this對象，而是繼承了父類的this對象，然后對其進行加工。如果不調用super方法，子類得不到this對象。
67.Js中如何處理同步和異步的
答：同步的話代碼依次執行，異步的處理方式有：（1）回調函數 （2）promise ?(3)Generator ?(4)Async/await (5)定時器函數 （6）ajax等
68.call?bind?apply?的區別
答：（1）bind不會立刻執行，會返回綁定this之后的函數，call和apply會立即執行（2）三者都可以傳參，但是apply是數組，而call和bind傳過去的是一系列參數
69.javascript原型和原型鏈
答：原型：每一個javascript對象(除null外)創建的時候，都有一個__proto__屬性指向與之關聯另一個對象，這個對象就是我們所說的原型，每一個對象都會從原型中“繼承”屬性。讓我們用一張圖表示構造函數和實例及原型之間的關系：
原型鏈：每個構造函數都有原型對象，每個構造函數實例都包含一個指向原型對象的內部指針（proto），如果我們讓第一個構造函數的原型對象等于第二個構造函數的實例，結果第一個構造函數的原型對象將包含一個指向第二個原型對象的指針，再然第三個原型對象等于第一個構造函數的實例，這樣第三個原型對象也將包含指向第一個原型對象的指針，以此類推，就夠成了實例于原型的鏈條，這就是原型鏈的基本概念。
70.說說你對spa單頁面應用的理解
SPA（ single-page application ）僅在 Web 頁面初始化時加載相應的 HTML、JavaScript 和 CSS。一旦頁面加載完成，SPA 不會因為用戶的操作而進行頁面的重新加載或跳轉；取而代之的是利用路由機制實現 HTML 內容的變換，UI 與用戶的交互，避免頁面的重新加載。
優點：
? 用戶體驗好、快，內容的改變不需要重新加載整個頁面，避免了不必要的跳轉和重復渲染；
? 基于上面一點，SPA 相對對服務器壓力小；
? 前后端職責分離，架構清晰，前端進行交互邏輯，后端負責數據處理；
缺點：
? 初次加載耗時多：為實現單頁 Web 應用功能及顯示效果，需要在加載頁面的時候將 JavaScript、CSS 統一加載，部分頁面按需加載；
? 前進后退路由管理：由于單頁應用在一個頁面中顯示所有的內容，所以不能使用瀏覽器的前進后退功能，所有的頁面切換需要自己建立堆棧管理；
? SEO 難度較大：由于所有的內容都在一個頁面中動態替換顯示，所以在 SEO 上其有著天然的弱勢。
71.如何是一個對象可迭代
?
總結
- 上一篇： fcitx重启 linux_fcitx无
- 下一篇： 原生JS 面试题 （基础）（概率大）