1. Call 和 Apply 的區(qū)別

語法：
function.call(thisObj [, arg1[, arg2[, [, ...argN]]]]);
function.apply(thisObj [, argArray] )；

定義： call 和 apply 可以讓我們手動設(shè)置 this 指向
兩個參數(shù)： 第一個參數(shù)是 綁定 this 指向；第二個參數(shù)是 向?qū)⒁獔?zhí)行的函數(shù)傳遞的參數(shù)
區(qū)別： 第二個參數(shù)， call 以一個一個的形式傳遞參數(shù)；apply 以數(shù)組的形式傳遞參數(shù)

vara = 10;functionsum(num1, num2) { console.log(this.a + num1 +num2); }varobj ={ a:20} sum(10, 10);//30sum.call(obj, 10, 10);//40sum.apply(obj, [10, 10]);//40

2. 鍵盤事件屬性

3. 鼠標(biāo)事件屬性

4. addEventListener 和 attachEvent 區(qū)別

attachEvent方法適用于IE
attachEvent中的事件帶on， 而addEventListener中的事件不帶on
attachEvent 方法有兩個參數(shù)：第一個參數(shù)為事件名稱，第二個參數(shù)為接收事件處理的函數(shù)； addEventListener 方法有三個參數(shù)：第一個參數(shù)為事件名稱（不含 on，如 "click"），第二個參數(shù)為要接收事件處理的函數(shù)，第三個參數(shù)為一個bool值，默認(rèn)為false

1. 添加多個事件處理程序執(zhí)行的順序不同

addEventListener：varbtn=document.getElementById("myBtn"); btn.addEventListener("click",function(){ alert(1); },false); btn.addEventListener("click",function(){ alert(2); },false);//執(zhí)行結(jié)果 1 ，2

attachEvent：varbtn=document.getElementById("myBtn"); btn.attachEvent("onclick",function(){ alert(1); }); btn.attachEvent("onclick",function(){ alert(2); });//執(zhí)行結(jié)果 2 ，1

2. 事件處理程序的作用域不同

DOM2級事件添加的事件處理程序，它的作用域是所屬的元素，而IE的事件處理程序會在全局作用域中運(yùn)行。

3. 移除綁定事件 removeEventListener() 和 detachEvent()

移除 addEventListener 事件： element.removeEventListene(event,function, useCapture) event: 事件名，注意不使用“on”前綴，如 clickfunction: 指定事件觸發(fā)時執(zhí)行的函數(shù) useCapture: 指定事件是否在捕獲或冒泡階段執(zhí)行true: 在捕獲階段執(zhí)行false: 在冒泡階段進(jìn)行，默認(rèn)值為false 如果添加時用的捕獲階段，那么在移除時也要用捕獲階段，否則無法移除它們 如果是同一個元素同一個調(diào)用函數(shù)同一個useCapture值綁定多次，在移除時只需要執(zhí)行一次移除

5. addEventListener 和 on 區(qū)別

window.onload =function(){varbox = document.getElementById("box"); box.onclick=function(){ console.log("我是box1"); } box.onclick=function(){ console.log("我是box2"); } }//運(yùn)行結(jié)果：“我是box2”

window.onload =function(){varbox = document.getElementById("box"); box.addEventListener("click",function(){ console.log("我是box1"); }) box.addEventListener("click",function(){ console.log("我是box2"); }) } 運(yùn)行結(jié)果：我是box1 　　　　　我是box2

第二個onclick會把第一個onclick給覆蓋了，雖然大部分情況我們用on就可以完成我們想要的結(jié)果，但是有時我們又需要執(zhí)行多個相同的事件，很明顯如果用on完成不了我們想要的，而addEventListener可以多次綁定同一個事件并且不會覆蓋上一個事件。

6. HTML5 新增的事件

contextmenu事件
這個事件是當(dāng)鼠標(biāo)右擊的時候觸發(fā)的，但是觸發(fā)這個屬性的時候默認(rèn)的行為也會被觸發(fā)，所以需要通過preventDefault()方法來阻止。

beforeunload事件
beforeunload在頁面卸載之前觸發(fā)，該事件會彈出一個對話框，詢問是否確定離開。

hashchange事件
該事件當(dāng)URL中的hash值改變時觸發(fā)，通常用于Ajax應(yīng)用中利用URL參數(shù)保存導(dǎo)航信息；這個在前端路由的制作中是非常有用得。

7. 阻止事件默認(rèn)行為和阻止事件冒泡

標(biāo)準(zhǔn)瀏覽器的使用方法

preventDefault(): 用于阻止事件的默認(rèn)行為;
比如： a 鏈接的跳轉(zhuǎn)行為和表單自動提交行為　　

stopPropagation(): 用于阻止事件的進(jìn)一步獲取和傳播;
比如：阻止事件繼續(xù)向上層冒泡

varbtn = document.getElementById("btn"), wrap= document.getElementById("wrap"); btn.addEventListener("click",function(event){ alert("btn"); event.stopPropagation(); },false); wrap.addEventListener("click",function(){ alert("wrap"); },false);//點擊btn時，這樣就阻止了id="btn"向上級id="wrap"冒泡，打印出來的結(jié)果是：彈窗僅彈出btn。否則，將會先彈出btn，然后彈出wrap。

低版本IE瀏覽器的使用方法

示例

functionprevent(event) { event= event ||window.event;if(event.preventDefault) { event.preventDefault(); }else{ event.returnValue=false; } }//使用 if else 去判斷

8. 事件捕獲和事件冒泡

事件冒泡執(zhí)行過程：從最具體的的元素（你單擊的那個元素）開始向上開始冒泡，下面的案例的順序是：content > wrap
事件捕獲執(zhí)行過程：從最不具體的元素（最外面的那個盒子）開始向里面冒泡，下面的案例的順序是：wrap > content

(addEventListener第三個參數(shù)寫的是false， 默認(rèn)為false)window.onload=function(){varwrap= document.getElementById("wrap");varcontent= document.getElementById("content"); wrap.addEventListener("click",function(){ console.log("我是wrap"); },false) content.addEventListener("click",function(){ console.log("我是content"); }) } 運(yùn)行結(jié)果：我是content 　　　　　我是wrap

(addEventListener第三個參數(shù)寫的是true， 默認(rèn)為false)window.onload=function(){varwrap= document.getElementById("wrap");varcontent= document.getElementById("content"); wrap.addEventListener("click",function(){ console.log("我是wrap"); },true) content.addEventListener("click",function(){ console.log("我是content"); }) } 運(yùn)行結(jié)果：我是wrap 　　　　　我是content

第三個參數(shù)寫的是true，則按照事件捕獲的執(zhí)行順序進(jìn)行。

9. 給 select 標(biāo)簽 option 內(nèi)容加鏈接

10. Null 和 Undefined

undefined 表示根本不存在定義
null 表示一個值被定義了，定義為“空值”

（1）變量被聲明了，但沒有賦值時，就等于undefined。
（2）調(diào)用函數(shù)時，應(yīng)該提供的參數(shù)沒有提供，該參數(shù)等于undefined。
（3）對象沒有賦值的屬性，該屬性的值為undefined。
（4）函數(shù)沒有返回值時，默認(rèn)返回undefined。

所以設(shè)置一個值為 null 是合理的，如
objA.valueA = null;

但設(shè)置一個值為 undefined 是不合理的，如
objA.valueA = undefined; // 應(yīng)該直接使用 delete objA.valueA; 任何一個存在引用的變量值為undefined都是一件錯誤的事情。
這樣判斷一個值是否存在，就可以用
objA.valueA === undefined // 不應(yīng)使用 null 因為 undefined == null，而 null 表示該值定義為空值。

　　哈爾濱品用軟件有限公司致力于為哈爾濱的中小企業(yè)制作大氣、美觀的優(yōu)秀網(wǎng)站，并且能夠搭建符合百度排名規(guī)范的網(wǎng)站基底，使您的網(wǎng)站無需額外費(fèi)用，即可穩(wěn)步提升排名至首頁。歡迎體驗最佳的哈爾濱網(wǎng)站建設(shè)。