`

JS一维数组、多维数组和对象的混合使用

 
阅读更多

 

引言

       这篇文章的主要目的是讲解JavaScript数组和对象的混合使用,由于js的弱检查特性,因此在JS数组中可以同时存储不同类型的变量,比如你可以把数字、字符串、字符、对象等内容放在同一个数组中。对象也可以做同样的事情,区别是对象可以指定对象里每一个成员的别名,这样在编程的时候数据更易读,比如:

       var arr1 = ["飞鱼", 25, 172, "江苏"];

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

       这样,person.name是不是比arr1[0]更易读,更易使用?当然数组和对象各有优势,本文的重点是将二者的优势结合起来,综合使用。

 

一维数组

 

下面的代码创建名为 cars 的数组:先创建数组,再一一赋值

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"];

 

上面是一维数组的三种创建方式。由于JS的弱检查性,你可以在一维数组中放不同类型的变量。

 

二维和多维数组:

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

对象:

 

对象由花括号分隔。在括号内部,对象的属性以名称和值对的形式 (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个学院属性,而每个学院属性又是一个包含多个系的数组,这就是一个典型的多维数组和对象混合使用的例子,可以简单明了的说明和列表学校、学院和系之间的级别、归属和数量关系。

 

http://blog.csdn.net/wangyuchun_799/article/details/38460515

 

 

分享到:
评论

相关推荐

    js一维数组、多维数组和对象的混合使用方法.docx

    本文将深入探讨一维数组、多维数组以及对象的混合使用方法。 首先,一维数组是最基本的数组形式,允许我们存储同类型或不同类型的值。例如: ```javascript var arr1 = ["飞鱼", 25, 172, "江苏"]; ``` 这里,`...

    js一维数组、多维数组和对象的混合使用方法

    综上所述,一维数组、多维数组和对象的混合使用在JavaScript中是相当灵活的。正确地掌握它们的使用方法,将有助于在实际的编程工作中构建更为高效、易读的数据结构。在混合使用数组和对象时,重要的是要考虑数据的...

    MATLAB中数组长度获取.md

    除了处理一维数组外,`length`函数还可以应用于多维数组。在这种情况下,`length`函数会返回数组第一个维度的长度。例如: ```matlab % 创建一个多维数组 array_2d = [1, 2, 3; 4, 5, 6; 7, 8, 9]; % 获取多维数组...

    MATLAB中数组和矩阵的区别.md

    例如,可以通过reshape函数将一维数组转换为特定形状的矩阵。 #### 数组与矩阵的应用场景 - **数组**: - 处理和分析多维数据集,如图像处理中的像素值数组。 - 存储不同类型的变量集合,如包含字符串、数字和...

    有答案初级软件工程师(Java)客观试题

    ` 创建了一个二维数组 `a`,它由 5 个一维数组组成,每个一维数组包含 7 个整数元素。因此,`a` 是一个二维数组。故正确答案为 B。 ### 3. Java 内部类的理解 **知识点概述:** - **静态内部类:**Java 中的静态...

    VBScript 语言参考

    在VBScript中,可以声明一维或多维数组,如`Dim arr(10)`声明了一个包含11个元素的一维数组。 6. **对象和集合** VBScript支持COM(Component Object Model)对象,如IE浏览器对象用于自动化测试,...

    韩顺平PHP JS JQUERY 所有视频下载种子 货真价实

    10-25 1 jquery框架 jquery对象与dom对象区别及混合使用 10-25 2 jquery id选择器 层次选择器 10-25 3 jquery过滤选择器及练习题讲解 10-25 4 内容过滤器 可见度过滤器及练习讲解 10-26 1 课程回顾 10-26 2 属性过滤...

    VBSCRIPT 速查手册

    4. **数组**:VBScript中的数组是变长的,可以使用一维或多维数组。`Redim`语句用于动态调整数组大小。 5. **字符串操作**:VBScript提供了丰富的字符串处理函数,如`Mid`(提取子串)、`Left`和`Right`(提取左侧...

    史上最全韩顺平传智播客PHP就业班视频,10月份全集

    10-25 1 jquery框架 jquery对象与dom对象区别及混合使用 10-25 2 jquery id选择器 层次选择器 10-25 3 jquery过滤选择器及练习题讲解 10-25 4 内容过滤器 可见度过滤器及练习讲解 10-26 1 课程回顾 10-26 2 属性过滤...

    史上最全传智播客PHP就业班视频课,8月份视频

    10-25 1 jquery框架 jquery对象与dom对象区别及混合使用 10-25 2 jquery id选择器 层次选择器 10-25 3 jquery过滤选择器及练习题讲解 10-25 4 内容过滤器 可见度过滤器及练习讲解 10-26 1 课程回顾 10-26 2 属性过滤...

    史上最全韩顺平传智播客PHP就业班视频,9月份全集

    10-25 1 jquery框架 jquery对象与dom对象区别及混合使用 10-25 2 jquery id选择器 层次选择器 10-25 3 jquery过滤选择器及练习题讲解 10-25 4 内容过滤器 可见度过滤器及练习讲解 10-26 1 课程回顾 10-26 2 属性过滤...

    (全)传智播客PHP就业班视频完整课程

    10-25 1 jquery框架 jquery对象与dom对象区别及混合使用 10-25 2 jquery id选择器 层次选择器 10-25 3 jquery过滤选择器及练习题讲解 10-25 4 内容过滤器 可见度过滤器及练习讲解 10-26 1 课程回顾 10-26 2 属性过滤...

    2021-2022计算机二级等级考试试题及答案No.4650.docx

    3. VFP数组:Visual FoxPro(VFP)支持一维和二维数组,甚至更复杂的多维数组。 4. 二叉树遍历:二叉树的遍历有三种主要方式:前序遍历、中序遍历和后序遍历。根据后序和中序遍历,可以确定前序遍历序列。 5. ...

    2021-2022计算机二级等级考试试题及答案No.17576.docx

    20. 二维数组定义中,`int a[][3]={{1,3,5},{2}};`是正确的,它定义了一个两行三列的数组,并初始化了部分元素。 以上是对试卷中涉及的计算机二级等级考试知识点的详细解释,涵盖了编程语言特性、数据库操作、网络...

    ES10 特性的完整指南小结

    - `Array.prototype.flat()`: 平展多维数组,使得深嵌套的数组可以轻松合并成一维数组。 - `Array.prototype.flatMap()`: 结合了`map()`和`flat()`,先应用映射函数,然后将结果扁平化。 4. **其他新增特性**: -...

    begin_php:PHP入门

    5. **数组操作**:理解一维数组、多维数组的声明和遍历方法。 6. **函数**:定义和调用函数,了解内置函数和自定义函数的区别。 7. **字符串处理**:学会字符串拼接、查找、替换、截取等操作。 8. **文件操作**:...

    Try2Pick-web

    4. **数组处理**:PHP对数组处理非常强大,支持一维、多维数组,以及关联数组。有许多内置函数如`array_push`、`array_pop`、`count`等来操作数组。 5. **文件操作**:PHP可以读写文件,目录操作,如创建、删除、...

Global site tag (gtag.js) - Google Analytics