javascript易錯知識點總結(jié)

本文是我學(xué)習(xí)JavaScript過程中收集與整理的一些易錯知識點,

將分別從變量作用域,類型比較,this指向,函數(shù)參數(shù),閉包問題及對象拷貝與賦值這6個方面進(jìn)行由淺入深的介紹和講解,

其中也涉及了一些ES6的知識點。

var a = 1;

function test(){

var a = 2;

console.log(a) //輸出的值為:2

}

test()

//上方的函數(shù)作用域中聲明并賦值了a 在控制臺下 輸出的結(jié)果遵循就近原則 所以為2

//局部變量? 與 全局變量有所區(qū)別

var a? =1;

function test2(){

console.log(a) //undefine

var a = 2;

}

test2()

//上方的函數(shù)作用域中雖然聲明并賦值了a,但位于console之下,a變量被提升,輸出時已聲明但尚未被賦值,所以輸出“undefined”。

var a = 1;

function test3(){

console.log(a) //1

a = 2;

}

test3()

//上方的函數(shù)作用域中a被重新賦值,未被重新聲明,且位于console之下,所以輸出全局作用域中的a。

let b = 1;

function test4(){

console.log(b); //b is not defind

let b = 2;

}

test4()

// 上方的函數(shù) 用到es6的新語法 let來聲明變量 b,而let不同于var其不存在變量提升功能,所以輸出報錯b is not defind

function test5(){

let a = 1;

{

let b = 2;

}

console.log(a); //1

}

test5()

//上方的函數(shù)作用域中用let聲明了a為1,并在塊級作用域中聲明了a為2,因為console并不在函數(shù)內(nèi)的塊級作用域中,所以輸出1。

//2類型比較

var arr = [],

var2 = [1];

console.log(arr === arr2); //false

//以上因為兩個單獨的數(shù)組比較,所以console.log為false

var arr? =[];

arr2 = {};

console.log(arr === arr2); //false

//上方兩個相同的數(shù)組比較,因為兩個單獨的數(shù)組永不相等,所以console為false。

var arr =[];

arr2 = {};

console.log(typeof(arr)===typeof(arr2)); //ture

//上方利用typeof比較數(shù)組和對象,因為typeof獲取NULL、數(shù)組、對象的類型都為object,所以console為true。

var arr = [];

console.log(arr instanceof Object); // true

console.log(arr instanceof Array); // true

//上方利用instanceof判斷一個變量是否屬于某個對象的實例,因為在JavaScript中數(shù)組也是對象的一種,所以兩個console都為true。

//this指向問題

var obj ={

name:"xiaoming";

getname:function(){

return? this.name

}

}

console.log(obj.getname());//xiaoming

//上方對象方法中的this指向?qū)ο蟊旧恚暂敵?xiaoming"。

//閉包問題

var elem = document.getElementsByTagName('div'); // 如果頁面上有5個div

for(var i = 0; i < elem.length; i++) {

elem[i].onclick = function () {

alert(i); // 總是5

};

}

//上方是一個很常見閉包問題,點擊任何div彈出的值總是5,因為當(dāng)你觸發(fā)點擊事件的時候i的值早已是5,可以用下面方式解決:

var elem = document.getElementsByTagName('div'); // 如果頁面上有5個div

for(var i = 0; i < elem.length; i++) {

(function (w) {

elem[w].onclick = function () {

alert(w); // 依次為0,1,2,3,4

};

})(i);

}

//在綁定點擊事件外部封裝一個立即執(zhí)行函數(shù),并將i傳入該函數(shù)即可。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

推薦閱讀更多精彩內(nèi)容