本文是我學(xué)習(xí)JavaScript過程中收集與整理的一些易錯知識點迫皱,
將分別從變量作用域,類型比較,this指向椅您,函數(shù)參數(shù),閉包問題及對象拷貝與賦值這6個方面進行由淺入深的介紹和講解寡键,
其中也涉及了一些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ù)即可氯迂。