1、描述一下JavaScript中的數(shù)據(jù)類型氧苍？（就是基本類型和引用類型夜矗，有些面試人員基本類型會(huì)叫做值類型）

答：基本類型有String、Number让虐、Boolean紊撕、Null、Undefined赡突。剩下的都是引用類型对扶，Array、Object麸俘、Date辩稽，F(xiàn)unction等。

追問(wèn)： 怎么判斷基本類型和引用類型从媚？

答： 只有單一的一個(gè)值逞泄，只存放在棧中。比如說(shuō)字符串、數(shù)字喷众、布爾這幾個(gè)就是一個(gè)單一的值各谚，他們就是基本類型。剩下的就是引用類型到千，引用類型就是對(duì)象昌渤。Function、Object憔四、Array膀息、Date等在js里都屬性對(duì)象。引用類型是同時(shí)存儲(chǔ)在堆棧中了赵，我們?cè)L問(wèn)的是棧上的變量標(biāo)識(shí)符（變量名字）和指向該類型指向堆中的內(nèi)存地址潜支。

2、javascript中prototype是什么柿汛，描述一下js中的原型鏈冗酿？（大部分公司會(huì)問(wèn)）

答：在js中函數(shù)也屬于對(duì)象，每個(gè)函數(shù)都有一個(gè)子對(duì)象prototype,? prototype就是該函數(shù)的原型络断，包含一個(gè)類的所有成員裁替。在js里類是以函數(shù)的形式呈現(xiàn)（ js使用function來(lái)聲明一個(gè)類，使用new創(chuàng)造一個(gè)實(shí)例（Object）貌笨，新的es6提供了一個(gè)語(yǔ)法糖class來(lái)聲明一個(gè)類弱判，相對(duì)去function來(lái)說(shuō)結(jié)構(gòu)更清晰 ）。

????通過(guò)new的過(guò)程锥惋，類（function）中的所有成員都會(huì)實(shí)例成Object中的屬性裕循。Object的屬性__proto__和function的屬性prototype都指向了同一個(gè)對(duì)象（原型對(duì)象）。原型既然是對(duì)象净刮，那也必須通過(guò)某一個(gè)類（function）來(lái)實(shí)現(xiàn)（實(shí)例），這個(gè)地方就是繼承的關(guān)鍵硅则，一般來(lái)講外我們不設(shè)計(jì)繼承的話他默認(rèn)繼承Object,這個(gè)就是js的頂層對(duì)象淹父，如果你要在這里繼承于某個(gè)對(duì)象，比如說(shuō)son類（function）繼承于father(Object),那就可以通過(guò)prototype實(shí)現(xiàn)繼承怎虫。然后father是默認(rèn)繼承Object, Object作為一個(gè)對(duì)象暑认，那他就有構(gòu)造函數(shù)（他自己的類 function）。Objecet由Object()的函數(shù)實(shí)例過(guò)來(lái)大审，所以我們?cè)谠趧?chuàng)建對(duì)象的時(shí)候可以寫(xiě)成 new Object();Object上面是null蘸际，空對(duì)象指針。所有的函數(shù)都會(huì)繼承于一個(gè)頂層函數(shù)Function()徒扶。這樣son到father到Object到null,下面的對(duì)象都能訪問(wèn)到上層對(duì)象屬性粮彤，而對(duì)象又是類（function）的實(shí)例。所有的function繼承于頂層函數(shù)Function(), 所以函數(shù)會(huì)默認(rèn)由3個(gè)方法bind,apply,call 3個(gè)方法 這就是繼承自頂層函數(shù)Function()。不然函數(shù)后面怎么能使用點(diǎn)號(hào)來(lái)訪問(wèn)一個(gè)方法导坟。let son = function ( ) { }.bind(father); 這個(gè)bind()就是繼承Function()用于改變指針屿良。(這個(gè)內(nèi)容或多或少會(huì)問(wèn)到，我寫(xiě)的有點(diǎn)亂惫周，知識(shí)點(diǎn)有點(diǎn)抽象尘惧，大家可以搜集一些文章來(lái)看，建議看比較有權(quán)威的書(shū)本里面的講解)

3递递、js里面的this指針是什么喷橙？

答： js的this關(guān)鍵字是調(diào)用函數(shù)的對(duì)象，也叫函數(shù)運(yùn)行是的上下文登舞。運(yùn)行在script里面就是window贰逾、global。作為對(duì)象的一個(gè)屬性運(yùn)行指向改對(duì)象逊躁。嚴(yán)格模式下this沒(méi)有被執(zhí)行環(huán)境定義似踱，所以值會(huì)是一個(gè)undefined（嚴(yán)格模式下才會(huì)出現(xiàn)）。

Ps: 某些文檔上會(huì)說(shuō)明兩個(gè)地方的this指針稽煤，第一個(gè)是閉包的this指針核芽，第二個(gè)是被當(dāng)作變量名賦值給另外一個(gè)變量的函數(shù)的指針。就這兩個(gè)情況的指針會(huì)給人迷惑性酵熙。但是萬(wàn)變不離其宗轧简，所有的指針都是通過(guò)上下文來(lái)進(jìn)行判斷，有些文章里講到某個(gè)對(duì)象下一個(gè)函數(shù)當(dāng)作參數(shù)賦值給另外一個(gè)變量匾二，這個(gè)指針就變成的window,說(shuō)這是javascript的一個(gè)缺陷哮独，我個(gè)人認(rèn)為這并不是一個(gè)缺陷，而是變量賦值的時(shí)候原有函數(shù)的指針丟失察藐，改變成了新函數(shù)執(zhí)行的上下文皮璧，新函數(shù)正好是在window對(duì)象上運(yùn)行。

4分飞、apply, call, bind 有什么區(qū)別悴务？手動(dòng)實(shí)現(xiàn)一個(gè)bind()? （實(shí)現(xiàn)bind有些公司會(huì)問(wèn)，但是不多）

答：3個(gè)函數(shù)都是Function原型鏈上的函數(shù)譬猫，用于改變函數(shù)執(zhí)行時(shí)候的上下文讯檐，也就是this指針。apply 和call 的區(qū)別只在于 第二個(gè)參數(shù)的格式染服，前者是數(shù)組别洪，后者把數(shù)組里面的值一個(gè)個(gè)列出來(lái)用逗號(hào)隔開(kāi)。bind()會(huì)創(chuàng)建一個(gè)新的函數(shù)方便后面調(diào)用（return function() { } ）柳刮。apply和call立即執(zhí)行挖垛。

原理：在調(diào)用call()和apply()函數(shù)的時(shí)候我們能獲取到2個(gè)內(nèi)容痒钝，一個(gè)是調(diào)用這個(gè)方法的函數(shù)，另外一個(gè)是需要綁定的對(duì)象晕换∥缗遥基本的思路是在call（）或者apply() 函數(shù)里去改變執(zhí)行時(shí)候的上下文，從調(diào)用的函數(shù)轉(zhuǎn)向綁定的對(duì)象來(lái)實(shí)現(xiàn)指針的變化闸准。call和apply的區(qū)別僅僅只是在處理arguments(函數(shù)運(yùn)行時(shí)的實(shí)參列表)有區(qū)別益愈。bind()方法和上面的兩個(gè)方法基本原理一致，call和apply方法立即執(zhí)行夷家。bind()方法內(nèi)部返回一個(gè)函數(shù)蒸其，使用es6的箭頭函數(shù)來(lái)返回比較簡(jiǎn)單，箭頭函數(shù)的this指針不會(huì)跟隨執(zhí)行上下文來(lái)變化库快。

5摸袁、js實(shí)現(xiàn)繼承的方法有哪些？

答：

?1.原型繼承：原型繼承的基本方法是重寫(xiě)子類的prototype义屏，子類 prototype的值改變?yōu)楦割惖膶?shí)例來(lái)實(shí)現(xiàn)繼承靠汁。需要變換原型內(nèi)的構(gòu)造函數(shù)。這種繼承方式不能向父類傳遞參數(shù)闽铐，而且在使用引用類型值會(huì)被所有實(shí)例所共享蝶怔。（所有被new出來(lái)的對(duì)象在對(duì)屬性進(jìn)行操作時(shí)都會(huì)對(duì)這個(gè)值進(jìn)行修改，后面的實(shí)例在次使用屬性時(shí)使用的是被修改的值兄墅，這個(gè)問(wèn)題有一部分源于引用類型內(nèi)存地址的問(wèn)題）

2.經(jīng)典繼承：經(jīng)典繼承的使用方法為在子類函數(shù)里面調(diào)用父函數(shù)的call方法踢星。原理 是在子函數(shù)里調(diào)用父函數(shù)，因?yàn)楹瘮?shù)的this指針指向的是函數(shù)運(yùn)行時(shí)候的上下文隙咸，????? 這里使用call函數(shù)讓正在執(zhí)行的父函數(shù)的this指向子函數(shù)來(lái)實(shí)現(xiàn)父函數(shù)內(nèi)部屬性的繼承（作用域的改變）沐悦。此繼承的方式無(wú)法繼承父函數(shù)原型上的內(nèi)容。（殘廢的繼承方法五督，如果父類原型上有方法就沒(méi)法繼承到原型上的方法）

3.組合繼承：前2中繼承方式的結(jié)合藏否。原型屬性使用原型的方式來(lái)進(jìn)行繼承。通過(guò)經(jīng)典繼承使得父類的屬性繼承到子類的屬性里充包，來(lái)解決引用類型的屬性被所有實(shí)例共享的問(wèn)題秕岛。（最常見(jiàn)的沒(méi)有基本沒(méi)有缺陷的繼承）

4.寄生組合式繼承：這種繼承的方式其實(shí)式對(duì)組合繼承的一種優(yōu)化，性能優(yōu)化误证，原理和組合繼承無(wú)差別。組合繼承子類在設(shè)置原型的時(shí)候會(huì)實(shí)例一次父類修壕。在子類的內(nèi)部為了繼承使用call又調(diào)用了一次父類函數(shù)愈捅。所以組合繼承中調(diào)用了2次父類函數(shù)。組合繼承過(guò)程相當(dāng)于在一個(gè)函數(shù)里面對(duì)父類原型設(shè)置為一個(gè)空函數(shù)的原型慈鸠，在把子類的原型替換成該原型蓝谨。

5.es6 的class來(lái)實(shí)現(xiàn)繼承： 使用class來(lái)實(shí)現(xiàn)繼承式最好的一種方式。class的語(yǔ)言更像其它語(yǔ)言中的類。繼承方式語(yǔ)法上更像基于類的繼承譬巫。但是底層仍然基于原型的繼承咖楣。

ps: 現(xiàn)在寫(xiě)類以及類的繼承都是使用class來(lái)寫(xiě)，這種語(yǔ)法更方便維護(hù)芦昔。面試時(shí)候會(huì)問(wèn)到上面的4中繼承方式诱贿，一般只需要記住前三種繼承的原理就可以了。而且3中繼承核心概念只有2個(gè)咕缎，變換作用域珠十，變換原型。（可能早期js設(shè)計(jì)就沒(méi)有想到過(guò)在語(yǔ)法里優(yōu)化繼承這個(gè)內(nèi)容凭豪，沒(méi)有語(yǔ)法糖只能用最老的原型繼承寫(xiě)法來(lái)寫(xiě)”翰洌現(xiàn)在用class開(kāi)發(fā)的話好很多了。不過(guò)項(xiàng)目中一般也不涉及不到繼承嫂伞，除非是寫(xiě)公司的整體框架孔厉。Class繼承語(yǔ)法除了在react中比較突出之外其它框架基本不怎么用繼承）

6、事件循環(huán)機(jī)制 帖努？（js中一個(gè)非常核心的內(nèi)容撰豺，面試題也可以問(wèn)做阻塞、非阻塞然磷、消息隊(duì)列郑趁、任務(wù)隊(duì)列、宏任務(wù)姿搜、微任務(wù)等寡润。這些內(nèi)容都屬于事件循環(huán)機(jī)制下的內(nèi)容）

答： 在js里我們創(chuàng)建一些變量對(duì)象或者函數(shù)的時(shí)候我們先是在堆里開(kāi)辟一些內(nèi)容空間用于存儲(chǔ)變量。當(dāng)調(diào)用函數(shù)時(shí)形成一個(gè)棧幀存放在棧內(nèi)舅柜，根據(jù)作用域遵循堆棧中的先進(jìn)后出梭纹、后就先出的原則，執(zhí)行完成彈出棧致份，直到棧內(nèi)為空（這里需要使用到堆棧的概念）变抽。

事件循環(huán)機(jī)制：javascript中有2個(gè)重要內(nèi)容。一個(gè)是js執(zhí)行主線程氮块，另外一個(gè)是調(diào)用棧妻献。 js引擎為單線程冕茅，執(zhí)行函數(shù)會(huì)一個(gè)一個(gè)放在調(diào)用棧中等待主線程來(lái)執(zhí)行，如果碰到阻塞，如異步函數(shù)settimeout或ajax等會(huì)把事件的回調(diào)函數(shù)放到任務(wù)隊(duì)列（也就是消息隊(duì)列）中等待主線程空閑的時(shí)候執(zhí)行害捕，線程會(huì)繼續(xù)執(zhí)行主線程上上的方法阵翎，主線程遵循先進(jìn)后出的執(zhí)行順序（最先放入棧中的是父函數(shù)轻绞，然后繼續(xù)執(zhí)行父函數(shù)內(nèi)的子函數(shù)，子方法蛀柴，子函數(shù)執(zhí)行完成后垃圾回收機(jī)制彈出棧內(nèi)，直至函數(shù)內(nèi)所有子方法全部執(zhí)行完畢矫夯，此時(shí)彈出父函數(shù)鸽疾，調(diào)用棧內(nèi)為空）。調(diào)用棧內(nèi)空置训貌，開(kāi)始事件循環(huán)制肮，檢測(cè)任務(wù)隊(duì)列是否有函數(shù)，有的話放入棧中執(zhí)行旺订，但是任務(wù)隊(duì)列此時(shí)的執(zhí)行順序?yàn)橄冗M(jìn)先出弄企，其實(shí)就是哪一個(gè)函數(shù)寫(xiě)在前面先執(zhí)行哪一個(gè)。執(zhí)行完成后此時(shí)調(diào)用棧和消息隊(duì)列內(nèi)已沒(méi)有內(nèi)容区拳，代碼執(zhí)行完畢拘领。

這里有一個(gè)特別的地方，異步函數(shù)都會(huì)被推到任務(wù)隊(duì)列（消息隊(duì)列）內(nèi)執(zhí)行樱调，但是任務(wù)隊(duì)列里的任務(wù)分為兩種约素，一種是宏任務(wù)，一種是微任務(wù)笆凌。宏任務(wù)有setTimeout圣猎、 UI事件（點(diǎn)擊、觸摸等事件的回調(diào)）乞而、setInterval送悔、requestAnimationFrame（頁(yè)面重繪），微任務(wù)瀏覽器常用的就一個(gè)Promise,其它的不會(huì)考爪模。微任務(wù)和宏任務(wù)都屬于任務(wù)隊(duì)列里的內(nèi)容欠啤，區(qū)別在于微任務(wù)優(yōu)先于宏任務(wù)執(zhí)行。事件循環(huán)機(jī)制就是這些內(nèi)容屋灌，考點(diǎn)會(huì)從里面抽取洁段，有些公司也會(huì)考代碼，但是只要知道事件循環(huán)機(jī)制根本不是什么事共郭。

7祠丝、閉包是什么，閉包的優(yōu)缺點(diǎn)除嘹，閉包里面的this指針指向哪里写半？?????

答： 閉包就是定義在函數(shù)內(nèi)部的子函數(shù)。他可以在外部訪問(wèn)函數(shù)內(nèi)部的變量尉咕。 閉包的優(yōu)點(diǎn)就是外部能訪問(wèn)函數(shù)內(nèi)部的變量污朽，缺點(diǎn)是變量會(huì)一直存儲(chǔ)在內(nèi)存里。閉包的this指向window或者是global龙考。

追問(wèn)：為什么閉包的this指向的是window?

答： 閉包的結(jié)構(gòu)為父函數(shù)里嵌套子函數(shù)蟆肆，要調(diào)用子函數(shù)父函數(shù)必須把子函數(shù)return出來(lái)。上面說(shuō)到過(guò)this指向函數(shù)執(zhí)行時(shí)候的上下文晦款，父函數(shù)執(zhí)行時(shí)被可能會(huì)被某個(gè)對(duì)象調(diào)用指向該對(duì)象炎功，但是父函數(shù)執(zhí)行完成之后返回的子函數(shù)就不被任何對(duì)象調(diào)用，相當(dāng)于執(zhí)行在window上缓溅，所以閉包的this指向的是window蛇损。

8、數(shù)組和對(duì)象上的方法有哪些坛怪？（考點(diǎn)在于對(duì)數(shù)據(jù)的處理能力淤齐，雖然不同公司問(wèn)法可能有些差別，但是思路是一樣的袜匿。有些公司可能會(huì)給一些數(shù)據(jù)然后把數(shù)據(jù)處理成想要的內(nèi)容）

答： 常用的數(shù)組方法有: join(數(shù)組轉(zhuǎn)字符)更啄、push(添加元素)，pop(刪除末尾元素并返回)居灯，sort(數(shù)組排序)祭务，reverse(反轉(zhuǎn)數(shù)組)， concat(鏈接數(shù)組)怪嫌，includs(查找數(shù)組是含有某一個(gè)义锥，返回true)， find(查找是否函數(shù)元素岩灭，返回元素), findIndex(查找是否含有元素拌倍，返回下標(biāo)，沒(méi)有返回-1)噪径， filter(過(guò)濾數(shù)組柱恤，返回新的數(shù)組),slice(切割數(shù)組)，splice(刪除數(shù)組)

常用的對(duì)象方法： assign（對(duì)象合并）熄云，create(創(chuàng)建對(duì)象)膨更，keys(返回鍵數(shù)組)，hasOwnProperty(判斷是否含有指定的屬性)缴允。其它的有很多荚守，但是不常見(jiàn)。

9练般、說(shuō)一下深拷貝和淺拷貝矗漾？（這個(gè)問(wèn)題會(huì)經(jīng)常被問(wèn),也是一個(gè)小核心內(nèi)容）

答：淺拷貝和深拷貝只在引用類型上由區(qū)別，基本類型沒(méi)差別薄料。潛拷貝就是簡(jiǎn)單的賦值敞贡，在引用類型上變量的簡(jiǎn)單賦值變換只是變量標(biāo)識(shí)符，比如說(shuō)let a = [1,2,3]; let b = a; 這種淺拷貝只是變換了變量的名稱摄职，他們的內(nèi)存地址（引用地址誊役，在堆里面的地址）還是一樣的获列。如果改變b，b.push(4)蛔垢，則a也會(huì)被改變击孩。深拷貝就是在內(nèi)存里開(kāi)辟一個(gè)新的內(nèi)存地址用來(lái)存儲(chǔ)新變量，相對(duì)于潛拷貝他不僅僅是簡(jiǎn)單的賦值鹏漆，他還在堆里創(chuàng)建了新的內(nèi)存地址巩梢，改變b就不會(huì)影響到a。常用的深拷貝方法艺玲， 我這邊是轉(zhuǎn)成JSON在轉(zhuǎn)過(guò)來(lái)括蝠。Let b = JSON.parse(JSON.stringify(a))。

10饭聚、說(shuō)說(shuō)幾種js中的設(shè)計(jì)模式忌警？

答： 工廠模式、原型模式若治、單例模式慨蓝、訂閱發(fā)布模式、狀態(tài)模式端幼。 工廠模式礼烈、單例模式和觀察者模式是最常見(jiàn)的。其它的沒(méi)有什么必要去了解婆跑。下面可能會(huì)問(wèn)模式的一些特性此熬。

11、簡(jiǎn)述一下ajax的內(nèi)容滑进？（筆試題里比較常見(jiàn)犀忱，可以從 什么是ajax、基本原理扶关、優(yōu)缺點(diǎn)去描述ajax）

答：

什么是ajax：ajax是一種創(chuàng)建交互式網(wǎng)頁(yè)應(yīng)用的網(wǎng)頁(yè)開(kāi)發(fā)技術(shù)阴汇。(新的交互式網(wǎng)頁(yè)開(kāi)發(fā)技術(shù))。

基本原理：ajax基于ajax引擎“XMLHttpRequest”對(duì)象來(lái)向服務(wù)器發(fā)送數(shù)據(jù)并對(duì)數(shù)據(jù)響應(yīng)节槐。使用new XMLHttpRequest()對(duì)象下的方法向服務(wù)器發(fā)送請(qǐng)求和接收數(shù)據(jù)搀庶。使用js來(lái)操作dom實(shí)現(xiàn)頁(yè)面的刷新，對(duì)請(qǐng)求錯(cuò)誤以及其它一些情況進(jìn)行處理铜异。（IE瀏覽器的ajax引擎對(duì)象為ActiveXObject（“Microsoft.XMLHttp”）, 和其它瀏覽器有一些差別哥倔，如果寫(xiě)ajax第一次封裝插件的話需要對(duì)這個(gè)進(jìn)行判斷。IE戲就是多）揍庄。

優(yōu)點(diǎn)：

1. 在不刷新頁(yè)面的情況下更新數(shù)據(jù)咆蒿。早期的數(shù)據(jù)交互是通過(guò)配置form 表單的 action，method，submit后提交form表單來(lái)完成沃测，form表單是瀏覽器帶的功能缭黔，在提交返回后頁(yè)面會(huì)進(jìn)行一次頁(yè)面刷新。而ajax是使用ajax引擎來(lái)完成數(shù)據(jù)獲取蒂破，使用js對(duì)dom進(jìn)行操作试浙。不會(huì)刷新頁(yè)面。

2.異步數(shù)據(jù)傳輸寞蚌。 ajax使用異步方式與服務(wù)器進(jìn)行通信。Js是單線程钠糊。使用異步方式能降低頁(yè)面白屏?xí)r間，減少用戶等待時(shí)間抄伍，防止頁(yè)面卡死在請(qǐng)求期間而無(wú)法加載后續(xù)內(nèi)容艘刚，增強(qiáng)用戶體驗(yàn)截珍。

3.降低前端和后端的負(fù)擔(dān)秋度。 使用form表單需要提交大量的內(nèi)容，后端還需要對(duì)內(nèi)容進(jìn)行解析查牌，使用ajax只需要關(guān)注傳輸?shù)臄?shù)據(jù)即可兽泣。后端根據(jù)請(qǐng)求頭返回值唠倦，前端使用js對(duì)dom進(jìn)行操作法希。（最主要的就是這3個(gè)點(diǎn)怨咪，不刷新頁(yè)面跟新數(shù)據(jù)，異步傳輸， 降低前后端負(fù)擔(dān)芋簿。）

12与斤、描述一下es6食寡、es7的新特性冻河？（說(shuō)常用特性即可）

答：新的變量聲明方式let const ; 解構(gòu)賦值； 箭頭函數(shù)；新異步函數(shù)Promise;async

await ,新數(shù)據(jù)結(jié)構(gòu)Set, Map樱蛤。新的類聲明方式class爽醋。遍歷方式map, forEach, for...of 遂赠。 以及一些常用的數(shù)組對(duì)象方法includes跷睦、filter等

追問(wèn)：新特性解決哪些問(wèn)題？

答：1.? let const： 解決var聲明變量沒(méi)有塊級(jí)作用域的問(wèn)題，let 和const都不能重復(fù)聲明异希，const 值不能被修改憨降。

2.箭頭函數(shù)：函數(shù)的this指針是其運(yùn)行時(shí)的上下文，箭頭函數(shù)的指針在函數(shù)定義時(shí)候所在的對(duì)象呜魄，而不是運(yùn)行時(shí)候的對(duì)象睹晒，減少了賦值指針的操作猫十。箭頭函數(shù)的書(shū)寫(xiě)更簡(jiǎn)潔江兢。

3. Promise、async拢驾、await 新的異步函數(shù)稠腊。（這個(gè)內(nèi)容使用面廣，也是es新特性中比較重要的一個(gè)內(nèi)容挠羔，大部分公司或多或少都會(huì)問(wèn)到這個(gè)問(wèn)題速那，下面會(huì)單獨(dú)提出來(lái)問(wèn)）

4.新數(shù)據(jù)結(jié)構(gòu)Set, Map: Set數(shù)據(jù)結(jié)構(gòu)和數(shù)組上基本一模一樣吱七，優(yōu)點(diǎn)在于Set數(shù)據(jù)里面不存在重復(fù)的值吝岭，可以使用new Set（）對(duì)數(shù)組進(jìn)行查重幕帆。排除重復(fù)的值或者做一些其它的事情仗扬。Map:在老的數(shù)據(jù)類型中诅蝶，對(duì)象的屬性名稱只能是一個(gè)字符串，（字符串--值）的結(jié)構(gòu)棘钞，而Map（Map也是鍵值對(duì)的數(shù)據(jù)結(jié)構(gòu)）里屬性名可以變成值（值--值的結(jié)構(gòu)）是一個(gè)更完善的Hash結(jié)構(gòu)硝逢。

13柴罐、promise虾啦、 await async 硬毕、setTimeout 的區(qū)別沪羔？（重點(diǎn)）

答： 4個(gè)函數(shù)都為異步函數(shù)，setTimeout屬于事件循環(huán)機(jī)制中的宏任務(wù)狈邑，優(yōu)先級(jí)低于Promise, await

async , Promise 為新的es異步函數(shù)况增，await

async 是作為對(duì)promise的一部分饭庞。 async 會(huì)返回一個(gè)promise對(duì)象卤恳，await 觸發(fā)async返回promise趟脂，等待返回散怖，在這里此函數(shù)的進(jìn)程中斷，繼續(xù)執(zhí)行函數(shù)外的其它函數(shù)肄渗，等待事件循環(huán)機(jī)制完成await 觸發(fā)的promise后繼續(xù)執(zhí)行await后面的代碼镇眷。（關(guān)聯(lián)事件循環(huán)機(jī)制）

Ps:這個(gè)考題都會(huì)考，有些可能不會(huì)問(wèn)await async翎嫡；但是promise是肯定會(huì)考的欠动，promise的應(yīng)用面非常的廣。

14惑申、瀏覽器有哪些數(shù)據(jù)存儲(chǔ)方法具伍？區(qū)別在哪？

答： cookie,sessionStorage,localStorage.（瀏覽器下的storage對(duì)象）

Cookie： 早期的前端開(kāi)發(fā)中大量使用的一種存儲(chǔ)技術(shù)圈驼。在比較早的網(wǎng)站里服務(wù)器發(fā)送到客服端的數(shù)據(jù)的響應(yīng)頭里可以設(shè)置存儲(chǔ)一些值到客戶端的cookie里方便客戶端和服務(wù)器聯(lián)系人芽。如登錄等信息。在下一次客戶端對(duì)改服務(wù)器發(fā)送請(qǐng)求的時(shí)候都會(huì)將cookie發(fā)送到服務(wù)器用于驗(yàn)證用戶信息（登錄狀態(tài)等）绩脆。Cookie也可以用來(lái)存儲(chǔ)其它一些客戶端的內(nèi)容優(yōu)化客戶端的體驗(yàn)萤厅。Cookie可以自定義設(shè)置值、域靴迫、過(guò)期時(shí)間等惕味。大小為4M內(nèi)。

sessionStorage: 繼承于Storage的存儲(chǔ)玉锌，頁(yè)面關(guān)閉消失名挥。存儲(chǔ)大小為5M左右，不同瀏覽器存儲(chǔ)大小有差別主守。

LocalStorage: 同樣繼承與Storage禀倔，頁(yè)面關(guān)閉不會(huì)消失榄融。永久存儲(chǔ)，除非手動(dòng)清除或使用clear方法清除蹋艺。谷歌最大5M左右剃袍，不同瀏覽器存儲(chǔ)大小有差別。

15捎谨、前端的優(yōu)化過(guò)程民效？

答： 優(yōu)化方法有很多，減少http請(qǐng)求涛救，壓縮css html js 文件(gulp等構(gòu)建工具就有壓縮功能)畏邢，壓縮image圖片，使用icon, 減少重繪检吆，減少dom節(jié)點(diǎn)舒萎，預(yù)加載、按需加載蹭沛、雪碧圖等很多方法臂寝。

16、跨域有幾種摊灭？ 怎么解決跨域問(wèn)題咆贬？原理？

答: 瀏覽器對(duì)js的同源策略限制帚呼，不同域之間不能相互訪問(wèn)掏缎，所以出現(xiàn)了跨域問(wèn)題。同域?yàn)橄嗤丝诿荷薄f(xié)議眷蜈、域名。Jquery中的話是使用Jsonp沈自。（使用jquery多的話就會(huì)問(wèn)你jsonp的問(wèn)題酌儒，使用vue多就會(huì)問(wèn)代理的問(wèn)題，vue的proxyType是將請(qǐng)求發(fā)送給自己的服務(wù)器枯途，在由服務(wù)器轉(zhuǎn)向后臺(tái)服務(wù)器忌怎，實(shí)現(xiàn)瀏覽器跨域，和jsonp有區(qū)別）

Jsonp的基本原理：jsonp是一種為了處理跨域問(wèn)題的一種方案柔袁，像ajax,但是他并不是ajax呆躲。ajax獲取不到存在跨域問(wèn)題的文件的异逐，因?yàn)槭艿酵床呗缘挠绊懘匪鳎琼?yè)面上的使用script標(biāo)簽引入文件是不受影響，比如說(shuō)<script src=“www.aaa.cn/page/index.js”> 這種情況是能訪問(wèn)到這個(gè)js文件灰瞻。不僅是js文件腥例，帶有src的標(biāo)簽都不會(huì)受到同源策略的影響辅甥。那jsonp就可以理解為你在頁(yè)面添加了一個(gè)script標(biāo)簽，服務(wù)器為我們生成js文件燎竖，script標(biāo)簽指向這個(gè)js文件地址璃弄，callback為js文件里面存放數(shù)據(jù)的函數(shù)名字，服務(wù)器動(dòng)態(tài)生成js,script標(biāo)簽去取js文件里的callback 函數(shù)名字內(nèi)的參數(shù)构回。所以jsonp和ajax的不同就在于ajax是new XMLHttpRequest() 來(lái)獲取文件夏块，jsonp使用script標(biāo)簽來(lái)引入存儲(chǔ)了數(shù)據(jù)的js文件來(lái)解決跨域問(wèn)題。在Jquery中看起來(lái)都是在使用數(shù)據(jù)請(qǐng)求纤掸，但是jsonp和ajax是2個(gè)不用的東西脐供。（缺點(diǎn)：jsonp只能get，post跨域的話需要后端配合借跪，指定域名或者所有域名都能訪問(wèn)）

17政己、有沒(méi)有使用過(guò)css 預(yù)處理語(yǔ)言？有哪些掏愁？介紹一下基本特性和優(yōu)點(diǎn)歇由？

答： css 預(yù)處理有sass，less果港，sylus 三種預(yù)處理語(yǔ)言的都有一些共同特性沦泌，支持聲明css變量，css常量京腥，css函數(shù)赦肃，混淆、嵌套公浪、引入（@import）等功能他宛。特性和優(yōu)點(diǎn)：既然支持常量變量和函數(shù)，那在原來(lái)需要使用js來(lái)改變css的場(chǎng)景就不需要大量使用js欠气，樣式列表里已經(jīng)支持加減乘除等其它運(yùn)算厅各。可以定義全局css塊變量预柒，全局字體樣式變量队塘。比如主題顏色的切換。大部分內(nèi)容的標(biāo)題宜鸯、內(nèi)容樣式的統(tǒng)一修改憔古。css的嵌套讓css代碼更簡(jiǎn)潔更具有層級(jí)性更方便維護(hù)。

18淋袖、前端模塊化的發(fā)展歷程鸿市？

答：CommonJs 、AMD 、CMD焰情、 ES6Module

(script type=“module”)陌凳；

會(huì)問(wèn)一些前端模塊化問(wèn)題，js模塊防止數(shù)據(jù)污染内舟，不依賴閉包封裝合敦。組件模塊就是什么樣情況會(huì)設(shè)計(jì)成組件，答高復(fù)用验游，低耦合就可以了充岛。

19、有沒(méi)有了解過(guò)npm耕蝉、bower裸准、gulp、webpack 等前端架構(gòu)工具赔硫？

20炒俱、說(shuō)一下http協(xié)議？（關(guān)于http的一些內(nèi)容）

ps: 也就是請(qǐng)求協(xié)議爪膊、請(qǐng)求體权悟、響應(yīng)內(nèi)容等進(jìn)行闡述。

21推盛、頁(yè)面的整體加載過(guò)程 峦阁？

22、其它就是一些框架上的問(wèn)題耘成，這一個(gè)部分會(huì)大量的問(wèn)及榔昔，大部分問(wèn)的內(nèi)容是經(jīng)驗(yàn)上的問(wèn)題，如有沒(méi)有使用過(guò)JQuery寫(xiě)過(guò)擴(kuò)展瘪菌、封裝一個(gè)長(zhǎng)按事件等撒会？

23、jq的鏈?zhǔn)秸{(diào)用的原理师妙？

24诵肛、瀏覽器的兼容性？

CSS

Css內(nèi)的內(nèi)容我就直接放問(wèn)題啦默穴，這里的內(nèi)容都是老生常談的內(nèi)容了怔檩。

1、Css 盒子模型 蓄诽；

2薛训、定位有哪些，特點(diǎn)仑氛；

3乙埃、實(shí)現(xiàn)一個(gè)垂直居中蝴猪；（定位， css3 transform , 彈性等）

4膊爪、Px 、rem嚎莉、em 特點(diǎn)米酬；

5、一些不常見(jiàn)的屬性如vertical-align基線等問(wèn)題趋箩；

6赃额、IE和W3C標(biāo)準(zhǔn)下的box-sizing 的差別 ；

7叫确、@import 特點(diǎn) 跳芳；

8、清除浮動(dòng)的方式竹勉；

9飞盆、Css偽類的內(nèi)容；

10次乓、Css3 的一些內(nèi)容吓歇，過(guò)渡動(dòng)畫(huà)等；

其它的就是一些待遇規(guī)劃等票腰。規(guī)劃最好以3年以內(nèi)來(lái)進(jìn)行闡述城看，這樣比較容易思考而且符合實(shí)際，可以提一些以后的內(nèi)容杏慰，面試官的面試印象也很重要测柠，反正別緊張、自信就可以缘滥。