今天面試回來寞焙，稍微整理下今天被問到的題目储狭，呀，回答的是亂七八糟捣郊，最后百度整理下辽狈，以供以后學(xué)習(xí)。
1,vue 中事件的生命周期
vue中事件的生命周期呛牲，從開始創(chuàng)建刮萌、初始化數(shù)據(jù)、編譯模板娘扩、掛載Dom着茸、渲染→更新→渲染壮锻、卸載等一系列過程，我們稱這是Vue的生命周期涮阔。通俗說就是Vue實例從創(chuàng)建到銷毀的過程猜绣，就是生命周期。
beforeCreate
在實例初始化之后敬特，數(shù)據(jù)觀測(data observer) 和 event/watcher 事件配置之前被調(diào)用掰邢。
created
實例已經(jīng)創(chuàng)建完成之后被調(diào)用。在這一步伟阔，實例已完成以下的配置：數(shù)據(jù)觀測(data observer)辣之，屬性和方法的運算， watch/event 事件回調(diào)皱炉。然而怀估，掛載階段還沒開始，$el 屬性目前不可見合搅。
beforeMount
在掛載開始之前被調(diào)用：相關(guān)的 render 函數(shù)首次被調(diào)用奏夫。
mounted
el 被新創(chuàng)建的 vm.$el 替換，并掛載到實例上去之后調(diào)用該鉤子历筝。如果 root 實例掛載了一個文檔內(nèi)元素酗昼，當(dāng) mounted 被調(diào)用時 vm.$el 也在文檔內(nèi)。
beforeUpdate
數(shù)據(jù)更新時調(diào)用梳猪，發(fā)生在虛擬 DOM 重新渲染和打補丁之前麻削。
你可以在這個鉤子中進一步地更改狀態(tài)，這不會觸發(fā)附加的重渲染過程春弥。
updated
由于數(shù)據(jù)更改導(dǎo)致的虛擬 DOM 重新渲染和打補丁呛哟，在這之后會調(diào)用該鉤子。
當(dāng)這個鉤子被調(diào)用時匿沛，組件 DOM 已經(jīng)更新扫责，所以你現(xiàn)在可以執(zhí)行依賴于 DOM 的操作。然而在大多數(shù)情況下逃呼，你應(yīng)該避免在此期間更改狀態(tài)鳖孤，因為這可能會導(dǎo)致更新無限循環(huán)。
該鉤子在服務(wù)器端渲染期間不被調(diào)用抡笼。
beforeDestroy
實例銷毀之前調(diào)用苏揣。在這一步，實例仍然完全可用推姻。
destroyed
Vue 實例銷毀后調(diào)用平匈。調(diào)用后，Vue 實例指示的所有東西都會解綁定，所有的事件監(jiān)聽器會被移除增炭，所有的子實例也會被銷毀忍燥。
該鉤子在服務(wù)器端渲染期間不被調(diào)用。
2,ajax如何把異步請求變?yōu)橥降?/p>
function ajax()
{
var backData;
$.ajax(
type:”post”,
data:{},
async:false,//更改為同步
).done(//相當(dāng)于sucess
function(response){
backData=response;
});
return backData;
}
var newData=ajax();
此時newData=response;
在此過程中注意修改async隙姿，它如果是true（默認）梅垄，那么就是在異步的情況下，這種情況下實現(xiàn)return是不能實現(xiàn)的孟辑，因為異步就說明了程序的執(zhí)行順序和效果發(fā)生了改變哎甲。修改為同步蔫敲，實現(xiàn)返回值饲嗽。
3,bootstrap是按照什么劃分格柵系統(tǒng)的
根據(jù)父級的寬度，來自適應(yīng)寬度
如果是col-lg是大屏是(≥1200px)奈嘿，col-md (≥992px),col-sm (≥768px) ,col-xs (<768px),按照父級寬度貌虾，然后自己是幾個col 就各占多少百分比
4,怎么理解事件代理的？
事件代理又叫事件委托裙犹，有以下結(jié)構(gòu)<ul><li><a></a></li> ?<li><a></a></li></ul> ?加入每次點擊a就要去進行a的一些操作尽狠，我們?nèi)绻衒or循環(huán)，每次點擊叶圃，就要找一遍a袄膏，這樣會影響頁面的性能，我們利用事件委托就可以大大提高頁面的性能掺冠，相關(guān)代碼如下
$("ul li").click(function(){
alert();
})
事件委托就是利用事件冒泡的原理來實現(xiàn)的沉馆，當(dāng)點擊a的時候，就會往上傳遞德崭，到li再到UI斥黑，因為ul上有點擊事件，所以事件就會觸發(fā)眉厨。
起因：
1锌奴、這是前端面試的經(jīng)典題型，要去找工作的小伙伴看看還是有幫助的憾股；
2鹿蜀、其實我一直都沒弄明白，寫這個一是為了備忘服球，二是給其他的知其然不知其所以然的小伙伴們以參考耻姥；
概述：
那什么叫事件委托呢？它還有一個名字叫事件代理有咨，JavaScript高級程序設(shè)計上講：事件委托就是利用事件冒泡琐簇，只指定一個事件處理程序，就可以管理某一類型的所有事件。那這是什么意思呢婉商？網(wǎng)上的各位大牛們講事件委托基本上都用了同一個例子似忧，就是取快遞來解釋這個現(xiàn)象，我仔細揣摩了一下丈秩，這個例子還真是恰當(dāng)盯捌，我就不去想別的例子來解釋了，借花獻佛蘑秽，我摘過來饺著，大家認真領(lǐng)會一下事件委托到底是一個什么原理：
有三個同事預(yù)計會在周一收到快遞。為簽收快遞肠牲，有兩種辦法：一是三個人在公司門口等快遞幼衰；二是委托給前臺MM代為簽收。現(xiàn)實當(dāng)中缀雳，我們大都采用委托的方案（公司也不會容忍那么多員工站在門口就為了等快遞）渡嚣。前臺MM收到快遞后，她會判斷收件人是誰肥印，然后按照收件人的要求簽收识椰，甚至代為付款。這種方案還有一個優(yōu)勢深碱，那就是即使公司里來了新員工（不管多少）腹鹉，前臺MM也會在收到寄給新員工的快遞后核實并代為簽收。
這里其實還有2層意思的：
第一敷硅，現(xiàn)在委托前臺的同事是可以代為簽收的功咒，即程序中的現(xiàn)有的dom節(jié)點是有事件的；
第二竞膳，新員工也是可以被前臺MM代為簽收的航瞭，即程序中新添加的dom節(jié)點也是有事件的。
為什么要用事件委托：
一般來說坦辟，dom需要有事件處理程序刊侯，我們都會直接給它設(shè)事件處理程序就好了，那如果是很多的dom需要添加事件處理呢锉走？比如我們有100個li滨彻，每個li都有相同的click點擊事件，可能我們會用for循環(huán)的方法挪蹭，來遍歷所有的li亭饵，然后給它們添加事件，那這么做會存在什么影響呢梁厉？
在JavaScript中辜羊，添加到頁面上的事件處理程序數(shù)量將直接關(guān)系到頁面的整體運行性能踏兜，因為需要不斷的與dom節(jié)點進行交互，訪問dom的次數(shù)越多八秃，引起瀏覽器重繪與重排的次數(shù)也就越多碱妆，就會延長整個頁面的交互就緒時間，這就是為什么性能優(yōu)化的主要思想之一就是減少DOM操作的原因昔驱；如果要用事件委托疹尾，就會將所有的操作放到j(luò)s程序里面，與dom的操作就只需要交互一次骤肛，這樣就能大大的減少與dom的交互次數(shù)纳本，提高性能；
每個函數(shù)都是一個對象腋颠，是對象就會占用內(nèi)存繁成，對象越多，內(nèi)存占用率就越大秕豫，自然性能就越差了（內(nèi)存不夠用朴艰，是硬傷观蓄，哈哈）混移，比如上面的100個li，就要占用100個內(nèi)存空間侮穿，如果是1000個歌径，10000個呢，那只能說呵呵了亲茅，如果用事件委托回铛，那么我們就可以只對它的父級（如果只有一個父級）這一個對象進行操作，這樣我們就需要一個內(nèi)存空間就夠了克锣，是不是省了很多茵肃，自然性能就會更好。
事件委托的原理：
事件委托是利用事件的冒泡原理來實現(xiàn)的袭祟，何為事件冒泡呢验残？就是事件從最深的節(jié)點開始，然后逐步向上傳播事件巾乳，舉個例子：頁面上有這么一個節(jié)點樹您没，div>ul>li>a;比如給最里面的a加一個click點擊事件，那么這個事件就會一層一層的往外執(zhí)行胆绊，執(zhí)行順序a>li>ul>div氨鹏，有這樣一個機制，那么我們給最外面的div加點擊事件压状，那么里面的ul仆抵，li，a做點擊事件的時候，都會冒泡到最外層的div上镣丑，所以都會觸發(fā)还栓，這就是事件委托，委托它們父級代為執(zhí)行事件传轰。
事件委托怎么實現(xiàn)：
終于到了本文的核心部分了剩盒，哈哈，在介紹事件委托的方法之前慨蛙，我們先來看一段一般方法的例子：
子節(jié)點實現(xiàn)相同的功能：
111
222
333
444
實現(xiàn)功能是點擊li辽聊，彈出123：
window.onload =function(){varoUl = document.getElementById("ul1");varaLi = oUl.getElementsByTagName('li');for(vari=0;i
aLi[i].onclick=function(){
alert(123);
}
}
}
上面的代碼的意思很簡單，相信很多人都是這么實現(xiàn)的期贫，我們看看有多少次的dom操作跟匆，首先要找到ul，然后遍歷li通砍，然后點擊li的時候玛臂，又要找一次目標(biāo)的li的位置，才能執(zhí)行最后的操作封孙，每次點擊都要找一次li迹冤；
那么我們用事件委托的方式做又會怎么樣呢？
window.onload =function(){varoUl = document.getElementById("ul1");
oUl.onclick=function(){
alert(123);
}
}
這里用父級ul做事件處理虎忌，當(dāng)li被點擊時泡徙，由于冒泡原理，事件就會冒泡到ul上膜蠢，因為ul上有點擊事件堪藐，所以事件就會觸發(fā)，當(dāng)然挑围，這里當(dāng)點擊ul的時候礁竞，也是會觸發(fā)的，那么問題就來了杉辙，如果我想讓事件代理的效果跟直接給節(jié)點的事件效果一樣怎么辦模捂，比如說只有點擊li才會觸發(fā)，不怕奏瞬，我們有絕招：
Event對象提供了一個屬性叫target枫绅，可以返回事件的目標(biāo)節(jié)點，我們成為事件源硼端，也就是說并淋，target就可以表示為當(dāng)前的事件操作的dom，但是不是真正操作dom珍昨，當(dāng)然县耽，這個是有兼容性的句喷，標(biāo)準(zhǔn)瀏覽器用ev.target，IE瀏覽器用event.srcElement兔毙，此時只是獲取了當(dāng)前節(jié)點的位置唾琼，并不知道是什么節(jié)點名稱，這里我們用nodeName來獲取具體是什么標(biāo)簽名澎剥，這個返回的是一個大寫的锡溯，我們需要轉(zhuǎn)成小寫再做比較（習(xí)慣問題）：
window.onload = function(){
var oUl = document.getElementById("ul1");
oUl.onclick = function(ev){
var ev = ev || window.event;
var target = ev.target || ev.srcElement;
if(target.nodeName.toLowerCase() == 'li'){
alert(123);
alert(target.innerHTML);
}
}
}
這樣改下就只有點擊li會觸發(fā)事件了，且每次只執(zhí)行一次dom操作哑姚，如果li數(shù)量很多的話祭饭，將大大減少dom的操作，優(yōu)化的性能可想而知叙量！
上面的例子是說li操作的是同樣的效果倡蝙，要是每個li被點擊的效果都不一樣，那么用事件委托還有用嗎绞佩？
window.onload =function(){varAdd = document.getElementById("add");varRemove = document.getElementById("remove");varMove = document.getElementById("move");varSelect = document.getElementById("select");
Add.onclick=function(){
alert('添加');
};
Remove.onclick=function(){
alert('刪除');
};
Move.onclick=function(){
alert('移動');
};
Select.onclick=function(){
alert('選擇');
}
}
上面實現(xiàn)的效果我就不多說了寺鸥，很簡單，4個按鈕品山，點擊每一個做不同的操作胆建，那么至少需要4次dom操作正驻，如果用事件委托直撤，能進行優(yōu)化嗎？
window.onload =function(){varoBox = document.getElementById("box");
oBox.onclick=function(ev) {varev = ev ||window.event;vartarget = ev.target ||ev.srcElement;if(target.nodeName.toLocaleLowerCase() == 'input'){switch(target.id){case'add':
alert('添加');break;case'remove':
alert('刪除');break;case'move':
alert('移動');break;case'select':
alert('選擇');break;
}
}
}
}
用事件委托就可以只用一次dom操作就能完成所有的效果，比上面的性能肯定是要好一些的
現(xiàn)在講的都是document加載完成的現(xiàn)有dom節(jié)點下的操作酸些，那么如果是新增的節(jié)點，新增的節(jié)點會有事件嗎檐蚜？也就是說魄懂，一個新員工來了，他能收到快遞嗎闯第？
看一下正常的添加節(jié)點的方法：
111
222
333
444
現(xiàn)在是移入li市栗，li變紅，移出li咳短，li變白填帽，這么一個效果，然后點擊按鈕咙好，可以向ul中添加一個li子節(jié)點
window.onload =function(){varoBtn = document.getElementById("btn");varoUl = document.getElementById("ul1");varaLi = oUl.getElementsByTagName('li');varnum = 4;//鼠標(biāo)移入變紅篡腌，移出變白for(vari=0; i
aLi[i].onmouseover=function(){this.style.background = 'red';
};
aLi[i].onmouseout=function(){this.style.background = '#fff';
}
}//添加新節(jié)點oBtn.onclick =function(){
num++;varoLi = document.createElement('li');
oLi.innerHTML= 111*num;
oUl.appendChild(oLi);
};
}
這是一般的做法，但是你會發(fā)現(xiàn)勾效，新增的li是沒有事件的嘹悼，說明添加子節(jié)點的時候叛甫，事件沒有一起添加進去，這不是我們想要的結(jié)果杨伙，那怎么做呢其监？一般的解決方案會是這樣，將for循環(huán)用一個函數(shù)包起來限匣，命名為mHover抖苦，如下：
window.onload =function(){varoBtn = document.getElementById("btn");varoUl = document.getElementById("ul1");varaLi = oUl.getElementsByTagName('li');varnum = 4;functionmHover () {//鼠標(biāo)移入變紅，移出變白for(vari=0; i
aLi[i].onmouseover=function(){this.style.background = 'red';
};
aLi[i].onmouseout=function(){this.style.background = '#fff';
}
}
}
mHover ();//添加新節(jié)點oBtn.onclick =function(){
num++;varoLi = document.createElement('li');
oLi.innerHTML= 111*num;
oUl.appendChild(oLi);
mHover ();
};
}
雖然功能實現(xiàn)了米死，看著還挺好睛约，但實際上無疑是又增加了一個dom操作，在優(yōu)化性能方面是不可取的哲身，那么有事件委托的方式辩涝，能做到優(yōu)化嗎？
window.onload =function(){varoBtn = document.getElementById("btn");varoUl = document.getElementById("ul1");varaLi = oUl.getElementsByTagName('li');varnum = 4;//事件委托勘天，添加的子元素也有事件oUl.onmouseover =function(ev){varev = ev ||window.event;vartarget = ev.target ||ev.srcElement;if(target.nodeName.toLowerCase() == 'li'){
target.style.background= "red";
}
};
oUl.onmouseout=function(ev){varev = ev ||window.event;vartarget = ev.target ||ev.srcElement;if(target.nodeName.toLowerCase() == 'li'){
target.style.background= "#fff";
}
};//添加新節(jié)點oBtn.onclick =function(){
num++;varoLi = document.createElement('li');
oLi.innerHTML= 111*num;
oUl.appendChild(oLi);
};
}
看怔揩，上面是用事件委托的方式，新添加的子元素是帶有事件效果的脯丝，我們可以發(fā)現(xiàn)商膊，當(dāng)用事件委托的時候，根本就不需要去遍歷元素的子節(jié)點宠进，只需要給父級元素添加事件就好了晕拆，其他的都是在js里面的執(zhí)行，這樣可以大大的減少dom操作材蹬，這才是事件委托的精髓所在实幕。
--------------------------------------------------華麗的分割線-------------- -----------------------------------------------------------------------------------------------------
在這里先感謝一下@蒼茫大地NV 的提問，提的問題非常好堤器！??????
他的問題是：
現(xiàn)在給一個場景 ul > li > div > p昆庇，div占滿li，p占?滿div闸溃，還是給ul綁定時間整吆，需要判斷點擊的是不是li（假設(shè)li里面的結(jié)構(gòu)是不固定的），那么e.target就可能是p辉川，也有可能是div表蝙，這種情況你會怎么處理呢？
那我們現(xiàn)在就再現(xiàn)一下他給的場景
11111111111
22222222
3333333333
4444444
如上列表乓旗，有4個li府蛇，里面的內(nèi)容各不相同，點擊li寸齐，event對象肯定是當(dāng)前點擊的對象欲诺，怎么指定到li上抄谐，下面我直接給解決方案：
varoUl = document.getElementById('test');
oUl.addEventListener('click',function(ev){vartarget =ev.target;while(target !==oUl ){if(target.tagName.toLowerCase() == 'li'){
console.log('li click~');break;
}
target=target.parentNode;
}
})
核心代碼是while循環(huán)部分，實際上就是一個遞歸調(diào)用扰法，你也可以寫成一個函數(shù)蛹含，用遞歸的方法來調(diào)用，同時用到冒泡的原理塞颁，從里往外冒泡浦箱，知道currentTarget為止，當(dāng)當(dāng)前的target是li的時候祠锣，就可以執(zhí)行對應(yīng)的事件了酷窥，然后終止循環(huán)，恩伴网，沒毛才钔啤！
詳細鏈接：http://www.cnblogs.com/liugang-vip/p/5616484.html
5,vue組件中是用什么來傳遞事件的
@emit
6,對git的了解程度
1.float的原理及在平時工作中遇到的float帶來的缺陷
2.flex布局的原理及優(yōu)缺點
5.怎么理解閉包澡腾？
7.
