- 相關(guān)推薦
javascript學(xué)習筆記--數組和對象
javascript對象部分
一：基礎部分
1.JavaScript 中所有變量都是對象，除了兩個(gè)例外 null 和 undefined。
2.Jscript 支持四種類(lèi)型的對象：內部對象、生成的對象、宿主給出的對象（所有BOM和DOM對象都是宿主對象。）以及 ActiveX 對象（外部組件）。
3.Microsoft Jscript 提供了 11 個(gè)內部（或“內置”）對象。它們是Array、Boolean、Date、Function、Global、Math、Number、Object、RegExp、Error 以及 String 對象。
4.對象只是一種特殊的數據。對象擁有屬性和方法。 JavaScript 是面向對象的語(yǔ)言，但 JavaScript 不使用類(lèi)。 JavaScript 基于 prototype，而不是基于類(lèi)的。
5.屬性：是隸屬于某個(gè)特定對象的變量。方法：是只有某個(gè)特定對象才能調用的函數。
6.Jscript 對象是屬性和方法的集合。一個(gè)方法就是一個(gè)函數，是對象的成員。屬性是一個(gè)值或一組值（以數組或對象的形式），是對象的成員。
7.javascript對象是基于構造器函數的，使用構造器函數創(chuàng )建一個(gè)新對象時(shí)，就可以說(shuō)是實(shí)例化了一個(gè)新對象。屬性是構造器函數內部的變量。
使用構造器函數實(shí)例化的對象：
cat = new Animal();
8.Javascript是一種基于對象（object-based）的語(yǔ)言，你遇到的所有東西幾乎都是對象。但是，它又不是一種真正的面向對象編程（OOP）語(yǔ)言，因為它的語(yǔ)法中沒(méi)有class（類(lèi)）。
復制代碼 代碼如下:
復制代碼 代碼如下:
//通過(guò)點(diǎn)號（.）或“[]”來(lái)訪(fǎng)問(wèn)對象的屬性
browser.name //"Firefox"
browser["kernel"] //"Gecko"
對象（objct）是屬性（property）的集合，每個(gè)屬性都由“名/值對”構成，js同樣定義了一個(gè)特殊的對象——數組，它是帶有編號的值的有序集合。js還定義了一個(gè)特殊的對象——函數，函數是具有與他相關(guān)聯(lián)的可執行代碼的對象，通過(guò)調用函數來(lái)執行代碼，并返回運算結果。
理清概念：
JS中"基于對象=面向對象"4.JS中沒(méi)有類(lèi)(Class)，但是它取了一個(gè)新的名字叫“原型對象”，因此"類(lèi)=原型對象"
二：類(lèi)(原型對象)和對象(實(shí)例)的區別與聯(lián)系###
1.類(lèi)(原型對象)是抽象，是概念的，代表一類(lèi)事物。
2.對象是具體的，實(shí)際的，代表一個(gè)具體的事物。
3.類(lèi)(原型對象)是對象實(shí)例的模板，對象實(shí)例是類(lèi)的一個(gè)個(gè)體。
一個(gè)常見(jiàn)的誤解是數字的字面值（literal）不是對象。這是因為 JavaScript 解析器的一個(gè)錯誤，它試圖將點(diǎn)操作符解析為浮點(diǎn)數字面值的一部分。
有很多變通方法可以讓數字的字面值看起來(lái)像對象。
2..toString(); // 第二個(gè)點(diǎn)號可以正常解析
2 .toString(); // 注意點(diǎn)號前面的空格
(2).toString(); // 2先被計算
刪除屬性
刪除屬性的唯一方法是使用 操作符；設置屬性為 undefined 或者 null 并不能真正的刪除屬性，而僅僅是移除了屬性和值的關(guān)聯(lián)。
JavaScript面向對象三大特征
封裝：不考慮內部實(shí)現，只考慮功能使用
繼承：從已有對象上，繼承出新的對象
多態(tài)：所謂多態(tài)，就是指一個(gè)引用在不同情況下的多種狀態(tài)，
1.封裝
封裝就是要把屬于同一類(lèi)事物的共性(包括屬性與行為)歸到一個(gè)類(lèi)中,以方便使用.比如人這個(gè)東東,可用下面的方式封裝:
人{
年齡(屬性一)
身高(屬性二)
性別(屬性三)
做事(行為之一)
走路(行為之二)
說(shuō)話(huà)(行為之三)
}
封裝的好處：
封裝保護了內部數據的完整性；
封裝使對象的重構更輕松；
弱化模塊間的耦合，提高對象的可重用性；
有助于避免命名空間沖突；
看下面一個(gè)例子：
復制代碼 代碼如下:
這就是最簡(jiǎn)單的封裝了，把兩個(gè)屬性封裝在一個(gè)對象里面。但是，這樣的寫(xiě)法有兩個(gè)缺點(diǎn)，一是如果多生成幾個(gè)實(shí)例，寫(xiě)起來(lái)就非常麻煩；二是實(shí)例與原型之間，沒(méi)有任何辦法，可以看出有什么聯(lián)系。
構造函數模式
為了解決從原型對象生成實(shí)例的問(wèn)題，Javascript提供了一個(gè)構造函數（Constructor）模式。
所謂"構造函數"，其實(shí)就是一個(gè)普通函數，但是內部使用了this變量。對構造函數使用new運算符，就能生成實(shí)例，并且this變量會(huì )綁定在實(shí)例對象上。
比如boy和girl的原型對象現在就可以這樣寫(xiě)：
復制代碼 代碼如下:
我們現在就可以生成實(shí)例對象了。
復制代碼 代碼如下:
這時(shí)Boy和girl會(huì )自動(dòng)含有一個(gè)constructor屬性，指向它們的構造函數。
復制代碼 代碼如下:
alert(boy.constructor == Person); //true
alert(girl.constructor == Person); //true
Prototype模式 Javascript規定，每一個(gè)構造函數都有一個(gè)prototype屬性，指向另一個(gè)對象。這個(gè)對象的所有屬性和方法，都會(huì )被構造函數的實(shí)例繼承。
這意味著(zhù)，我們可以把那些不變的屬性和方法，直接定義在prototype對象上。
復制代碼 代碼如下:
然后，生成實(shí)例:
復制代碼 代碼如下:
這時(shí)所有實(shí)例的type屬性和eat()方法，其實(shí)都是同一個(gè)內存地址，指向prototype對象，因此就提高了運行效率。
alert(boy.eat == girl.eat); //true
原型屬性是一個(gè)內置屬性，它指定了對象所擴展的構造器函數。
下面的代碼為Animal構造器函數添加一個(gè)新的屬性size，這個(gè)新屬性是cat對象的原型屬性。通過(guò)使用原型屬性，所有擴展Animal構造器函數的對象就可以訪(fǎng)問(wèn)size屬性
cat = new Animal("feline","meow", "walk/run");
cat.prototype.size = "fat";
在這種情況下，所有的Animal對象的size屬性都是“fat”。原型默認為Object的新實(shí)例, 由于仍是對象, 故可以給該對象添加新的屬性。就好像style是javascript的一個(gè)對象一樣，也可以往style后繼續添加屬性。
復制代碼 代碼如下:
對象在查找某個(gè)屬性的時(shí)候，會(huì )首先遍歷自身的屬性，如果沒(méi)有則會(huì )繼續查找[[Prototype]]引用的對象，如果再沒(méi)有則繼續查找[[Prototype]].[[Prototype]]引用的對象，依次類(lèi)推，直到[[Prototype]].….[[Prototype]]為undefined（Object的[[Prototype]]就是undefined）
簡(jiǎn)單說(shuō)就是通過(guò)對象的[[Prototype]]保存對另一個(gè)對象的引用，通過(guò)這個(gè)引用往上進(jìn)行屬性的查找，這就是原型鏈。
全局的window對象
JavaScript中的任何一個(gè)全局函數或變量都是window的屬性。
self對象與window對象完全相同，self通常用于確認就是在當前的窗體內。
window的主對象主要有如下幾個(gè)：
JavaScript document 對象
JavaScript frames 對象
JavaScript history 對象
JavaScript location 對象
JavaScript navigator 對象
JavaScript screen 對象
幾個(gè)常用方法
valueof()方法：返回指定對象的原始值
split() 方法將字符串分割為字符串數組，并返回此數組。
indexOf() 方法可返回某個(gè)指定的字符串值在字符串中首次出現的位置。
substring() 方法用于提取字符串中介于兩個(gè)指定下標之間的字符。
substr() 方法從字符串中提取從 startPos位置開(kāi)始的指定數目的字符串。
join()方法用于把數組中的所有元素放入一個(gè)字符串。
arrayObject.join(分隔符)
reverse() 方法用于顛倒數組中元素的順序。
slice() 方法可從已有的數組中返回選定的元素。
對象字面量
對象字面量是用于創(chuàng )建包含大量屬性的過(guò)程，
復制代碼 代碼如下:
這里需要注意的是屬性和屬性值以冒號(:)隔開(kāi)；多個(gè)屬性用逗號(,)隔開(kāi)。對象字面量亦可以定義方法，只需在這個(gè)對象的屬性上寫(xiě)上function就行，這是一個(gè)匿名函數，調用它只需要寫(xiě)上他的方法名()即可。
復制代碼 代碼如下:
javascript數組部分
1.Array 對象
Array 對象：提供對創(chuàng )建任何數據類(lèi)型的數組的支持。
復制代碼 代碼如下:
arrayObj = new Array()
arrayObj = new Array([size])
arrayObj = new Array([element0[, element1[, ...[, elementN]]]])
定義：var arr = [2,3,45,6]; var arr = new Array(2,4,5,7)
兩者是定義沒(méi)有任何差別，[]的性能高，因為代碼短。
使用數組和對象字面量：var aTest = []；創(chuàng )建數組時(shí)，使用數組字面量是個(gè)好選擇；類(lèi)似的，對象字面量也可用于節省空間。以下兩行是相等的，但是使用對象字面量的更加簡(jiǎn)短：
var oTest = new Object; //盡量不用
var oTest = { }; //最好的選擇，或者var 0Test = [ ];
遍歷為了達到遍歷數組的最佳性能，推薦使用經(jīng)典的 for 循環(huán)。
復制代碼 代碼如下:
var list = [1, 2, 3, 4, 5, ...... 100000000];
for(var i = 0, l = list.length; i < l; i++) {
console.log(list[i]);
}
上面代碼有一個(gè)處理，就是通過(guò) l = list.length 來(lái)緩存數組的長(cháng)度。
Array 構造函數
由于 Array 的構造函數在如何處理參數時(shí)有點(diǎn)模棱兩可，因此總是推薦使用數組的字面語(yǔ)法 - [] - 來(lái)創(chuàng )建數組。
因此下面的代碼將會(huì )使人很迷惑：
new Array(3, 4, 5); // 結果: [3, 4, 5]
new Array(3) // 結果: []，此數組長(cháng)度為 3
應該盡量避免使用數組構造函數創(chuàng )建新數組。推薦使用數組的字面語(yǔ)法。它們更加短小和簡(jiǎn)潔，因此增加了代碼的可讀性。
Array數組的屬性
Array數組的3個(gè)屬性：length屬性、prototype屬性、constructor屬性
1.length屬性
Length屬性表示數組的長(cháng)度，即其中元素的個(gè)數。因為數組的索引總是由0開(kāi)始，所以一個(gè)數組的上下限分別是：0和length-1。和其他大多數語(yǔ)言不同的是，JavaScript數組的length屬性是可變的，這一點(diǎn)需要特別注意。
2.prototype屬性
返回對象類(lèi)型原型的引用。prototype屬性是object共有的。
對于A(yíng)rray數組對象，以以下例子說(shuō)明prototype屬性的用途。
給數組對象添加返回數組中最大元素值的方法。要完成這一點(diǎn)，聲明一個(gè)函數，將它加入Array.prototype，并使用它。
復制代碼 代碼如下:
function array_max()
{
var i,max=this[0];
for(i=1;i<this.length;i++)
{
if(max<this[i])
max=this[i];
}
return max;
}
Array.prototype.max=array_max;
var x=new Array(1,2,3,4,5,6);
var y=x.max();
該代碼執行后，y保存數組x中的最大值，或說(shuō)6。
3.constructor屬性
表示創(chuàng )建對象的函數。說(shuō)明：constructor屬性是所有具有prototype的對象的成員。它們包括除Global和Math對象以外的所有JScript固有對象。constructor屬性保存了對構造特定對象實(shí)例的函數的引用。
例如：
復制代碼 代碼如下:
x = new String("Hi");
if(x.constructor==String) //進(jìn)行處理（條件為真）。
//或
function MyFunc{
//函數體。
}
y=new MyFunc;
if(y.constructor==MyFunc)//進(jìn)行處理（條件為真）。
對于數組來(lái)說(shuō)：
y = new Array();
數組方法：
附上一張數組的思維導圖：
【javascript學(xué)習筆記--數組和對象】相關(guān)文章：
JavaScript學(xué)習筆記08-24
JavaScript數組常用方法介紹09-04
關(guān)于javascript對象之內置和對象Math的使用方法10-08
Javascript中arguments對象的詳解和使用方法08-20
javascript克隆對象深度介紹07-25
關(guān)于數據類(lèi)型的Javascript學(xué)習筆記08-05
JavaScript中的三種對象10-24