apply,call,bind:添加鏈接描述
js包裝對象:添加鏈接描述
JS屬性描述對象:添加鏈接描述
數據類型概述:添加鏈接描述
js語言的對象體系,不是基於類的,而是基於構造函數和原型鏈。JavaScript 語言使用構造函數(constructor)作爲對象的模板。所謂”構造函數”,就是專門用來生成實例對象的函數。它就是對象的模板,描述實例對象的基本結構。一個構造函數,可以生成多個實例對象,這些實例對象都有相同的結構。
構造函數就是一個普通的函數,但是有自己的特徵和用法。
var Vehicle = function () {
this.price = 1000;
};
上面代碼中,Vehicle就是構造函數。爲了與普通函數區別,構造函數名字的第一個字母通常大寫。
構造函數的特點有兩個:
函數體內部使用了this關鍵字,代表了所要生成的對象實例。
生成對象的時候,必須使用new命令。
new命令的作用,就是執行構造函數,返回一個實例對象。
var Vehicle = function () {
this.price = 1000;
};
var v = new Vehicle();
v.price // 1000
上面代碼通過new命令,讓構造函數Vehicle生成一個實例對象,保存在變量v中。這個新生成的實例對象,從構造函數Vehicle得到了price屬性。new命令執行時,構造函數內部的this,就代表了新生成的實例對象,this.price表示實例對象有一個price屬性,值是1000。
爲了保證構造函數必須與new命令一起使用,一個解決方法是,構造函數內部使用嚴格模式,即第一行加上,use strict;這樣的話,一旦忘記使用new命令,直接調用構造函數就會報錯。
function Fubar(foo, bar){
'use strict';
this._foo = foo;
this._bar = bar;
}
Fubar()
// TypeError: Cannot set property '_foo' of undefined
上面代碼的Fubar爲構造函數,use strict命令保證了該函數在嚴格模式下運行。由於嚴格模式中,函數內部的this不能指向全局對象,默認等於undefined,導致不加new調用會報錯(JavaScript 不允許對undefined添加屬性)。
另一個解決辦法,構造函數內部判斷是否使用new命令,如果發現沒有使用,則直接返回一個實例對象。
function Fubar(foo, bar) {
if (!(this instanceof Fubar)) {
return new Fubar(foo, bar);
}
this._foo = foo;
this._bar = bar;
}
Fubar(1, 2)._foo // 1
(new Fubar(1, 2))._foo // 1
上面代碼中的構造函數,不管加不加new命令,都會得到同樣的結果。
new命令的原理:
使用new命令時,它後面的函數依次執行下面的步驟:
1:創建一個空對象,作爲將要返回對象的實例。
2:將這個空對象的原型,指向構造函數的prototype屬性。
3:將這個空對象賦值給函數內部的this關鍵字。
4:開始執行構造函數內部的代碼。
也就是說,構造函數內部,this指的是一個新生成的空對象,所有針對this的操作,都會發生在這個空對象上。構造函數之所以叫構造函數,就是說這個函數的目的,就是操作一個空對象(即this對象),將其構造成需要的樣子。
如果構造函數內部有return語句,而且return後面跟着一個對象,new命令會返回return語句指定的對象,否則,就不會管return語句,返回this對象。
var Vehicle = function () {
this.price = 1000;
return 1000;
};
(new Vehicle()) === 1000 // false
上面代碼中,構造函數Vehicle的return返回一個數值。這時,new命令就會忽略這個return語句,返回構造後的this對象。
但是,如果return語句返回的是一個跟this無關的新對象,new命令就會返回這個新對象,而不是this對象,這一點需要特別注意。
var Vehicle = function (){
this.price = 1000;
return { price: 2000 };
};
(new Vehicle()).price // 2000
上面代碼中,構造函數Vehicle的return語句,返回的是一個新對象,new命令就會返回這個新對象,而不是this對象。
JS面向對象—this關鍵字:添加鏈接描述
JS Storage接口:添加鏈接描述
window對象可以接收以下事件:
load事件發生在文檔在瀏覽器窗口加載完畢時。window.onload屬性可以指定這個事件的回調函數。
window.onload = function() {
var elements = document.getElementsByClassName('example');
for (var i = 0; i < elements.length; i++) {
var elt = elements[i];
// ...
}
};
上面代碼在網頁加載完畢後,獲取指定元素並進行處理。
JS 同源限制:添加鏈接描述
JS數據類型—數組:添加鏈接描述
JS面向對象—Object對象的相關方法:添加鏈接描述
JS異步操作—概述:添加鏈接描述
JS異步操作—定時器:添加鏈接描述
JS Array 對象:添加鏈接描述
DOM—Mutation Observer API:添加鏈接描述
DOM—Text節點和DocumentFragment節點:添加鏈接描述
DOM—屬性的操作:添加鏈接描述
DOM—Element節點:添加鏈接描述
DOM—Document節點:添加鏈接描述
DOM—ParentNode接口,ChildNode接口:添加鏈接描述