json和xml區(qū)別
(1).可讀性方面柿汛。
JSON和XML的數(shù)據(jù)可讀性基本相同陪毡，JSON和XML的可讀性可謂不相上下绪杏，一邊是建議的語(yǔ)法，一邊是規(guī)范的標(biāo)簽形式击蹲，XML可讀性較好些署拟。
(2).可擴(kuò)展性方面。
XML天生有很好的擴(kuò)展性歌豺，JSON當(dāng)然也有推穷，沒(méi)有什么是XML能擴(kuò)展，JSON不能的类咧。
(3).編碼難度方面馒铃。
XML有豐富的編碼工具蟹腾，比如Dom4j、JDom等区宇，JSON也有json.org提供的工具娃殖，但是JSON的編碼明顯比XML容易許多，即使不借助工具也能寫出JSON的代碼萧锉，可是要寫好XML就不太容易了珊随。
(4).解碼難度方面。
XML的解析得考慮子節(jié)點(diǎn)父節(jié)點(diǎn)，讓人頭昏眼花鲫凶，而JSON的解析難度幾乎為0禀崖。這一點(diǎn)XML輸?shù)恼媸菦](méi)話說(shuō)螟炫。
(5).流行度方面掸屡。
XML已經(jīng)被業(yè)界廣泛的使用，而JSON才剛剛開始，但是在Ajax這個(gè)特定的領(lǐng)域亿眠，未來(lái)的發(fā)展一定是XML讓位于JSON碎罚。到時(shí)Ajax應(yīng)該變成Ajaj(Asynchronous Javascript and JSON)了。
(6).解析手段方面纳像。
JSON和XML同樣擁有豐富的解析手段荆烈。
(7).數(shù)據(jù)體積方面。
JSON相對(duì)于XML來(lái)講竟趾，數(shù)據(jù)的體積小憔购，傳遞的速度更快些。
(8).數(shù)據(jù)交互方面潭兽。
JSON與JavaScript的交互更加方便倦始，更容易解析處理，更好的數(shù)據(jù)交互山卦。
(9).數(shù)據(jù)描述方面鞋邑。
JSON對(duì)數(shù)據(jù)的描述性比XML較差诵次。
(10).傳輸速度方面。
JSON的速度要遠(yuǎn)遠(yuǎn)快于XML枚碗。
js設(shè)計(jì)模式
舉例說(shuō)一下構(gòu)造器模式逾一、工廠模式、模塊化模式
//構(gòu)造器模式
// function Person(name,age){
// this.name = name
// this.age = age
// return '對(duì)象初始化成功肮雨。遵堵。。'
// }
// var p1 = new Person('xiaohong',20)
// var p2 = new Person('xiaohong',30)
// console.log(typeof p1)
// console.log(p1 instanceof Array)
// console.log(p1.constructor())
//module模式,模塊化開發(fā)
// ? ? var User = {
// ? ? add:function(msg){
// ? ? console.log('添加成功')
// ? ? }
// ? ? }
// ? ? function User(name){
// ? ? return {
// ? ? add:function(msg){
// ? ? console.log('用戶'+name+msg)
// ? ? },
// ? ? delete:function(msg){
// ? ? console.log('用戶'+name+msg)
// ? ? },
// ? ? update:function(msg){
// ? ? console.log('用戶'+name+msg)
// ? ? },
// ? ? find:function(msg){
// ? ? console.log('用戶'+name+msg)
// ? ? }
// ? ? }
// ? ? }
// ? ? User('張三').add('添加一個(gè)用戶')
// ? ? User('張三').delete('刪除一個(gè)用戶')
//factory模式怨规，工廠模式陌宿，根據(jù)你傳的值判斷走向
? ? function User(idcard){
? ? if(idcard){
? ? return function(){
? ? return 'vip'
? ? }
? ? }else{
? ? return function(){
? ? return '普通用戶'
? ? }
? ? }
? ? }
? ? var p1 = User('sjsa')
? ? console.log(p1())
垃圾回收機(jī)制有哪幾種，原理是什么
https://www.cnblogs.com/zhwl/p/4664604.html
事件代理或者事件委托波丰，寫代碼
<input type="button" id="add" value="添加"/>
<ul id="ul1">
? ? <li>111</li>
? ? <li>222</li>
? ? <li>333</li>
? ? <li>444</li>
</ul>
//用事件委托
window.onload = function(){
var oul = document.getElementById('ul1')
var btn = document.getElementById('add')
var num = 4
//鼠標(biāo)移入li上變紅壳坪，移出變白
oul.onmouseover = function(ev){
var ev = ev||window.event
var target = ev.target || ev.srcElement
if(target.nodeName.toLowerCase() == 'li'){
target.style.background = 'red'
}
}
oul.onmouseout = function(ev){
var ev = ev||window.event
var target = ev.target || ev.srcElement
if(target.nodeName.toLowerCase() == 'li'){
target.style.background = '#FFFFFF'
}
}
//添加新節(jié)點(diǎn)
btn.onclick = function(){
num++
var oli = document.createElement('li')
oli.innerHTML = 111*num
oul.appendChild(oli)
}
}
事件循環(huán)
https://www.cnblogs.com/dong-xu/p/7000163.html
語(yǔ)義化標(biāo)簽有哪些
語(yǔ)義化HTML：用最恰當(dāng)?shù)腍TML元素標(biāo)記的內(nèi)容。
優(yōu)點(diǎn)：
1 提升可訪問(wèn)性掰烟；
2 SEO爽蝴；
3 結(jié)構(gòu)清晰，利于維護(hù)纫骑；
title蝎亚、header、nav（標(biāo)記導(dǎo)航）先馆、main发框、article、section磨隘、aside缤底、footer、video番捂、canvas
作用域
https://blog.csdn.net/whd526/article/details/70990994
變量的作用域無(wú)非就是兩種：全局變量和局部變量个唧。
全局作用域： 最外層函數(shù)定義的變量擁有全局作用域，即對(duì)任何內(nèi)部函數(shù)來(lái)說(shuō)设预，都是可以訪問(wèn)
局部作用域： 和全局作用域相反徙歼，局部作用域一般只在固定的代碼片段內(nèi)可訪問(wèn)到，而對(duì)于函數(shù)外部是無(wú)法訪問(wèn)的鳖枕，最常見的例如函數(shù)內(nèi)部
需要注意的是魄梯，函數(shù)內(nèi)部聲明變量的時(shí)候，一定要使用var命令宾符。如果不用的話酿秸，你實(shí)際上聲明了一個(gè)全局變量！
<script>
? ? ? function fn(){
? ? ? ? innerVar = "inner";
? ? ? }
? ? ? fn();
? ? ? console.log(innerVar);// result:inner
</script>
作用域鏈
根據(jù)在內(nèi)部函數(shù)可以訪問(wèn)外部函數(shù)變量的這種機(jī)制魏烫，用鏈?zhǔn)讲檎覜Q定哪些數(shù)據(jù)能被內(nèi)部函數(shù)訪問(wèn)辣苏，想要知道js怎么鏈?zhǔn)讲檎腋蜗洌偷孟攘私鈐s的執(zhí)行環(huán)境（參考上一節(jié)作用域的文檔）
原型
原型鏈
變量提升
再來(lái)看一個(gè)代碼：
<script>
? ? ? var scope = "global";
? ? ? function fn(){
? ? ? ? console.log(scope);//result:undefined
? ? ? ? var scope = "local";
? ? ? ? console.log(scope);//result:local;
? ? ? }
? ? ? fn();
</script>
第一個(gè)輸出居然是undefined，原本以為它會(huì)訪問(wèn)外部的全局變量(scope=”global”)稀蟋，但是并沒(méi)有煌张。這可以算是javascript的一個(gè)特點(diǎn)，只要函數(shù)內(nèi)定義了一個(gè)局部變量退客，函數(shù)在解析的時(shí)候都會(huì)將這個(gè)變量“提前聲明”：
java設(shè)計(jì)模式
頁(yè)面模板引擎（原生寫法）
vue的生命周期
ajax的生命周期
ajax創(chuàng)建過(guò)程
ajax：在不切換頁(yè)面的情況下完成異步的HTTP請(qǐng)求
(1)創(chuàng)建XMLHttpRequest對(duì)象,也就是創(chuàng)建一個(gè)異步調(diào)用對(duì)象.
(2)創(chuàng)建一個(gè)新的HTTP請(qǐng)求,并指定該HTTP請(qǐng)求的方法骏融、URL及驗(yàn)證信息.
(3)設(shè)置響應(yīng)HTTP請(qǐng)求狀態(tài)變化的函數(shù).
(4)發(fā)送HTTP請(qǐng)求.
(5)獲取異步調(diào)用返回的數(shù)據(jù).
(6)使用JavaScript和DOM實(shí)現(xiàn)局部刷新.
rem和px的區(qū)別
http://www.runoob.com/w3cnote/px-em-rem-different.html
前端性能和安全
慕課網(wǎng)https://www.imooc.com/learn/580?
多平臺(tái)兼容和適配
需要補(bǔ)充一些思路
了解SVG、canvas動(dòng)畫
補(bǔ)充代碼實(shí)例
搜索引擎優(yōu)化vue父組件和子組件直接的傳參萌狂、組件和組件之間的傳參
補(bǔ)充代碼實(shí)例
js內(nèi)存管理
https://www.cnblogs.com/zhutty/p/5341572.html
dom有哪些操作
https://juejin.im/post/5b444f7ce51d4519962e9147
MVC档玻、MVP、MVVM的區(qū)別以及各自的代表框架
前端性能優(yōu)化的看法雅虎性能優(yōu)化軍規(guī)怎么優(yōu)化網(wǎng)絡(luò)請(qǐng)求get/post的區(qū)別粥脚，在數(shù)據(jù)傳輸及強(qiáng)度及傳輸數(shù)據(jù)類型方面窃肠？還有其他區(qū)別嗎？tcp三次握手和四次揮手瀏覽器崩掉有哪些原因?qū)懗鲆粋€(gè)vue模板閉包輸出問(wèn)題函數(shù)聲明和函數(shù)定義輸出問(wèn)題es6里面的promise/let/回調(diào)等新特性同步和異步的區(qū)別刷允，實(shí)際情景舉例回調(diào)函數(shù)
產(chǎn)生浮動(dòng)的情況以及怎么清除浮動(dòng)
首先我們要知道，css中的塊級(jí)元素在頁(yè)面中是獨(dú)占一行的碧囊，自上而下排列树灶，也就是我們所說(shuō)的流，通常我們稱之為標(biāo)準(zhǔn)流糯而。
div是獨(dú)自占用一行的天通，這是在標(biāo)準(zhǔn)流中的理論，但是熄驼，有些時(shí)候像寒，我們的需求不僅僅是這樣，我們想著如何在一行中顯示多個(gè)div元素瓜贾，所以诺祸，標(biāo)準(zhǔn)流已經(jīng)不能滿足我們的需求，這個(gè)時(shí)候我們就需要用到浮動(dòng)祭芦，我們這樣理解筷笨，浮動(dòng)就是讓這個(gè)div元素脫離標(biāo)準(zhǔn)流，漂浮在標(biāo)準(zhǔn)流的上面龟劲。
清除浮動(dòng)：1胃夏、在需要清除浮動(dòng)的元素前面添加一個(gè)空的div，給這個(gè)div添加一個(gè)css屬性昌跌，clear：both仰禀；
2、浮動(dòng)產(chǎn)生外層div(沒(méi)有設(shè)置高度的)高度塌陷：給外面的div添加overflow：hidden或auto
3蚕愤、公共的樣式-用來(lái)清除樣式：就是利用偽類元素來(lái)清除有浮動(dòng)的標(biāo)簽答恶，也就定義一個(gè)公共的類clearfix饺蚊，給這個(gè)類添加css屬性，在里面進(jìn)行清除浮動(dòng)的操作亥宿，只要哪里需要清除浮動(dòng)卸勺，就在哪里添加一個(gè)清除浮動(dòng)的類
.clearfix:after{
? ? content:"";
? ? display:table;
? ? height:0;
? ? visibility:both;
? ? clear:both;
}
.clearfix{
? ? *zoom:1;? ? /* IE/7/6*/
}
apply和call的定義和區(qū)別
外邊距重疊及其影響
閉包的概念
截取url參數(shù)，寫代碼
對(duì)jsonp理解
產(chǎn)生隨機(jī)數(shù)并排序
在不知道div寬度的情況下如何居中
什么是盒子模型
內(nèi)容(content)烫扼、填充(padding)曙求、邊框(border)、邊界(margin)映企，CSS盒子模式都具備這些屬性悟狱。
HTML行內(nèi)元素、塊狀元素堰氓、行內(nèi)塊狀元素的區(qū)別
HTML可以將元素分類方式分為行內(nèi)元素挤渐、塊狀元素和行內(nèi)塊狀元素三種。首先需要說(shuō)明的是双絮，這三者是可以互相轉(zhuǎn)換的浴麻，使用display屬性能夠?qū)⑷呷我廪D(zhuǎn)換：
(1)display:inline;轉(zhuǎn)換為行內(nèi)元素
(2)display:block;轉(zhuǎn)換為塊狀元素
(3)display:inline-block;轉(zhuǎn)換為行內(nèi)塊狀元素
行內(nèi)元素和塊級(jí)元素
空元素：br、meta囤攀、hr软免、link、input焚挠、img（空元素是在開始標(biāo)簽中關(guān)閉的）
請(qǐng)描述一下cookies膏萧，sessionStorage和localStorage的區(qū)別？
sessionStorage和localStorage統(tǒng)稱為web storage
web storage和cookie的區(qū)別
Web Storage的概念和cookie相似蝌衔，區(qū)別是它是為了更大容量存儲(chǔ)設(shè)計(jì)的榛泛。Cookie的大小是受限的，并且每次你請(qǐng)求一個(gè)新的頁(yè)面的時(shí)候Cookie都會(huì)被發(fā)送過(guò)去噩斟，這樣無(wú)形中浪費(fèi)了帶寬曹锨，另外cookie還需要指定作用域，不可以跨域調(diào)用亩冬。
除此之外艘希，Web Storage擁有setItem,getItem,removeItem,clear等方法，不像cookie需要前端開發(fā)者自己封裝setCookie硅急，getCookie覆享。但是Cookie也是不可以或缺的：Cookie的作用是與服務(wù)器進(jìn)行交互，作為HTTP規(guī)范的一部分而存在 营袜，而Web Storage僅僅是為了在本地“存儲(chǔ)”數(shù)據(jù)而生撒顿。
sessionStorage和localStorage區(qū)別
sessionStorage用于本地存儲(chǔ)一個(gè)會(huì)話（session）中的數(shù)據(jù)，這些數(shù)據(jù)只有在同一個(gè)會(huì)話中的頁(yè)面才能訪問(wèn)并且當(dāng)會(huì)話結(jié)束后數(shù)據(jù)也隨之銷毀荚板。因此sessionStorage不是一種持久化的本地存儲(chǔ)凤壁，僅僅是會(huì)話級(jí)別的存儲(chǔ)吩屹。而localStorage用于持久化的本地存儲(chǔ)，除非主動(dòng)刪除數(shù)據(jù)拧抖，否則數(shù)據(jù)是永遠(yuǎn)不會(huì)過(guò)期的煤搜。
什么是漸進(jìn)增強(qiáng)（progressive enhancement）、優(yōu)雅降級(jí)（graceful degradation）呢唧席？
漸進(jìn)增強(qiáng)progressive enhancement：針對(duì)低版本瀏覽器進(jìn)行構(gòu)建頁(yè)面擦盾，保證最基本的功能，然后再針對(duì)高級(jí)瀏覽器進(jìn)行效果淌哟、交互等改進(jìn)和追加功能達(dá)到更好的用戶體驗(yàn)迹卢。
優(yōu)雅降級(jí)graceful degradation：一開始就構(gòu)建完整的功能，然后再針對(duì)低版本瀏覽器進(jìn)行兼容徒仓。
區(qū)別：優(yōu)雅降級(jí)是從復(fù)雜的現(xiàn)狀開始腐碱，并試圖減少用戶體驗(yàn)的供給，而漸進(jìn)增強(qiáng)則是從一個(gè)非车舫冢基礎(chǔ)的症见，能夠起作用的版本開始星持，并不斷擴(kuò)充矾飞，以適應(yīng)未來(lái)環(huán)境的需要。降級(jí)（功能衰減）意味著往回看羹呵；而漸進(jìn)增強(qiáng)則意味著朝前看壁晒，同時(shí)保證其根基處于安全地帶。
css命名規(guī)范
什么是BEM呢业栅？其實(shí)它就是css類的一種命名方式秒咐，由Yandex團(tuán)隊(duì)提出的，不過(guò)也有一些大牛們不喜歡這種命名方式碘裕，認(rèn)為他過(guò)于復(fù)雜携取，冗余，降低了編碼效率帮孔，不過(guò)基于存在即合理雷滋，我們還是有必要了解一下他的命名規(guī)則。
首先來(lái)理解一下什么是
B：即block文兢，這個(gè)block不是css中樣式的block晤斩，而是模塊的意思，將所有的樣式類分成一些模塊姆坚，有點(diǎn)類似于語(yǔ)義化的html澳泵，比如將樣式列分為header，section兼呵，footer等兔辅。
E:Element腊敲，元素，比如說(shuō)這個(gè)組件是按鈕维苔，即可將元素名起為btn碰辅，BEM的命名中只包含三個(gè)部分，元素名只占其中一部分介时，所以不能出現(xiàn)多個(gè)元素名的情況没宾。
M:modefiy，修飾器名潮尝。在編寫前端頁(yè)面代碼的時(shí)候我們經(jīng)常會(huì)遇到以下的狀態(tài)：比如寫一個(gè)下拉菜單榕吼，我們通常會(huì)編一個(gè).active用來(lái)表示當(dāng)前點(diǎn)擊的項(xiàng)，那么勉失，在BEM中羹蚣，這個(gè)就可以放在modefiy中。
總結(jié)的來(lái)說(shuō)乱凿，BEM的命名規(guī)則就是：block-name_element-name--modefiy-name顽素。
同步和異步的區(qū)別
同步就是指一個(gè)進(jìn)程在執(zhí)行某個(gè)請(qǐng)求的時(shí)候，若該請(qǐng)求需要一段時(shí)間才能返回信息徒蟆，那么這個(gè)進(jìn)程將會(huì)一直等待下去胁出，直到收到返回信息才繼續(xù)執(zhí)行下去；異步是指進(jìn)程不需要一直等下去段审，而是繼續(xù)執(zhí)行下面的操作全蝶，不管其他進(jìn)程的狀態(tài)。當(dāng)有消息返回時(shí)系統(tǒng)會(huì)通知進(jìn)程進(jìn)行處理寺枉，這樣可以提高執(zhí)行的效率抑淫。
js創(chuàng)建對(duì)象的幾種方式
https://blog.csdn.net/dinglang_2009/article/details/7913866
（1） 簡(jiǎn)單對(duì)象的創(chuàng)建 使用對(duì)象字面量的方式{} 創(chuàng)建一個(gè)對(duì)象（最簡(jiǎn)單，好理解姥闪，推薦使用）
（2）用function(函數(shù))來(lái)模擬class (無(wú)參構(gòu)造函數(shù))創(chuàng)建一個(gè)對(duì)象始苇，相當(dāng)于new一個(gè)類的實(shí)例
可以使用有參構(gòu)造函數(shù)來(lái)實(shí)現(xiàn)，這樣定義更方便筐喳，擴(kuò)展性更強(qiáng)（推薦使用）
（3）使用工廠方式來(lái)創(chuàng)建（Object關(guān)鍵字）
（4）使用原型對(duì)象的方式 prototype關(guān)鍵字
（5）混合模式(原型和構(gòu)造函數(shù))
（6）動(dòng)態(tài)原型的方式(可以看作是混合模式的一種特例)
Ajax解決瀏覽器的緩存問(wèn)題
今天做項(xiàng)目催式，幾乎所有的提交都是通過(guò)ajax來(lái)提交，我測(cè)試的時(shí)候發(fā)現(xiàn)避归，每次提交后得到的數(shù)據(jù)都是一樣的荣月，調(diào)試可以排除后臺(tái)代碼的問(wèn)題，所以問(wèn)題肯定是出在前臺(tái)槐脏。每次清除緩存后喉童，就會(huì)得到一個(gè)新的數(shù)據(jù)，所以歸根到底就是瀏覽器緩存問(wèn)題。糾結(jié)了很久堂氯，終于解決了蔑担，在這里總結(jié)一下。我們都知道ajax能提高頁(yè)面載入的速度主要的原因是通過(guò)ajax減少了重復(fù)數(shù)據(jù)的載入咽白，也就是說(shuō)在載入數(shù)據(jù)的同時(shí)將數(shù)據(jù)緩存到內(nèi)存中啤握，一旦數(shù)據(jù)被加載其中，只要我們沒(méi)有刷新頁(yè)面晶框，這些數(shù)據(jù)就會(huì)一直被緩存在內(nèi)存中排抬，當(dāng)我們提交 的URL與歷史的URL一致時(shí)，就不需要提交給服務(wù)器授段，也就是不需要從服務(wù)器上面去獲取數(shù)據(jù)蹲蒲，雖然這樣降低了服務(wù)器的負(fù)載提高了用戶的體驗(yàn)，但是我們不能獲取最新的數(shù)據(jù)侵贵。為了保證我們讀取的信息都是最新的届搁，我們就需要禁止他的緩存功能
解決方案有如下幾種：
1、在ajax發(fā)送請(qǐng)求前加上 anyAjaxObj.setRequestHeader("If-Modified-Since","0")窍育。
2卡睦、在ajax發(fā)送請(qǐng)求前加上 anyAjaxObj.setRequestHeader("Cache-Control","no-cache")。
3漱抓、在URL后面加上一個(gè)隨機(jī)數(shù)： "fresh=" + Math.random();表锻。
4、在URL后面加上時(shí)間搓："nowtime=" + new Date().getTime();乞娄。
5瞬逊、如果是使用jQuery，直接這樣就可以了$.ajaxSetup({cache:false})仪或。這樣頁(yè)面的所有ajax都會(huì)執(zhí)行這條語(yǔ)句就是不需要保存緩存記錄码耐。
