晚上面試螞蟻金服，前端，覺得大廠問(wèn)的問(wèn)題就是不一樣，有縱向有橫向，針對(duì)下列幾個(gè)問(wèn)題，我面試時(shí)候答的不好，現(xiàn)在重新學(xué)習(xí)，沉思一會(huì)...

第一個(gè)問(wèn)題：

1、先問(wèn)熟悉jq嗎？解釋一下jq的架構(gòu)，

　　jq源碼的 new jQuery 中return jQuery.fn.init

　　jQuery.extend 與jq.fn.exend的區(qū)別：jQuery.extend只給jQuery構(gòu)造函數(shù)的擴(kuò)展，而jQuery.fn.exend，是給jQuery構(gòu)造函數(shù)的原型擴(kuò)展方法

2、說(shuō)一下jq的事件綁定

　　on bind?delegate

3、完了嗎？

　　就這些。

4、先說(shuō)下事件綁定，監(jiān)聽，委托的區(qū)別

window.onload =function(){var btn4 = document.getElementById("btn4");btn4.onclick = function(){console.log(1); // 不執(zhí)行}btn4.onclick = function(){console.log(2); //執(zhí)行}}

　　事件綁定：只執(zhí)行第二個(gè)事件?

window.onload =function(){var btn4 = document.getElementById("btn4");btn4.addEventListener("click",hello1)btn4.addEventListener("click",hello2)}function hello1(){alert("hello 1");}function hello2(){alert("hello 2");}

　　監(jiān)聽事件：兩次事件都執(zhí)行

window.onload = function(){var li = document.getElementsByTagName("li");var body = document.getElementById("body");for(var i = 0;i<li.length;i++){(function(i){li[i].onclick=function(){console.log(this.innerHTML);}})(i)}var newLi = document.createElement("li");newLi.innerHTML = "4";body.appendChild(newLi);}

　　事件綁定：傳統(tǒng)事件無(wú)法就添加的元素加事件

window.οnlοad=function(){var body = document.getElementById("body");var li = document.getElementsByTagName("li");document.addEventListener("click",function(event){event = event || window.event;var target = event.target || event.srcElement;// console.log(target);for(var i=0;i<li.length;i++){(function(i){if(target == li[i]){console.log(target.innerHTML);}})(i)}})var newLi = document.createElement("li");newLi.innerHTML = "4";body.appendChild(newLi);}

　　　　事件委托：事件委托可以給新添加的元素加事件

　　　　事件委托的含原理：事件執(zhí)行，事件冒泡，把事件加到父元素或根元素上面去，誰(shuí)觸發(fā)執(zhí)行誰(shuí)的效果，document觸發(fā)執(zhí)行ducument觸發(fā)的結(jié)果，li觸發(fā)執(zhí)行l(wèi)i觸發(fā)的結(jié)果

5、說(shuō)下jquery on和bind的區(qū)別

　　bind 和on都支持綁定多個(gè)事件，但是bind不支持事件委托，也就是無(wú)發(fā)在新增加的元素中綁定同一事件，而on可以事件委托，

$(document).ready(function(){$("li").bind( "click",function(){console.log(this.innerHTML);})var li = document.createElement("li");li.innerHTML = "4";$("body").append(li); })

　　　　用bind綁定事件，無(wú)法事件委托，新產(chǎn)生的標(biāo)簽無(wú)法綁定click事件

$(document).ready(function(){$("body").on("click","li",function(){console.log(this.innerHTML);})var li = document.createElement("li");li.innerHTML = "4";$("body").append(li); })

　　　用on綁定事件，可以事件委托，新產(chǎn)生的標(biāo)簽可以綁定click事件

$(document).ready(function(){$("body").delegate("li","click",function(){console.log(this.innerHTML);})var li = document.createElement("li");li.innerHTML = "4";$("body").append(li);})

　　用delegate綁定事件，則也可以事件委托，但與on傳入的第一、二個(gè)參數(shù)相反

$(document).ready(function(){$(".clickme").bind("click1", function (event, message1, message2) {alert(message1 + ' ' + message2);}).trigger("click1", ["Hello","World!"]);}) trigger，可指定綁定參數(shù)的形參的值，前提是綁定事件名與trigger的事件名一致

第二個(gè)問(wèn)題：

1、js異步操作有哪些

　　回調(diào)函數(shù)

　　監(jiān)聽事件

　　定時(shí)器

　　ajax

　　Promise?

　　generator （下來(lái)查資料才知道的）

　　async/await（下來(lái)查資料才知道的）

2、分別解釋一下

　　回調(diào)函數(shù)：執(zhí)行一個(gè)函數(shù)時(shí)，在函數(shù)內(nèi)部處理操作，把操作結(jié)果以參數(shù)形式傳入回調(diào)函數(shù)中。

　　監(jiān)聽事件：js操作dom就是事件機(jī)制，可以異步操作，addEventListener("click",function(){},false)

　　定時(shí)器：這個(gè)問(wèn)題我給我自己挖了一個(gè)坑

　　ajax：典型的異步操作

　　Promise：ES6出的異步操作

　　generator：調(diào)用generator就是調(diào)用generator內(nèi)部的指針，調(diào)用generator的next就是讓指針移動(dòng)，可暫停恢復(fù)執(zhí)行，函數(shù)體內(nèi)部數(shù)據(jù)交換，錯(cuò)誤處理，但generaor執(zhí)行必須要執(zhí)行器

　　

轉(zhuǎn)載于:https://www.cnblogs.com/dirkhe/p/7352153.html

總結(jié)

以上是生活随笔為你收集整理的面试 | 蚂蚁金服面试经历的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。