2020年，註定是不平凡的一年，受疫情影響，好多想跳槽的夥伴，一直按耐者，這次面試題總結，就是我的朋友，最近再面試中總結出來的，整理一下希望可以幫助到你們。（ps:後期也會不定期更新總結新的面試題）
1.什麼是閉包，閉包有什麼作用？
- 閉包就是能夠讀取其他函數內部的變量的函數，本質上就是將函數內部和函數外部連接起來的一座橋樑
- 用途：1：可以讀取函數內部的變量2：可以讓這些變量始終保存在內存中
- 最簡單的列子 for中添加延時器 打印下標：（會一直打印最後一個下標）
- 解決方案就是通過閉包把變量i給存起來 詳情看這https://blog.csdn.net/qq_46124502/article/details/106353007
2.es6新特性（es6語法糖）
- Let和const，兩者都是塊級作用域，let聲明的變量，const聲明的常量
- const 生明的不可被修改 let 不可以聲明前置 var 可以
- 箭頭函數，不需要function關鍵字來創建函數，繼承上下文的this
- 函數的參數默認值
- 解構賦值，（這裏具體的實現可以自行去了解下）從數組和對象中提取值，給變量賦值
- For of遍歷數組 for in遍歷對象中的屬性
3、Es6規範：
- 建議不使用var，使用let和const，優先使用const
- Var定義的變量可以修改，如果不初始化會輸出undefined
- Let是塊級作用域，在函數內部使用let定義，對函數外部沒影響
- Const定義的變量不可修改，而且必須初始化
- 優先使用解構賦值
- 使用import取代report
- 靜態字符一律使用單引號或反引號，不建議使用雙引號
3、h5新特性
- 語義化標籤-footer
- 增強型表單-input多個type
- 新增表單元素out put
- 新增表單屬性-placehoder min max
- 音頻、視頻
- Canvas和svg
- 地理定位
- Websocket
4、css3新特性
- 選擇器
- 背景和邊框
- 文本效果
- 動畫和過渡
- 多列布局
5、w3c標準
- 是一系類標準的集合，結構標準html，表現標準css，動作標準javascrip，除此之外還有xml，dom標準。例如：所有標籤都使用小寫，同一頁面同一id會衝突
6、響應式佈局和自適應佈局
- 響應式佈局“meta viewport”核心是媒體查詢來設置樣式media queries
- 自適應佈局：自動識別屏幕寬度，rem，百分比
- 彈性佈局（flex）：（https://blog.csdn.net/qq_46124502/article/details/106518826）
7、js繼承原理
- 如果繼承父類的屬性和方法用call和apply (詳情：https://blog.csdn.net/qq_46124502/article/details/106670773)
- 如果繼承父類原型直接將子類prototype指向父類prototype(詳情：https://blog.csdn.net/qq_46124502/article/details/106708371)
8、cookie，sessionstorage和localstorage的區別
- Cookie存儲大小4kb，請求時會先發送到服務器，然後回傳給瀏覽器，可以在同源頁面中共享
- sessionStorage和localStorage不會自動把數據發送給服務器，僅在本地保存。
- cookie：只在設置的cookie過期時間之前有效，即使窗口關閉或瀏覽器關閉
- sessionStorage：僅在當前瀏覽器窗口關閉之前有效；（存儲大小再5MB）
- localStorage：始終有效，窗口或瀏覽器關閉也一直保存，本地存儲，因此用作持久數據；（存儲大小再5MB）
- sessionStorage：不在不同的瀏覽器窗口中共享，即使是同一個頁面
- localstorage和Cookie：在所有同源窗口中都是共享的；也就是說只要瀏覽器不關閉，數據仍然存在
9、ajax請求原理
- Ajax的原理簡單來說通過XmlHttpRequest對象來向服務器發送異步請求，從服務器獲得數據，
- 然後用javascript來操作DOM而更新頁面（XMLHttpRequest是ajax的核心機制）
- 簡單的說，也就是JavaScript可以及時的向服務器提出請求並及時響應。而不阻塞用戶。達到無刷新效果。由事件觸發，創建一個XMLHttpRequest對象，把HTTP方法 （POST/GET）和目標URL以及請求返回後的回調函數設置到XMLHttpRequest對象，通過XMLHttpRequest向服務器發送請求，請求發送後繼續響應用戶的界面交互，只有等到請求真正從服務器返回的時候才調用callback()函數，對響應數據進行處理。
- 補充：Ajax的工作原理相當於在用戶和服務器之間加了—箇中間層(AJAX引擎)，使用戶操作與服務器響應異步化。並不是所有的用戶請求都提交給服務器
10、同源策略
- 由於瀏覽器同源策略的限制，同一域名，同一協議，同一端口號，有一個不滿足請求就會發生跨域問題
- Jsonp可以突破同源策略的限制實現跨域
- Jsonp執行過程：先在客戶端註冊一個callback，然後把callback的名字傳給服務器，然後服務器返回數據會將這個callback參數作爲函數名來包裹json數據這樣客戶端就可以隨意定製自己的函數來自動處理返回的數據了（當然最簡單的跨域解決方案就是後臺操作 ，允許你進行跨域請求）
11，如何實現下拉刷新上拉加載
- 下拉刷新：監聽touchstart事件，記錄初始值的值
監聽touchmove事件，記錄計算當前滑動的值和初始值的距離，大於0表示向下拉動，並藉助CSS3的translateY屬性使元素跟隨手勢向下滑動對應的差值，並設置一個最大距離
監聽touchend事件，此時滑到最大值，觸發callback，同時將距離設置爲0，元素回到初始狀態
當滑動距離大於0時，提示正在下拉刷新，當滑到最大距離並鬆手時，執行回調函數，提示正在更新操作DropDownRefresh.vue- 上拉加載：獲取當前滾動條的scrolltop值、當前可視範圍的高度、文檔的總高度，當滾動條和可視範圍的高度大於文檔總高度的時候，觸發callback（考慮函數節流）PullUpReload.vue
12、移動端組件庫有哪些
- Mint-UI
- vant
13、什麼是vuex，爲什麼要使用vuex，vuex的屬性
- Vuex是vue的狀態管理管理系統
當我們遇到多個組件共享狀態的時候，多層組件的傳值非繁瑣，不利於維護，因此我們把組件的共享狀態抽取出來，以一個單例模式進行管理，在這種模式下，不管在哪個組件都可以獲取狀態或觸發行爲
屬性：state==》基本數據；getters==》從基本數據派生的數據；mutations==》提交更改數據的方法actions==》像一個裝飾器，包裹着mutations，使之可以異步；modules==》模塊化vuex
14、vuex在頁面刷新的時候會有什麼問題？
- Vuex在頁面刷新後state數據會初始化（由於刷新後組件重新創建，生命週期重新執行）
- Vuex中的數據保存在運行內存中，一旦刷新，運行內存的數據釋放
- 解決方法：在頁面刷新前將vuex的數據先保存至sessionStorage（以防請求數據量過大頁面加載時拿不到返回的數據）
15、什麼是websocket，在哪些地方使用？
- Upgrade: websocket Connection: Upgrade是核心(Websocket是一個持久化的協議)
服務端就可以主動推送信息給客戶端，因爲ajax輪詢的原理非常簡單，讓瀏覽器隔個幾秒就發送一次請求，詢問服務器是否有新信息。是非常消耗資源，ajax輪詢 需要服務器有很快的處理速度和資源。long poll 需要有很高的併發，也就是說同時接待客戶的能力。
16、vue雙向數據綁定原理及實現
- 實現mvvm的雙向綁定，採用數據劫持結合發佈者-訂閱者模式的方式，通過Object.defineProperty()來劫持各個屬性的setter和getter(也就是說數據和視圖同步，數據發生變化，視圖跟着變化，視圖變化，數據也隨之發生改變；)
18、es6新增的數據類型
- Symbol保證每個屬性的名字都是獨一無二的
- Set對象裏面只要有重複的值就會只保留一個
- Map可以允許任何類型作爲對象的鍵，彌補了object只能使用字符串作爲鍵的問題
19、塊元素和行內元素有什麼區別？
- 塊元素可以設置寬高，並且設置的寬度獨佔一行
- 塊元素：div，h1-6，img，hr，form
- 行內元素：a，br，input，em，span
- display：block設爲塊級元素
20、盒模型有幾種，以及區別
- 標準盒模型：設置的width或height是對實際內容（content）的width或height進行設置，內容周圍的border和padding另外設置，即盒子模型的width（height）=設置的content的寬高+padding+border+margin
- 怪異盒模型: 設置的width或height是對實際內容（content）+內邊距（padding）+邊框（border）之和的width和height進行設置的，其盒模型的width（height）=設置的width（height）+外邊距margin.
解決兩者的兼容：可嘗試對父元素使用內邊距，對子元素使用外邊距
21、定位
- 相對定位：相對於自己原來的位置定位
- 絕對定位的參照物是相對於該元素最近的已定位的祖先元素，如果沒有一個祖先元素設置定位，那麼 參照物是body。
- 固定定位:相對於整個文檔
22、js的基礎數據類型
- js中有5種數據類型:Undefined、Null、Boolean、Number和String。
23、對數組遍歷的幾種方式
- Foreach，map，for of （詳細看這https://blog.csdn.net/qq_46124502/article/details/106438128）
23、vue插槽
- 插槽就是Vue實現的一套內容分發的API，將元素作爲承載分發內容的出口。（沒有插槽的情況下在組件標籤內寫一些內容是不起任何作用的，當我在組件中聲明瞭slot元素後，在組件元素內寫的內容就會跑到它這裏了）具名插槽，就是給這個插槽起個名字
24、vue實現頁面跳轉的幾種方式
- Router-link，this.router.go（1）
25、小程序開發與vue開發有什麼區別
- 小程序開發路由放在app.json文件中，能在裏面定義每一個路由，定義之後，可以自動創建wxss，js，wxml三個文件
Vue需要先創建組建之後，再在router.js裏面引入這個路由
微信小程序生命週期更多
（還有就是數據渲染類，條件判斷。賦值啊。需要自己大致的去看一下）
暫時就那麼多，後期會繼續分享，如果哪有不對的地方，歡迎評論指導/