想要升職加薪的都關注我了~
（關注福利，關注本公眾號根據提示回覆領取優質前端視訊，包括Vue、React視訊實戰、面試指導...）
宣告：此文乾的不行，備好紙巾以防乾哭
目錄：
對async、await的理解，內部原理 ？
介紹下Promise，內部實現
從輸入URL到頁面載入全過程經歷了什麼？
bind、call、apply的區別
介紹下原型鏈（解決的是繼承問題嗎）
對跨域的瞭解
前端怎麼做單元測試
前端效能優化
至於框架面試題相關請繼續關注本公眾號
接下來會一個一個完美解答 ↓ ↓ ↓
對async、await的理解，內部原理 ？
首先先從字面意思來理解。async 是“非同步”的簡寫，而 await 可以認為是 async wait 的簡寫。所以應該很好理解 async 用於申明一個 function 是非同步的，而 await 用於等待一個非同步方法執行完成。
async 和 async 是ES7新增的規範，兩個規範可以看成一隊連體嬰，他們要一起出現才有效果：
async 會將其後的函式（函式表示式或 Lambda）的返回值封裝成一個 Promise 物件，而 await 會等待這個 Promise 完成，並將其 resolve 的結果返回出來。
也就是說，只有當 async 函式內部的非同步操作都執行完，才會執行 then 方法的回撥。
注意：Async 函式的錯誤處理
當 async 函式中只要一個 await 出現 reject 狀態，則後面的 await 都不會被執行。
解決辦法：可以新增 try/catch。
介紹下Promise，實現原理
既然說到promise首先我們們先來瞭解一下他的核心概念：
Promise 概括來說是對非同步的執行結果的描述物件。（這句話的理解很重要）
promise 的狀態只有3種：pending fulfilled rejected分別為等待、執行成功和執行失敗狀態。
為什麼要使用它？
利用 Promise 可以讓非同步程式設計更符合人的直覺，讓程式碼邏輯更加清晰，把開發人員從回撥地獄中釋放出來。
實現
Promise物件是一個建構函式，用來生成Promise例項。通過在函式內部return 一個 Promise物件的例項，這樣就可以使用Promise的屬性和方法進行下一步操作了。
列子
從輸入URL到頁面載入全過程經歷了什麼
1. DNS 解析
2. TCP 連線
3. HTTP 請求丟擲
4. 服務端處理請求，HTTP 響應返回
5. 瀏覽器拿到響應資料，解析響應內容，把解析的結果展示給使用者
擴充套件（向面試官要分數
）
對於前端來說想優化的話可以做的事情非常有限。
HTTP 優化有兩個大的方向：
減少請求次數
減少單次請求所花費的時間
bind、call、apply的區別
call()、apply()、bind() 都是用來重定義 this 這個物件的
它們的區別主要是在於方法的實現形式和引數傳遞上的不同
①：函式.call(物件,arg1,arg2....)
②：函式.apply(物件，[arg1,arg2,...])
③：var ss=函式.bind(物件,arg1,arg2,....)
介紹下原型鏈（解決的是繼承問題嗎）
通俗易懂的說明：
小明媽也是由小明媽的媽媽生的，通過小明媽找到小明媽的媽媽，再通過小明媽的媽媽找到媽媽……，這個關係叫做原型鏈。
一張圖帶你秒懂
對跨域的瞭解
跨域，指的是瀏覽器不能執行其他網站的指令碼。它是由瀏覽器的同源策略造成的，是瀏覽器對JavaScript施加的安全限制。
所謂的同源，指的是域名、協議、埠均相等。
http://www.abc.com/a/b 呼叫 http://www.abc.com/d/c（非跨域）
http://www.abc.com/a/b 呼叫 http://www.def.com/d/c （跨域：域名不一致）
http://www.abc.com:81/a/b 呼叫 http://www.abc.com:82/d/c （跨域：埠不一致）
http://www.abc.com/a/b 呼叫 https://www.abc.com/d/c （跨域：協議不同）
解決跨域問題，有如下三種方式：
1、使用jsonp
2、伺服器代理
3、在服務端設定response header中Access-Control-Allow-Origin欄位。
綜上三種解決跨域的方案，個人感覺使用服務代理最好，沒有破壞瀏覽器的安全策略，但這個對開發環境要高一點。設定response header的方式，根據具體情況分析，要考慮清楚產品面向的使用者。對於jsonp這種方式，雖然沒有破壞瀏覽器的安全策略，但只支援get方式的請求，有點不能接受，因為get傳輸有引數長度的限制，同時又要考慮傳輸中文的亂碼問題，但如果專案中只是簡單的查詢、展示，這種方式還是可以考慮的。
前端單元測試
什麼是單元測試？
每個單元測試就是一段用於測試一個模組或介面是否能達到預期結果的程式碼。開發人員需要使用程式碼來定義一個可用的衡量標準，並且可以快速檢驗。
為什麼要單元測試？
單元測試應該是一個框架、標準，經常被形容被腳手架，像建築一樣，腳手架的高度至少應該和大樓高度不相上下，甚至一開始就搭好腳手架。
怎麼做這裡不做過多描述 詳情訪問：https://blog.csdn.net/Frank_YLL/article/details/79058616
前端效能優化
先來張nb的圖（此乃阿里前端大神修言親作
）
一）內容層面
1、DNS解析優化（DNS快取、減少DNS查詢、keep-alive、適當的主機域名）
2、避免重定向（/還是需要的）
3、切分到多個域名
4、杜絕404
二）網路傳輸階段
1、減少傳輸過程中實體的大小
1）快取
2）cookie優化
3）檔案壓縮（Accept-Encoding：g-zip）
2、減少請求的次數
1）檔案適當的合併
2）雪碧圖
3、非同步載入（併發,requirejs）
4、預載入、延後載入、按需載入
三）渲染階段
1、js放底部，css放頂部
2、減少重繪和迴流
3、合理使用Viewport 等meta頭部
4、減少dom節點
5、BigPipe
四）指令碼執行階段
1、快取節點，儘量減少節點的查詢
2、減少節點的操作（innerHTML）
3、避免無謂的迴圈，break、continue、return的適當使用
4、事件委託
交流
本人Github連結如下，歡迎各位Star
https://github.com/Xingen123
長按掃碼關注我
乾貨都給你