本文資料來源於
https：//github。com/qiu-deqing/FE-interview
目前已在github獲得4700個star，在前端知識專案中名列第一。
上兩篇主要分享了該專案中的HTML， HTTP，web綜合問題， CSS部分。
本文主要分享該專案中的javascript概念部分的知識點及面試題部分，後續分享剩餘3個章節。
目錄
DOM元素e的e。getAttribute（propName）和e。propName有什麼區別和聯絡
offsetWidth/offsetHeight，clientWidth/clientHeight與scrollWidth/scrollHeight的區別
XMLHttpRequest通用屬性和方法
focus/blur與focusin/focusout的區別與聯絡
mouseover/mouseout與mouseenter/mouseleave的區別與聯絡
sessionStorage，localStorage，cookie區別
javascript跨域通訊
javascript有哪幾種資料型別
什麼閉包，閉包有什麼用
javascript有哪幾種方法定義函式
應用程式儲存和離線web應用
客戶端儲存localStorage和sessionStorage
cookie及其操作
javascript有哪些方法定義物件
===運算子判斷相等的流程是怎樣的
==運算子判斷相等的流程是怎樣的
物件到字串的轉換步驟
物件到數字的轉換步驟
<，>，<=，>=的比較規則
+運算子工作流程
函式內部arguments變數有哪些特性，有哪些屬性，如何將它轉換為陣列
DOM事件模型是如何的，編寫一個EventUtil工具類實現事件管理相容
評價一下三種方法實現繼承的優缺點，並改進
歡迎關注筆者，優質文章都在這裡等你。
DOM元素e的e。getAttribute（propName）和e。propName有什麼區別和聯絡
e。getAttribute（），是標準DOM操作文件元素屬性的方法，具有通用性可在任意文件上使用，返回元素在原始檔中設定的屬性
e。propName通常是在HTML文件中訪問特定元素的特性，瀏覽器解析元素後生成對應物件（如a標籤生成HTMLAnchorElement），這些物件的特性會根據特定規則結合屬性設定得到，對於沒有對應特性的屬性，只能使用getAttribute進行訪問
e。getAttribute（）返回值是原始檔中設定的值，型別是字串或者null（有的實現返回“”）
e。propName返回值可能是字串、布林值、物件、undefined等
大部分attribute與property是一一對應關係，修改其中一個會影響另一個，如id，title等屬性
一些布林屬性的檢測設定需要hasAttribute和removeAttribute來完成，或者設定對應property
像link中href屬性，轉換成property的時候需要透過轉換得到完整URL
一些attribute和property不是一一對應如：form控制元件中對應的是defaultValue，修改或設定value property修改的是控制元件當前值，setAttribute修改value屬性不會改變value property
offsetWidth/offsetHeight，clientWidth/clientHeight與scrollWidth/scrollHeight的區別
offsetWidth/offsetHeight返回值包含content + padding + border，效果與e。getBoundingClientRect（）相同
clientWidth/clientHeight返回值只包含content + padding，如果有捲軸，也不包含捲軸
scrollWidth/scrollHeight返回值包含content + padding + 溢位內容的尺寸
Measuring Element Dimension and Location with CSSOM in Windows Internet Explorer 9
XMLHttpRequest通用屬性和方法
readyState：表示請求狀態的整數，取值：
UNSENT（0）：物件已建立
OPENED（1）：open（）成功呼叫，在這個狀態下，可以為xhr設定請求頭，或者使用send（）傳送請求
HEADERS_RECEIVED（2）：所有重定向已經自動完成訪問，並且最終響應的HTTP頭已經收到
LOADING（3）：響應體正在接收
DONE（4）：資料傳輸完成或者傳輸產生錯誤
onreadystatechange：readyState改變時呼叫的函式
status：伺服器返回的HTTP狀態碼（如，200， 404）
statusText：伺服器返回的HTTP狀態資訊（如，OK，No Content）
responseText：作為字串形式的來自伺服器的完整響應
responseXML： Document物件，表示伺服器的響應解析成的XML文件
abort（）：取消非同步HTTP請求
getAllResponseHeaders（）： 返回一個字串，包含響應中伺服器傳送的全部HTTP報頭。每個報頭都是一個用冒號分隔開的名/值對，並且使用一個回車/換行來分隔報頭行
getResponseHeader（headerName）：返回headName對應的報頭值
open（method， url， asynchronous ［， user， password］）：初始化準備傳送到伺服器上的請求。method是HTTP方法，不區分大小寫；url是請求傳送的相對或絕對URL；asynchronous表示請求是否非同步；user和password提供身份驗證
setRequestHeader（name， value）：設定HTTP報頭
send（body）：對伺服器請求進行初始化。引數body包含請求的主體部分，對於POST請求為鍵值對字串；對於GET請求，為null
focus/blur與focusin/focusout的區別與聯絡
focus/blur不冒泡，focusin/focusout冒泡
focus/blur相容性好，focusin/focusout在除FireFox外的瀏覽器下都保持良好相容性，如需使用事件託管，可考慮在FireFox下使用事件捕獲elem。addEventListener（‘focus’， handler， true）
可獲得焦點的元素：
window
連結被點選或鍵盤操作
表單空間被點選或鍵盤操作
設定tabindex屬性的元素被點選或鍵盤操作
mouseover/mouseout與mouseenter/mouseleave的區別與聯絡
mouseover/mouseout是標準事件，所有瀏覽器都支援；mouseenter/mouseleave是IE5。5引入的特有事件後來被DOM3標準採納，現代標準瀏覽器也支援
mouseover/mouseout是冒泡事件；mouseenter/mouseleave不冒泡。需要為多個元素監聽滑鼠移入/出事件時，推薦mouseover/mouseout託管，提高效能
標準事件模型中event。target表示發生移入/出的元素，vent。relatedTarget對應移出/如元素；在老IE中event。srcElement表示發生移入/出的元素，event。toElement表示移出的目標元素，event。fromElement表示移入時的來源元素
例子：滑鼠從div#target元素移出時進行處理，判斷邏輯如下：
sessionStorage，localStorage，cookie區別
都會在瀏覽器端儲存，有大小限制，同源限制
cookie會在請求時傳送到伺服器，作為會話標識，伺服器可修改cookie；web storage不會發送到伺服器
cookie有path概念，子路徑可以訪問父路徑cookie，父路徑不能訪問子路徑cookie
有效期：cookie在設定的有效期內有效，預設為瀏覽器關閉；sessionStorage在視窗關閉前有效，localStorage長期有效，直到使用者刪除
共享：sessionStorage不能共享，localStorage在同源文件之間共享，cookie在同源且符合path規則的文件之間共享
localStorage的修改會促發其他文件視窗的update事件
cookie有secure屬性要求HTTPS傳輸
瀏覽器不能儲存超過300個cookie，單個伺服器不能超過20個，每個cookie不能超過4k。web storage大小支援能達到5M
javascript跨域通訊
同源：兩個文件同源需滿足
協議相同
域名相同
埠相同
跨域通訊：js進行DOM操作、通訊時如果目標與當前視窗不滿足同源條件，瀏覽器為了安全會阻止跨域操作。跨域通訊通常有以下方法
如果是log之類的簡單單項通訊，新建，
