js一維數(shù)組、多維數(shù)組和對象的混合使用方法
來源:易賢網(wǎng) 閱讀:1144 次 日期:2016-07-08 15:56:07
溫馨提示:易賢網(wǎng)小編為您整理了“js一維數(shù)組、多維數(shù)組和對象的混合使用方法”,方便廣大網(wǎng)友查閱!

這篇文章的主要目的是講解JavaScript數(shù)組和對象的混合使用,由于JS的弱檢查特性,因此在JS數(shù)組中可以同時存儲不同類型的變量,比如你可以把數(shù)字、字符串、字符、對象等內(nèi)容放在同一個數(shù)組中。對象也可以做同樣的事情,區(qū)別是對象可以指定對象里每一個成員的別名,這樣在編程的時候數(shù)據(jù)更易讀,比如:

var arr1 = ["飛魚", 25, 172, "江蘇"];

var person = {name:"飛魚",age: 25, height:172,province: "江蘇"};

這樣,person.name是不是比arr1[0]更易讀,更易使用?當然數(shù)組和對象各有優(yōu)勢,本文的重點是將二者的優(yōu)勢結(jié)合起來,綜合使用。

一維數(shù)組

下面的代碼創(chuàng)建名為 cars 的數(shù)組:先創(chuàng)建數(shù)組,再一一賦值

var cars=new Array();

cars[0]="Audi";

cars[1]="BMW";

cars[2]="Volvo";

或者 (condensed array):在創(chuàng)建數(shù)組對象的時候賦值

代碼如下:

var cars=new Array("Audi","BMW","Volvo");

或者 (literal array):不創(chuàng)建變量,直接輔助,不過注意創(chuàng)建對象時用的小括號“( )”,而直接賦值時用的是方括號“[ ]”,這個一不小心就容易出錯。

實例

代碼如下:

var cars=["Audi","BMW","Volvo"];

上面是一維數(shù)組的三種創(chuàng)建方式。由于JS的弱檢查性,你可以在一維數(shù)組中放不同類型的變量。

二維和多維數(shù)組:

1、 創(chuàng)建二維數(shù)組方法一:先創(chuàng)建一個一維數(shù)組,然后該一維數(shù)組的所有成員再創(chuàng)建一維數(shù)據(jù)

var persons = new Array();

persons[0] = new Array();

persons[1] = new Array();

persons[2] = new Array();

persons[0][0] = "zhangsan";

persons[0][1] = 25;

persons[1][0] = "lisi";

persons[1][1] = 22;

persons[2][0] = "wangwu";

persons[2][1] = 32;

persons[0] = ["zhangsan", 25];

persons[1] = ["lisi", 21];

persons[2] = ["wangwu", 32];

相比較上一種方法,這個要簡單易讀多了。

代碼如下:

persons.length = 3

2、創(chuàng)建二維數(shù)組方法二:先創(chuàng)建一個一維數(shù)組,然后該一維數(shù)組的所有成員直接賦值

代碼如下:

var persons = new Array();

3、創(chuàng)建二維數(shù)組方法三:直接賦值

代碼如下:

var persons = [["zhangsan", 25], ["lisi", 21], ["wangwu", 32]];

4、總結(jié)

第一種和第二種方法雖然麻煩一些,但貴在可以先創(chuàng)建一個空的多維數(shù)組,然后在for循環(huán)中根據(jù)自己的需求進行賦值。第三種方法對于枚舉數(shù)據(jù)來說就比較簡單易用了。

二維數(shù)組的最后一個問題,就是二維數(shù)組或多維數(shù)組的長度是多少?我們測試一下下面的代碼:

代碼如下:

document.write("persons = " + persons + "<br />persons.length = " + persons.length);

輸出的結(jié)果是:

persons = zhangsan,25,lisi,21,wangwu,32

也就是說,多維數(shù)組的length屬性返回的是多維數(shù)組第一維的長度,而不是多維數(shù)組中元素的個數(shù)。

5、如何返回多維數(shù)組的元素個數(shù)

如下數(shù)組:

代碼如下:

var persons = [["zhangsan", 25], ["lisi", 21], ["wangwu", 32]];

通過維數(shù)(此處是3)乘以每維元素的個數(shù)(此處是2)就可以得出該多維數(shù)組的元素個數(shù)是6了。但是這并不是保險的做法,因為多維數(shù)組中每一個維度的元素個數(shù)是可以不一樣的,如:

代碼如下:

var persons = [["zhangsan", 25], ["lisi", 21, 172], ["wangwu", 32]];

該數(shù)組的第一維的第二個元素數(shù)組包含三個元素,其他的只有兩個,這再使用length來計算還是3,因為第一維的元素個數(shù)沒變嘛。但是再使用上面的方法計算該多維數(shù)組的元素個數(shù)就不對了。

因此多維數(shù)組的length屬性和一維數(shù)組一樣,永遠返回第一維數(shù)組的元素個數(shù)。計算多維數(shù)組的元素個數(shù),可以自己創(chuàng)建一個或多個嵌套for循環(huán)來計算,如:

在知道數(shù)組的維度的情況下,可以針對該數(shù)組寫算法,如二維數(shù)組:

var persons = [["zhangsan", 25], ["lisi", 21], ["wangwu", 32]];

function getArr2ElementNum(arr) {

var eleNum = 0;

if (arr == null) {

return 0;

}

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

for (var j = 0; j < arr[i].length; j++) {

eleNum++;

}

}

return eleNum;

}

alert(getArr2ElementNum(persons));

在多維數(shù)組維度過多,嵌套復雜時,通過上面的方法來寫針對的算法就太累了,特別是當這個復雜的多維數(shù)組還可能隨時變換維度的情況下。如下這個復雜的多重嵌套的多維數(shù)組:

var arrN = [["zhangsan", 25, [1, "wangyuchu", 54, [123, 34, 16]], 43], ["lisi", 21, 172], ["wangwu", 32, "suzhou"]];

甚至,有些多維嵌套數(shù)組比這個還復雜,那怎么計算數(shù)組元素個數(shù)呢,我寫了一個求數(shù)組元素個數(shù)的函數(shù),不管是一維還多維,也不管是多么復雜的嵌套多維數(shù)組,都可以計算出來,算法不麻煩,主要用到了遞歸的理念:

//判斷某個對象是不是數(shù)組

function isArray(obj) {

return obj && ( typeof obj === 'object') && (obj.constructor == Array);

}

//eleNum變量初始值為0,用來統(tǒng)計數(shù)組元素個數(shù)

var eleNum = 0;

//遞歸計算某個數(shù)組元素是不是下一維數(shù)組,如果是,則繼續(xù)遞歸下去;如果不是,統(tǒng)計元素個數(shù)。

function recursion(obj) {

if (isArray(obj)) {

for (var j = 0; j < obj.length; j++) {

if (!isArray(obj[j])) {

eleNum++;

continue;

}

recursion(obj[j]);

}

} else {

eleNum++;

}

}

//arr為要計算數(shù)組元素個數(shù)的一維或多維數(shù)組,通過調(diào)用遞歸函數(shù)recursion返回數(shù)組元素個數(shù)

function getArrNElementNum(arr) {

if (arr == null) {

return 0;

}

recursion(arr);

return eleNum;

}

//隨意定義一個復雜的多維嵌套數(shù)組

var arrN = [["zhangsan", 25, [1, "wangyuchu", 54, [123, 34, 16]], 43], ["lisi", 21, 172], ["wangwu", 32, "suzhou"]];

//打印出來數(shù)組元素個數(shù)

alert(getArrNElementNum(arrN));

對象:

對象由花括號分隔。在括號內(nèi)部,對象的屬性以名稱和值對的形式 (name : value) 來定義。屬性由逗號分隔:

代碼如下:

var person={firstname:"Bill", lastname:"Gates", id:5566};

上面例子中的對象 (person) 有三個屬性:firstname、lastname 以及 id。

空格和折行無關緊要。聲明可橫跨多行:

var person={

firstname : "Bill",

lastname : "Gates",

id    : 5566

};

對象屬性有兩種尋址方式:

實例

name=person.lastname;

name=person["lastname"];

對象和多維數(shù)組的混合使用:

想象這么一個場景,要枚舉并統(tǒng)計清華大學(qinghua)、北京大學(beida)、浙江大學(zheda)三所大學一共有多少個系,怎么做?

首先,建立一個數(shù)組,數(shù)組中包括著三所學校:

代碼如下:

var departments = [qinghua, beida, zheda];

每個學校又有很多不同或相同的學院(xx),如何表示?在這里就要用到數(shù)組包含對象了:

代碼如下:

var departments = [qinghua{xx1, xx2, xx3}, beida{xx4, xx5,

 xx6, xx7}, zheda{xx8, xx9}];

每個學院又有不同的系(d),如何表示?

代碼如下:

var departments = [qinghua{xx1:[d1, d2], xx2[d3, d5],

 xx3:[d7, d8]}, beida{xx4, xx5, xx6, xx7}, zheda{xx8,

 xx9}];

 //只是舉個例子,后面兩個大學我就不表示了

上述例子就是一個數(shù)組,該數(shù)組的元素是學校對象,學校對象有N個學院屬性,而每個學院屬性又是一個包含多個系的數(shù)組,這就是一個典型的多維數(shù)組和對象混合使用的例子,可以簡單明了的說明和列表學校、學院和系之間的級別、歸屬和數(shù)量關系。

更多信息請查看網(wǎng)絡編程

2025國考·省考課程試聽報名

  • 報班類型
  • 姓名
  • 手機號
  • 驗證碼
關于我們 | 聯(lián)系我們 | 人才招聘 | 網(wǎng)站聲明 | 網(wǎng)站幫助 | 非正式的簡要咨詢 | 簡要咨詢須知 | 新媒體/短視頻平臺 | 手機站點 | 投訴建議
工業(yè)和信息化部備案號:滇ICP備2023014141號-1 云南省教育廳備案號:云教ICP備0901021 滇公網(wǎng)安備53010202001879號 人力資源服務許可證:(云)人服證字(2023)第0102001523號
聯(lián)系電話:0871-65099533/13759567129 獲取招聘考試信息及咨詢關注公眾號:hfpxwx
咨詢QQ:1093837350(9:00—18:00)版權(quán)所有:易賢網(wǎng)