上下左右居中顯示 css
div{
position:absolute;
top:50%;
left:50%
height: 200px;
width:200px;
margin-top:-100px;
margin-left:-100px;
}
margin 實現 必須設置width height
div2{
position:absolute;
top:0;
left:0;right:0;
bottom:0;
margin:auto;
width:200px;
height:200px;
}
清楚浮動
.clear{ clear：both}
父級設置height
父級 overflow：hidden zoom:1
數組去重 遍歷數組 indexOf判斷是否存在
let arr = [1, 2, 3, 4, 5, 6, 7, 3, 4, 5, 6, 1, 2, 3, 4], activeArr = []
arr.map((res, index)=> {
if (activeArr.indexOf(res) === -1) {
activeArr.push(res)
}
})
三個盒子，左右定寬，中間自適應 使用flex佈局
<style>
.son{
width: 100%;
position:relative;
display: flex;
justify-content: space-between;
height: 50px;
}
.son>div{
margin:0 10px;
background: red;
width: 200px;
}
.dd2{
flex:1
}
</style>
<div class="son">
<div class="dd1"></div>
<div class="dd2"></div>
<div class="dd3"></div>
</div>
數據類型
字符串（String）、數字(Number)、布爾(Boolean)、對空（Null）、未定義（Undefined）、Symbol。
引用數據類型：對象(Object)、數組(Array)、函數(Function)。
注：Symbol 是 ES6 引入了一種新的原始數據類型，表示獨一無二的值。
undefined和null 區別
undefined是未定義 不存在的
null 是空值 已定義 typeof得到的是object
javaScript權威指南： null 和 undefined 都表示“值的空缺”，你可以認爲undefined是表示系統級的、出乎意料的或類似錯誤的值的空缺，而null是表示程序級的、正常的或在意料之中的值的空缺。
http 和 https 有何區別
http是HTTP協議運行在TCP之上。所有傳輸的內容都是明文，客戶端和服務器端都無法驗證對方的身份。
https是HTTP運行在SSL/TLS之上，SSL/TLS運行在TCP之上。所有傳輸的內容都經過加密，加密採用對稱加密，但對稱加密的密鑰用服務器方的證書進行了非對稱加密。此外客戶端可以驗證服務器端的身份，如果配置了客戶端驗證，服務器方也可以驗證客戶端的身份。
常見的HTTP狀態碼
2開頭 （請求成功）表示成功處理了請求的狀態代碼。
200 （成功） 服務器已成功處理了請求。 通常，這表示服務器提供了請求的網頁。
201 （已創建） 請求成功並且服務器創建了新的資源。
202 （已接受） 服務器已接受請求，但尚未處理。
203 （非授權信息） 服務器已成功處理了請求，但返回的信息可能來自另一來源。
204 （無內容） 服務器成功處理了請求，但沒有返回任何內容。
3開頭 （請求被重定向）表示要完成請求，需要進一步操作。 通常，這些狀態代碼用來重定向。
300 （多種選擇） 針對請求，服務器可執行多種操作。 服務器可根據請求者 (user agent) 選擇一項操作，或提供操作列表供請求者選擇。
301 （永久移動） 請求的網頁已永久移動到新位置。 服務器返回此響應（對 GET 或 HEAD 請求的響應）時，會自動將請求者轉到新位置。
302 （臨時移動） 服務器目前從不同位置的網頁響應請求，但請求者應繼續使用原有位置來進行以後的請求。
4開頭 （請求錯誤）這些狀態代碼表示請求可能出錯，妨礙了服務器的處理。
400 （錯誤請求） 服務器不理解請求的語法。
401 （未授權） 請求要求身份驗證。 對於需要登錄的網頁，服務器可能返回此響應。
403 （禁止） 服務器拒絕請求。
404 （未找到） 服務器找不到請求的網頁。
405 （方法禁用） 禁用請求中指定的方法。
406 （不接受） 無法使用請求的內容特性響應請求的網頁。
407 （需要代理授權） 此狀態代碼與 401（未授權）類似，但指定請求者應當授權使用代理。
408 （請求超時） 服務器等候請求時發生超時。
409 （衝突） 服務器在完成請求時發生衝突。 服務器必須在響應中包含有關衝突的信息。
410 （已刪除） 如果請求的資源已永久刪除，服務器就會返回此響應。
411 （需要有效長度） 服務器不接受不含有效內容長度標頭字段的請求。
412 （未滿足前提條件） 服務器未滿足請求者在請求中設置的其中一個前提條件。
413 （請求實體過大） 服務器無法處理請求，因爲請求實體過大，超出服務器的處理能力。
414 （請求的 URI 過長） 請求的 URI（通常爲網址）過長，服務器無法處理。
415 （不支持的媒體類型） 請求的格式不受請求頁面的支持。
416 （請求範圍不符合要求） 如果頁面無法提供請求的範圍，則服務器會返回此狀態代碼。
5開頭（服務器錯誤）這些狀態代碼表示服務器在嘗試處理請求時發生內部錯誤。 這些錯誤可能是服務器本身的錯誤，而不是請求出錯。
500 （服務器內部錯誤） 服務器遇到錯誤，無法完成請求。
501 （尚未實施） 服務器不具備完成請求的功能。 例如，服務器無法識別請求方法時可能會返回此代碼。
502 （錯誤網關） 服務器作爲網關或代理，從上游服務器收到無效響應。
503 （服務不可用） 服務器目前無法使用（由於超載或停機維護）。 通常，這只是暫時狀態。
504 （網關超時） 服務器作爲網關或代理，但是沒有及時從上游服務器收到請求。
505 （HTTP 版本不受支持） 服務器不支持請求中所用的 HTTP 協議版本。
mvvm mvc
MVC（Model-View-Controller）
MVC是比較直觀的架構模式，用戶操作->View（負責接收用戶的輸入操作）->Controller（業務邏輯處理）->Model（數據持久化）->View（將結果反饋給View）。
MVVM（Model-View-ViewModel）
將“數據模型數據雙向綁定”的思想作爲核心 View和Model之間沒有聯繫，通過ViewModel進行交互，而且Model和ViewModel之間的交互是雙向的，因此視圖的數據的變化會同時修改數據源，而數據源數據的變化也會立即反應view
px em rem的區別 chrome最小字體爲12px
px 像素 絕對單位 不會其他元素的尺寸變化而變化
em 根據父元素的字體大小的變化而變化 相對單位
rem 根據根元素的字體大小的變化而變化 相對單位
eval() 字符串計算函數
console.log(eval('2+2')) 4
console.log(eval('x=2;y=3;x+y')) 5
let num = 9
console.log(eval('num+1')) 10
JS事件冒泡與JS事件代理
事件冒泡 點擊子元素觸發父元素事件 逐級往上
阻止事件冒泡 ：
w3c的方法是e.stopPropagation()，IE則是使用e.cancelBubble = true
vue 使用 @click.stop 小程序 bindtap 改成 catchtap
事件委託 將子元素的事件通過冒泡交給父元素執行
CSS樣式覆蓋規則
內聯演示 style 權級最大 1000
id 100
class 10
標籤 1
繼承樣式和自身樣式 會顯示自身樣式
!important的樣式屬性不被覆蓋 爲特殊
box-sizing -moz-box-sizing
盒子組成： 內容 內邊距 外邊距 邊框
box-sizing：border-box 設置盒子固定width height 不受padding影響width
閉包 作用域
閉包
白話文 函數內包有函數 內部函數使用外部函數變量
閉包就是一個函數，捕獲作用域內的外部綁定。這些綁定是爲之後使用而被綁定，即使作用域已經銷燬
閉包的官方定義爲：一個擁有許多變量和綁定了這些變量的環境的表達式（通常是一個函數），因而這些變量也是該表達式的一部分
自由變量與閉包的關係是，自由變量閉合於閉包的創建
閉包有三個特性：
函數嵌套函數
函數內部可以引用外部的參數和變量
參數和變量不會被垃圾回收機制回收
作用域
白話文 函數調用外部變量
在內部函數可以訪問外部函數變量的這種機制，用鏈式查找決定哪些數據能被內部函數訪問
函數的執行依賴於變量作用域，這個作用域是在函數定義時決定的，而不是函數調用時決定的。
瀏覽器的內核分別是什麼?
IE: trident內核
Firefox：gecko內核
Safari：webkit內核
Opera：以前是presto內核，Opera現已改用Google Chrome的Blink內核
Chrome：Blink(基於webkit，Google與Opera Software共同開發)
sessionStorage 、localStorage 和 cookie 之間的區別
sessionStorage 本地存儲 頁面關閉數據及清除 數據可存5M 不同窗口不可共享
localStorage 本地存儲 如不主動清除 則一直存在 數據可存5M 窗口可共享
Cookie 數據會發送到服務器端 可設置過期時間 數據不能超過4K, 窗口可共享
函數防抖和函數節流？
函數防抖是指頻繁觸發的情況下，只有足夠的空閒時間，才執行代碼一次
函數防抖的要點，也是要一個setTImeout來輔助實現。延遲執行需要跑的代碼
如果方法多次觸發，則要把上次記錄的延遲執行代碼用clearTimeout清掉，重新開始
如果計時完畢，沒有方法進來訪問觸發，則執行代碼
clearTimeout(timer);
let timer = setTimeout(function(){
console.log('0')
}, 400);
javascript中的this 指向
全局代碼中的this是指向全局對象
作爲對象的方法調用時指向調用這個函數的對象
作爲構造函數指向創建的對象