1甩骏、什么是w3c標(biāo)準(zhǔn)福青，談?wù)剬?duì)w3c的理解指厌？
? ?如果從WEB技術(shù)角度箕憾，可以分為三個(gè)方面的標(biāo)準(zhǔn)：結(jié)構(gòu)炬藤、表現(xiàn)羹膳、行為壳炎。結(jié)構(gòu)主要指(X)HTML標(biāo)準(zhǔn)涕滋，包括各種標(biāo)簽的名字增拥、屬性、語義及其他相關(guān)標(biāo)準(zhǔn)磷箕。表現(xiàn)主要指CSS家厌，包括各種定位、顏色钳榨、大小等方面的標(biāo)準(zhǔn)瘟滨。行為主要指Javascript，其實(shí)主要由ECMA國際制定的標(biāo)準(zhǔn)矩欠，但由于在萬維網(wǎng)上廣泛應(yīng)用美侦，開發(fā)人員也要關(guān)注。Javascript的詞法眼五、表達(dá)式棚唆、語句等方面也有一系列的標(biāo)準(zhǔn)挺益。 Javascript沒有像Java JDK那樣的現(xiàn)成二進(jìn)制文件，只有文檔標(biāo)準(zhǔn)，具體的實(shí)現(xiàn)交給了各瀏覽器姐呐，所以在開發(fā)過程中笑陈，各瀏覽器的兼容性問題會(huì)是一個(gè)問題涵妥，我們?cè)谔幚淼臅r(shí)候可以遵循鴨式辨型原則去處理墩新。
2盔憨、Doctype作用是什么社证？嚴(yán)格模式與混雜模式如何區(qū)分猴仑？有何差異？
? ?<!DOCTYPE>聲明叫做文件類型定義（DTD）肥哎，聲明的作用為了告訴瀏覽器該文件的類型。讓瀏覽器解析器知道應(yīng)該用哪個(gè)規(guī)范來解析文檔疾渣。<!DOCTYPE>聲明必須在 HTML 文檔的第一行篡诽，這并不是一個(gè) HTML 標(biāo)簽。
? ?嚴(yán)格模式：又稱標(biāo)準(zhǔn)模式榴捡，是指瀏覽器按照 W3C 標(biāo)準(zhǔn)解析代碼杈女。
? ?混雜模式：又稱怪異模式或兼容模式，是指瀏覽器用自己的方式解析代碼吊圾。
? ?如何區(qū)分：瀏覽器解析時(shí)到底使用嚴(yán)格模式還是混雜模式达椰，與網(wǎng)頁中的 DTD 直接相關(guān)。
? ?1项乒、如果文檔包含嚴(yán)格的 DOCTYPE 啰劲，那么它一般以嚴(yán)格模式呈現(xiàn)。（嚴(yán)格 DTD ——嚴(yán)格模式）?
? ?2檀何、包含過渡 DTD 和 URI 的 DOCTYPE 蝇裤，也以嚴(yán)格模式呈現(xiàn)廷支，但有過渡 DTD 而沒有 URI （統(tǒng)一資源標(biāo)識(shí)符，就是聲明最后的地址）會(huì)導(dǎo)致 頁面以混雜模式呈現(xiàn)栓辜。（有 URI 的過渡 DTD ——嚴(yán)格模式恋拍；沒有 URI 的過渡 DTD ——混雜模式）?
? ?3、DOCTYPE 不存在或形式不正確會(huì)導(dǎo)致文檔以混雜模式呈現(xiàn)藕甩。（DTD不存在或者格式不正確——混雜模式）
? ?4施敢、HTML5 沒有 DTD ，因此也就沒有嚴(yán)格模式與混雜模式的區(qū)別狭莱，HTML5 有相對(duì)寬松的語法僵娃，實(shí)現(xiàn)時(shí)，已經(jīng)盡可能大的實(shí)現(xiàn)了向后兼容贩毕。（ HTML5 沒有嚴(yán)格和混雜之分）
? ?意義：嚴(yán)格模式與混雜模式存在的意義與其來源密切相關(guān)悯许，如果說只存在嚴(yán)格模式，那么許多舊網(wǎng)站必然受到影響辉阶，如果只存在混雜模式先壕，那么會(huì)回到當(dāng)時(shí)瀏覽器大戰(zhàn)時(shí)的混亂，每個(gè)瀏覽器都有自己的解析模式谆甜。
? 嚴(yán)格模式與混雜模式的語句解析不同點(diǎn)有哪些垃僚？
? ?1）盒模型的高寬包含內(nèi)邊距padding和邊框border
在W3C標(biāo)準(zhǔn)中，如果設(shè)置一個(gè)元素的寬度和高度规辱，指的是元素內(nèi)容的寬度和高度谆棺，而在IE5.5及以下的瀏覽器及其他版本的Quirks模式下，IE的寬度和高度還包含了padding和border罕袋。
2）可以設(shè)置行內(nèi)元素的高寬
??? 在Standards模式下改淑，給span等行內(nèi)元素設(shè)置wdith和height都不會(huì)生效，而在quirks模式下浴讯，則會(huì)生效朵夏。
3）可設(shè)置百分比的高度
??? 在standards模式下，一個(gè)元素的高度是由其包含的內(nèi)容來決定的榆纽，如果父元素沒有設(shè)置高度仰猖，子元素設(shè)置一個(gè)百分比的高度是無效的。
4）用margin:0 auto設(shè)置水平居中在IE下會(huì)失效
??? 使用margin:0 auto在standards模式下可以使元素水平居中奈籽，但在quirks模式下卻會(huì)失效,quirk模式下的解決辦法饥侵，用text-align屬性:
???body{text-align:center};#content{text-align:left}
5）quirk模式下設(shè)置圖片的padding會(huì)失效
6）quirk模式下Table中的字體屬性不能繼承上層的設(shè)置
7）quirk模式下white-space:pre會(huì)失效
來源：Doctype作用？嚴(yán)格模式與混雜模式如何區(qū)分衣屏？它們有何差異躏升？
3、display：none和display：visibility的區(qū)別狼忱？
display：none和display：visibility都會(huì)隱藏某個(gè)元素煮甥，但是display：none隱藏的元素不會(huì)占據(jù)任何空間盗温，從頁面上消失，而display：visibility隱藏的元素仍想未隱藏的元素一樣占據(jù)頁面的空間成肘。也就是說該元素被隱藏了卖局，蛋仍會(huì)影響頁面布局。
4双霍、css選擇器有哪些砚偶？那些css屬性可以繼承？
1洒闸、id選擇器：#myid{background:black}
2染坯、類選擇器：.classname{}
3、標(biāo)簽選擇器： div{}
4丘逸、通配選擇器： *{}
5单鹿、相鄰選擇器：h1+div{}
6、子代選擇器：h1>div{}
7深纲、后代選擇器：h1 div{}
8仲锄、屬性選擇器：a[attr=value]{}
9、偽類選擇器：a:hover{}
可以被繼承的屬性有：
字體相關(guān)：line-height,?font-family, font-size, font-style, font-variant, font-weight, font
文本相關(guān)： letter-spacing, text-align, text-indent, text-transform, word-spacing
列表相關(guān)：list-style-image, ?list-style-position, list-style-type, list-style
5湃鹊、解釋一下wiondow.onload和onDocumentReady和區(qū)別儒喊？
window.onload在頁面所有元素（包括圖片、引入的文件）夾子啊完成后執(zhí)行币呵，onDocument在html DOM和css DOM 加載后（部分圖片可能沒有加載完成）就可執(zhí)行怀愧；
window.onload只能執(zhí)行一次，如果定義多次余赢，后者將覆蓋前者芯义，onDocument可定義多次，并且都能運(yùn)行妻柒；
6扛拨、解釋一下css盒模型？
所有HTML元素可以看作盒子蛤奢，在CSS中，"box model"這一術(shù)語是用來設(shè)計(jì)和布局時(shí)使用陶贼。
CSS盒模型本質(zhì)上是一個(gè)盒子啤贩，封裝周圍的HTML元素，它包括：邊距拜秧，邊框痹屹，填充，和實(shí)際內(nèi)容枉氮。
盒模型允許我們?cè)谄渌睾椭車剡吙蛑g的空間放置元素志衍。
下面的圖片說明了盒子模型(Box Model)：
不同部分的說明：
Margin(外邊距)?- 清除邊框外的區(qū)域暖庄，外邊距是透明的。
Border(邊框)?- 圍繞在內(nèi)邊距和內(nèi)容外的邊框楼肪。
Padding(內(nèi)邊距)?- 清除內(nèi)容周圍的區(qū)域培廓，內(nèi)邊距是透明的。
Content(內(nèi)容)?- 盒子的內(nèi)容春叫，顯示文本和圖像肩钠。
為了正確設(shè)置元素在所有瀏覽器中的寬度和高度，你需要知道的盒模型是如何工作的暂殖。
最終元素的總寬度計(jì)算公式是這樣的：
總元素的寬度=寬度+左填充+右填充+左邊框+右邊框+左邊距+右邊距
元素的總高度最終計(jì)算公式是這樣的：
總元素的高度=高度+頂部填充+底部填充+上邊框+下邊框+上邊距+下邊距
參考:：菜鳥教程--css盒模型
7价匠、http請(qǐng)求方式GET、POST呛每、PUSH和DELETE的區(qū)別踩窖？
? ? get請(qǐng)求：從服務(wù)端獲取數(shù)據(jù)
? ? 特點(diǎn)：使用GET方法時(shí)，查詢字符串（鍵值對(duì)）被附加在URL地址后面一起發(fā)送到服務(wù)器： sevice/getValue&name1=value1
? ??????GET請(qǐng)求能夠被緩存
????????GET請(qǐng)求會(huì)保存在瀏覽器的瀏覽記錄中
????????以GET請(qǐng)求的URL能夠保存為瀏覽器書簽
????????GET請(qǐng)求有長度限制
????????GET請(qǐng)求主要用以獲取數(shù)據(jù)
? ? post請(qǐng)求：提交數(shù)據(jù)給服務(wù)端處理晨横，并返回響應(yīng)?
? ? ? ?特點(diǎn)： 使用POST方法時(shí)洋腮，查詢字符串在http請(qǐng)求頭中單獨(dú)存在
? ??????POST請(qǐng)求不能被緩存下來
????????POST請(qǐng)求不會(huì)保存在瀏覽器瀏覽記錄中
????????以POST請(qǐng)求的URL無法保存為瀏覽器書簽
????????POST請(qǐng)求沒有長度限制
8、history和hash兩種模式的區(qū)別颓遏？
9徐矩、javaScript中的數(shù)據(jù)類型有哪些？
Null 叁幢、Undefined滤灯、Boolean、String曼玩、Number鳞骤、Array、 Object黍判、Symbol
10豫尽、javaScript中join（）和split（）方法的區(qū)別？
? ? join() : 把數(shù)組的所有元素放入一個(gè)字符串顷帖。元素通過指定的分隔符進(jìn)行分隔美旧。
? ??split（）:?把字符串分割為字符串?dāng)?shù)組。
11贬墩、清除浮動(dòng)的方法榴嗅？為什么要清除浮動(dòng)？什么原因?qū)е碌模?/h1>
12陶舞、什么是html5 本地存儲(chǔ)嗽测？
13、你能解釋一下漸進(jìn)增強(qiáng)和優(yōu)雅降級(jí)和不同嗎肿孵？
漸進(jìn)增強(qiáng)（progressive enhancement）：針對(duì)低版本瀏覽器進(jìn)行構(gòu)建頁面唠粥，保證最基本的功能疏魏，然后再針對(duì)高級(jí)瀏覽器進(jìn)行效果、交互等改進(jìn)和追加功能達(dá)到更好的用戶體驗(yàn)晤愧。（從被所有瀏覽器支持的基本功能開始大莫，逐步地添加那些只有新式瀏覽器才支持的功能，向頁面添加無害于基礎(chǔ)瀏覽器的額外樣式和功能养涮。當(dāng)瀏覽器支持時(shí)葵硕，它們會(huì)自動(dòng)地呈現(xiàn)出來并發(fā)揮作用。）
優(yōu)雅降級(jí)（graceful degradation）：一開始就構(gòu)建完整的功能贯吓，然后再針對(duì)低版本瀏覽器進(jìn)行兼容懈凹。（Web站點(diǎn)在所有新式瀏覽器中都能正常工作，如果用戶使用的是老式瀏覽器悄谐，則代碼會(huì)檢查以確認(rèn)它們是否能正常工作介评。由于IE獨(dú)特的盒模型布局問題，針對(duì)不同版本的IE的hack實(shí)踐過優(yōu)雅降級(jí)了爬舰，為那些無法支持功能的瀏覽器增加候選方案们陆，使之在舊式瀏覽器上以某種形式降級(jí)體驗(yàn)卻不至于完全失效。）
區(qū)別：優(yōu)雅降級(jí)是從復(fù)雜的現(xiàn)狀開始情屹，并試圖減少用戶體驗(yàn)的供給坪仇，而漸進(jìn)增強(qiáng)則是從一個(gè)非常基礎(chǔ)的垃你、能夠起作用的版本開始椅文，并不斷擴(kuò)充，以適應(yīng)未來環(huán)境的需要惜颇。
參考文章：你能描述一下漸進(jìn)增強(qiáng)和優(yōu)雅降級(jí)之間的不同嗎?
14皆刺、javaScript中typeof（）方法都會(huì)返回哪些結(jié)果？
15凌摄、談?wù)勀銓?duì)javaScript中this指向的理解羡蛾？
16、如何理解JavaScript中的閉包锨亏？
17痴怨、如果處理AJAX請(qǐng)求返回的JSON數(shù)據(jù)？
18器予、網(wǎng)站前端性能優(yōu)化的方法有哪幾種浪藻？
19、javaScript中數(shù)組方法push() 劣摇、pop()珠移、shift()和 unshift()的區(qū)別弓乙？
push（）方法可以接收任意個(gè)數(shù)的參數(shù)末融，吧它們逐一添加到到數(shù)組末尾钧惧。并返回修改后的數(shù)組長度；
pop（）方法從數(shù)組末尾最后一項(xiàng)勾习，減少數(shù)組length值浓瞪，并返回去除的那一項(xiàng)；
shift（）方法移除數(shù)組第一項(xiàng)巧婶，將這一項(xiàng)返回乾颁；
unshift（）方法能再數(shù)組前端添加任意個(gè)項(xiàng)，并返回新數(shù)組的長度
20艺栈、你能解釋一下vue.js雙向數(shù)據(jù)綁定的原理嗎英岭？
vue.js雙向綁定就是指model層與view層的同步，兩者之間任意一個(gè)發(fā)生變化都會(huì)同步更新到另一者湿右。
View為視圖層诅妹，Model為數(shù)據(jù)層，ViewModel為邏輯控制層毅人。?
vue.js采用數(shù)據(jù)劫持結(jié)合發(fā)布者-訂閱者模式的方法吭狡，通過Object.defineProperty()劫持各個(gè)屬性的setter，getter在數(shù)據(jù)變動(dòng)時(shí)發(fā)布消息給訂閱者丈莺，觸發(fā)相應(yīng)的監(jiān)聽回調(diào)划煮。?
更詳細(xì)的內(nèi)容請(qǐng)參考此頁：vuejs雙向數(shù)據(jù)綁定原理詳解
21、說一下你對(duì)vue.js生命周期的理解缔俄？
每個(gè) Vue 實(shí)例在被創(chuàng)建時(shí)都要經(jīng)過一系列的初始化過程——例如弛秋，需要設(shè)置數(shù)據(jù)監(jiān)聽、編譯模板牵现、將實(shí)例掛載到 DOM 并在數(shù)據(jù)變化時(shí)更新 DOM 等铐懊。同時(shí)在這個(gè)過程中也會(huì)運(yùn)行一些叫做生命周期鉤子的函數(shù)，這給了用戶在不同階段添加自己的代碼的機(jī)會(huì)瞎疼。
比如?created?鉤子可以用來在一個(gè)實(shí)例被創(chuàng)建之后執(zhí)行代碼科乎，也有一些其它的鉤子，在實(shí)例生命周期的不同階段被調(diào)用贼急，如?mounted茅茂、updated和?destroyed。生命周期鉤子的?this?上下文指向調(diào)用它的 Vue 實(shí)例太抓。
參考文章：vue中文文檔---生命周期
22空闲、Glup、Grunt和webpack的作用是什么走敌？
? ??webpack?是一個(gè)現(xiàn)代 JavaScript 應(yīng)用程序的靜態(tài)模塊打包器(module bundler)碴倾。當(dāng) webpack 處理應(yīng)用程序時(shí)，它會(huì)遞歸地構(gòu)建一個(gè)依賴關(guān)系圖(dependency graph)，其中包含應(yīng)用程序需要的每個(gè)模塊跌榔，然后將所有這些模塊打包成一個(gè)或多個(gè)?bundle异雁。webpack中文網(wǎng)
????gulp.js - 基于流(stream)的自動(dòng)化構(gòu)建工具。Grunt 采用配置文件的方式執(zhí)行任務(wù)僧须，而 Gulp 一切都通過代碼實(shí)現(xiàn)纲刀。
? ??Grunt 是基于 Node.js 的項(xiàng)目構(gòu)建工具。它可以自動(dòng)運(yùn)行你所設(shè)定的任務(wù)担平。Grunt 擁有數(shù)量龐大的插件示绊，幾乎任何你所要做的事情都可以用 Grunt 實(shí)現(xiàn)。
