注：某大佬這本收費小冊干貨很多，有些參考其中的問題，就不列答案了。

寫在前面的話

因為一些特殊原因在家待了很久，博客和github都很久沒有更新了。
這段時間，代碼寫的比較少，但是看了不少書。
因為博主不是科班出身，在家的幾個月把科班的一些書籍都學(xué)習(xí)了一遍，比如《數(shù)據(jù)結(jié)構(gòu)》，《計算機組成》，《計算機網(wǎng)絡(luò)》，《操作系統(tǒng)》，下次有機會，可以把看一些書籍和前端的一些結(jié)合來講，
現(xiàn)在主要是待業(yè)在家，準備出去找工作，因為疫情原因，先對當前的知識做個整理。
這些整理，只針對于自身的一些問題。
也有自己覺得一些重要，以及一些感悟的地方。

針對自己的查漏補缺

一、html部分

常見行內(nèi)元素標簽：a、br、code、em、img、input...
常見塊級元素標簽：div、p、dl、dt、form、h1~h6...

新特性

• 用于繪畫的 canvas 元素

• 用于媒介回放的 video 和 audio 元素

• 對本地離線存儲的更好的支持

• 新的特殊內(nèi)容元素，比如 article、footer、header、nav、section

• 新的表單控件，比如 calendar、date、time、email、url、search

知識欠缺點

• HTML 5 拖放

• HTML 5 Canvas

• TML5 內(nèi)聯(lián) SVG

• HTML 5 應(yīng)用程序緩存

• HTML 5 Web Workers

• HTML 5 服務(wù)器發(fā)送事件

自己認為重要的一些部分

• HTML5 Input 類型

• HTML5 表單元素

• HTML5 表單屬性

1、HTML5 表單屬性，這個感覺很重要

新的 form 屬性：

- autocomplete
- novalidate

新的 form 屬性：

- autocomplete
- autofocus
- form
- form overrides (formaction, formenctype, formmethod, formnovalidate, formtarget)
- height 和 width
- list
- min, max 和 step
- multiple
- pattern (regexp)
- placeholder
- required

HTML 事件屬性（重要）
想了想，這部分還單獨列出來好了，因為在日常開發(fā)中，使用到的概率也比較高

Form 事件（重要）

此外還有

• Keyboard 事件

• Mouse 事件（這塊也用的比較多，篇幅原因就不展開列舉了，可以自行查看些html5的教程）

• Media 事件

還有一個比較重要的部分就是video/audio的事件的屬性使用了

使用原生寫的時候，做類似的h5活動頁，就很有必要參考這塊了。

小結(jié)：

隨著幾大框架的使用，html5中很多屬性的直接應(yīng)用會變的越來越少，被各種封裝，之前公司做的活動頁
也大都是用vue或者react框架下去制作，然后掛在一個路由下面。
可能在傳統(tǒng)公司的使用還是很多，像一些互聯(lián)網(wǎng)公司面試，問這方面的面試題都很少了。
撐死了就隨便問些新特性啊，行塊元素啊，媒體，緩存之類的。

二、css部分

1、盒模型（這個面試10次會問到8次）

box-sizing: content-box(默認)----指的是標準模型（本身內(nèi)容寬高度+邊框和內(nèi)邊距）

box-sizing: border-sizing-----指的是IE模型（本身內(nèi)容的寬高度）

2、flex布局（記得有次面試平安的時候，問的很細，也比較重要）

3、css選擇器
因為比較基礎(chǔ)，好像問的比較少了，最早的時候還是會問些后代選擇器和子選擇器之類的。

4、display的值（這個經(jīng)常問?。。。?/p>

5、清浮動（*）

6、posiiton的值：（和display一樣，也經(jīng)常問，這樣基礎(chǔ)的應(yīng)該都要掌握）

7、CSS3新特性

• 過渡

• 動畫

• 形狀轉(zhuǎn)換

• 選擇器

• 陰影

• 文字陰影: text-shadow: 2px 2px 2px #000;(水平陰影，垂直陰影，模糊距離，陰影顏色)

• 盒子陰影: box-shadow: 10px 10px 5px #999

• 邊框

• 背景

• 文字

• 漸變

• 彈性布局、柵格布局、多列布局

• 媒體查詢

8、Sass、Less、Stylus區(qū)別
感覺這個問題的即使回答不完全，好像也不是很重要，只要用過其中一種預(yù)處理預(yù)言，面試官都覺不會在這個問題上糾結(jié)太久

9、字體
之所以單獨列出來，是因為我們很多圖標都開始采用字體的形式，例如阿里字體。

注：自身欠缺的知識點

• 動畫（太多的業(yè)務(wù)代碼，導(dǎo)致對動畫效果的要求不斷的降低）

• 陰影

• 漸變

• 背景（背景用的好的話，真的會有妙用，可惜自身掌握的也不太好。）

小結(jié)：

css一直都重要，特別是布局排版，還有一些兼容部分。
不管哪次面試，css都是必不可少的環(huán)節(jié)
熟練掌握基本的css，在日常的開發(fā)會少很多坑
比如還有什么1像素的問題之類的，都是要在不斷的采坑中，慢慢成長的。
隨著css3特性的不斷強大，能夠代替js做不少動畫，好好使用，也會有不錯的效果。
面試之前，應(yīng)該也要好好把整個css部分，再過一遍

三、js部分

1、js基本數(shù)據(jù)類型（面試問的概率超高，應(yīng)該算是基礎(chǔ)吧）

undefined、number、string、null、boolean+object ES6新增Symbol

2、var、let、const 三者的區(qū)別什么？

var 存在變量提升，而 let、const 則不會。
var 的全局聲明的變量會掛載到 window 上，而其他兩者不會。
let 和 const 的作用基本一致，后者聲明的變量不能再次賦值

注：有面試官會問你const的聲明對象常量，能不能更改對象中的值，建議自己去實現(xiàn)下。。。

2、原生ajax（以前問的很多，現(xiàn)在框架增多，很多都是請求庫，這個反而問的不怎么多了）

如何創(chuàng)建Ajax
XMLHttpRequest對象的工作流程
==========兼容性寫法===========
var xmlHttp = null;
if(window.XMLHttpRequset) {
    // IE7+,Firefox,Chrome,Safari,Opera
    xmlHttp = new XMLHttpRequset();
}
else {
    // IE5,IE6
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP")
}
兼容性處理
事件的觸發(fā)條件
xmlHttp.onreadystatechange = function() {
    if(xmlHttp.readyState == 4 && xmlHttp.status == 200) {
        responseText、responseXML
    }
}
事件的觸發(fā)順序
======================注意=================
如果是POST請求則需要添加頭
xmlHttp.setRequestHeader("Content-type": "application/x-www-form-urlencoded")

3、深拷貝，淺拷貝（很常見）

4、Promise的理解和實現(xiàn)（如果現(xiàn)場要求手寫一個promise比較難，我也只能說說思路，這點也比較欠缺誒）

5、繞不開的閉包問題（問的概率一半一半）

6、原型鏈

7、map, filter, reduce的作用和區(qū)別

8、微任務(wù)和宏任務(wù)（有次面試網(wǎng)易的時候，有問到，這塊要掌握好了，對Event Loop的了解會有很大的收獲）

小結(jié)：

js這部分向來都是問的最多的這塊，隨著es6的普及，很多次面試都會問es6的東西了。當然es5本身也是
需要掌握的更加扎實。
而且后續(xù)的使用vue，react等框架，也離不開js的支撐，所以js是務(wù)必最需要重視的一塊

總結(jié)

對html部分和css的部分掌握的還算良好，js卻很長時間，因為業(yè)務(wù)代碼的關(guān)系，后期一直沒有得到良好
的發(fā)展，也沒有形成自己的知識體系。
因為篇幅有限，這期就先寫這么多，后續(xù)的話，應(yīng)該是更新
工程化，HTTP，vue，react，幾個框架，
再往后，也有可能對小程序呀，app之類的，對自身的情況做個總結(jié)。