JavaScript一维数组、多维数组与对象的混合使用详解

JavaScript数组与对象混合使用概述

本文旨在解析JavaScript中数组与对象的混合应用。得益于JavaScript的动态类型特性，数组能够存储多种类型的数据，包括数字、字符串、字符以及对象等。同样，对象也能容纳不同类型的数据，其独特之处在于可以通过属性名（别名）来标识每个成员，从而提升代码的可读性。例如：

var arr1 = ["飞鱼", 25, 172, "江苏"];
var person = {name:"飞鱼",age: 25, height:172,province: "江苏"};

通过属性名访问（如person.name）显然比通过索引访问（如arr1[0]）更具可读性和易用性。尽管数组和对象各有优劣，本文的核心在于结合两者的优势，实现混合使用。

一维数组的创建方式

一维数组的创建

var cars=new Array();
cars[0]="Audi";
cars[1]="BMW";
cars[2]="Volvo";

或者使用缩略写法（condensed array）：在创建数组对象的同时进行赋值。

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

或者使用字面量写法（literal array）：不显式创建变量，直接赋值。需注意，创建数组对象时使用圆括号“( )”，而直接赋值时使用方括号“[ ]”，初学者容易混淆这两者。

实例演示

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

以上展示了一维数组的三种创建方式。由于JavaScript的动态类型特性，你可以在一维数组中混合存储不同类型的变量。

二维与多维数组的构建

二维和多维数组： 1、 创建二维数组方法一：先创建一个一维数组，然后该一维数组的所有成员再创建一维数据

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、创建二维数组方法二：先创建一个一维数组，然后该一维数组的所有成员直接赋值

var persons = new Array();

3、创建二维数组方法三：直接赋值

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

4、总结 第一种和第二种方法虽然步骤较多，但优势在于可以先创建一个空的多维数组，随后在for循环中根据具体需求进行赋值。第三种方法对于枚举数据而言则更加简单直接。 关于二维数组或多维数组的长度问题，我们通过以下代码进行测试：

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

输出的结果是：

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

这表明，多维数组的length属性返回的是第一维的长度，而非所有元素的总个数。

5、如何返回多维数组的元素个数

如下数组：

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

通过维数（此处为3）乘以每维元素的个数（此处为2），可以得出该多维数组的元素个数为6。但这并非绝对可靠，因为多维数组中各维度的元素个数可能不同，例如：

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

该数组的第一维第二个元素包含三个元素，其他元素仅包含两个。此时使用length属性计算仍为3，因为第一维的元素个数未变。但使用上述方法计算总元素个数则不再准确。 因此，多维数组的length属性与一维数组类似，始终返回第一维数组的元素个数。若要计算多维数组的总元素个数，可以手动创建嵌套for循环进行统计，例如： 在已知数组维度的情况下，可以针对该数组编写特定算法，如处理二维数组：

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));

当多维数组维度过多、嵌套复杂时，上述针对特定维度的算法编写起来较为繁琐，特别是当复杂的多维数组维度可能随时变化时。例如以下复杂的多重嵌套多维数组： var arrN = [["zhangsan", 25, [1, "wangyuchu", 54, [123, 34, 16]], 43], ["lisi", 21, 172], ["wangwu", 32, "suzhou"]]; 甚至，有些多维嵌套数组比这更复杂。那么如何计算数组元素个数呢？我编写了一个求数组元素个数的函数，无论是一维还是多维，也不管嵌套多么复杂，都能计算出来。算法并不复杂，主要运用了递归思想： //判断某个对象是不是数组

function isArray(obj) {
return obj && ( typeof obj === 'object') && (obj.constructor == Array);
}

//eleNum变量初始值为0，用来统计数组元素个数
var eleNum = 0;

//递归计算某个数组元素是不是下一维数组，如果是，则继续递归下去；如果不是，统计元素个数。
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为要计算数组元素个数的一维或多维数组，通过调用递归函数recursion返回数组元素个数
function getArrNElementNum(arr) {
if (arr == null) {
return 0;
}

recursion(arr);

return eleNum;
}

//随意定义一个复杂的多维嵌套数组
var arrN = [["zhangsan", 25, [1, "wangyuchu", 54, [123, 34, 16]], 43], ["lisi", 21, 172], ["wangwu", 32, "suzhou"]];
//打印出来数组元素个数
alert(getArrNElementNum(arrN));

JavaScript对象基础

对象： 对象由花括号分隔。在括号内部，对象的属性以名称和值对的形式 (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"];

数组与对象的混合应用实例

对象和多维数组的混合使用： 设想这样一个场景：需要枚举并统计清华大学（qinghua）、北京大学(beida)、浙江大学(zheda)三所大学一共有多少个系，该如何操作？ 首先，建立一个数组，数组中包含三所学校：

var departments = [qinghua, beida, zheda];

每所学校又包含多个不同或相同的学院（xx），如何表示？这里就需要用到数组包含对象：

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}];
//仅作为示例，后两所大学未完全列出

上述示例展示了一个数组，其元素为学校对象。每个学校对象拥有N个学院属性，而每个学院属性又是一个包含多个系的数组。这是一个典型的多维数组和对象混合使用的例子，能够清晰明了地展示学校、学院和系之间的级别、归属和数量关系。