JavaScript 之 核心语法 [ 数组 ]

摘要：数组描述表示可以储存一个或多个数据值的有序集合数组中储存的数据中可以称为元素数组中可以储存任何类型的数据语法字面量方式数组名称元素，元素，构造函数方式数组名称元素元素函数方式数组名称元素元素长度表示数组的长度数组中储存元素的个数当使用

表示可以储存一个或多个数据值的有序集合

数组中储存的数据中可以称为元素

数组中可以储存任何类型的数据

字面量方式 - var 数组名称 = [ 元素， 元素 ， ... ]

构造函数方式 - var 数组名称 = new Array( 元素, 元素, ... )

函数方式 - var 数组名称 = Array( 元素, 元素, ... )

表示数组的长度（数组中储存元素的个数）

当使用构造函数方式或函数方式来定义数组，数组中的元素只有一个，并且为number类型时，表示定义数组的长度

字面量方式不能定义数组的长度

/* 字面量方式 */
var arr1 = [];// 定义数组 - 数组中没有任何元素，称为空数组
console.log( arr1 );// 显示 - []
var arr2 = [ 100, "啊哈哈", true ];
console.log( arr2 );// 显示 - [ 100, "啊哈哈", true ]
var arr9 = [10];// 不能定义数组的长度
console.log( arr9 );// 显示 - [ 10 ]

/* 构造函数方式 */
var arr3 = new Array();
console.log( arr3 );// 显示 - []
var arr4 = new Array( 100, "呀吼吼吼", true );
console.log( arr4 );// 显示 - [ 100, "呀吼吼吼", true ]
var arr5 = new Array( 10 );// 定义数组的长度
console.log( arr5 );// 显示 - [ <10 empty items> ]

/* 函数方式 */
var arr6 = Array();
console.log( arr6 );// 显示 - []
var arr7 = Array( 100, "我的苍天呐", true );
console.log( arr7 );// 显示 - [ 100, "我的苍天呐", true ]
var arr8 = Array( 10 );// 定义数组的长度
console.log( arr8 );// 显示 - [ <10 empty items> ]

可以分为索引数组和关联数组

表示数组中储存元素的位置用数字值来表示

数字值（也可以叫索引值）是从 0 开始

可以根据索引值来添加数组中的元素

JavaScript中定义数组的默认类型为索引数组

/* 索引数组 */
/* 定义一个空数组 */
var arr1 = [];
console.log( arr1 );// 显示 []
/* 为空数组中添加元素 */
arr1[0] = 100;// 根据索引值添加
arr1[1] = "啊哈哈";
arr1[2] = true;
console.log( arr1 );// 显示 [ 100, "啊哈哈", true ]

是索引数组的另一种表现形式

稀疏数组的数组长度和数组中的有效内容不一致

稀疏数组的位置允许不连续，没有定义的位置默认为空（undefined）

/* 稀疏数组 */
var arr2 = [];
/* 为空数组中添加元素 */
arr2[0] = 100;// 允许不按照索引值的顺序进行添加
arr2[4] = 300;
arr2[8] = 500;
console.log( arr2 );// 显示 [ 100, <3 empty items>, 300, <3 empty items>, 500 ]
console.log( arr2.length );// 显示 9（有效数据只有三个）

表示数组中储存元素的位置用字符串来表示

数组的长度（length）对关联数组没有效果

/* 关联数组 */
var arr3 = [];
/* 为空数组中添加元素 */
arr3["name"] = "啊哈哈";// 使用字符串方式添加元素
arr3["nian"] = 100;
arr3["gong"] = "深山";
console.log( arr3 );// 显示 [ name: "啊哈哈", nian: 100, gong: "深山" ]
console.log( arr3.length );// 显示 0（length无效）

表示提取数组中数据值进行显示

如果访问的元素位置未定义过 或 位置为空，提取的数据为 undefined ，语法不报错

通过索引值来提取对应的元素

/* 索引数组 */
var arr1 = [ "啊哈哈", 100, true ];
/* 调用具体位置的元素 */
console.log( arr1[0] );// 显示对应数据内容  啊哈哈
/* 调用未定义位置的元素 */
console.log( arr1[4] );// 显示 undefined

通过索引值来提取对应的元素

/* 稀疏数组 */
var arr2 = [];
arr2[0] = 100;
arr2[4] = 300;
arr2[8] = 500;
/* 调用具体位置的元素 */
console.log( arr2[0] );// 显示对应数据内容  100
/* 调用未定义位置的元素 */
console.log( arr2[5] );// 显示 undefined

通过字符串来提取对应的元素

/* 关联数组 */
var arr3 = [];
arr3["name"] = "啊哈哈";
arr3["nian"] = 100;
arr3["gong"] = "深山";
/* 调用具体位置的元素 */
console.log( arr3["name"] );// 显示对应数据内容  啊哈哈
/* 调用未定义位置的元素 */
console.log( arr3["nm"] );// 显示 undefined

表示对数组中的数据值进行修改

通过数组的索引值找到对应元素的位置，在通过对指定数据进行重新赋值来完成数组修改

/* 索引数组 */
var arr1 = [];
arr1[0] = 100;
arr1[1] = 200;
console.log( arr1 );// 显示 [ 100, 200 ]
/* 对指定元素数据进行修改 */
arr1[0] = 400;
console.log( arr1 );// 显示 [ 400, 200 ]

/* 关联数组 */
var arr2 = [];
arr2["name"] = "啊哈哈";
arr2["nian"] = 100;
arr2["gong"] = "深山";
console.log( arr2 );// 显示 [ name: "啊哈哈", nian: 100, gong: "深山" ]
/* 对指定元素数据进行修改 */
arr2["name"] = "呀吼吼吼";
console.log( arr2 );// 显示 [ name: "呀吼吼吼", nian: 100, gong: "深山" ]

表示对数组中的数据值进行删除

使用delete运算符来删除数据值

但是只删除数据值，不删除数据值所占的位置空间

数组进行删除后会变成稀疏数组

var arr = [ 100, "哈哈哈", true ];
/* 使用delete运算符来对指定数据内容进行删除 */
delete arr [ 1 ];
/* 删除后会只删除数据内容，但不会删除数据所占的位置 */
console.log( arr );//显示结果：[ 100, <1 empty item>, true ]
console.log( arr.length );//显示数组中的数据个数  3

表示一个数组对另一个数组进行复制

复制分为深复制和浅复制

是复制数组中的数据值

如果对复制的数据内容进行修改，不会对复制的数组中的数据值进行修改

/* 深复制：是指对数组中的数据值进行复制 */
var arr1 = [ 100, "呀吼吼", true ];
var arr2 = [];
/* 使用循环语句对数组遍历，获得数组中的数据内容 */
for ( var a = 0; a < arr1.length; a++ ) {
    arr2 [ a ] = arr1 [ a ];//将获得的数据内容复制到另一个数组中
}
/* 显示复制效果 */
console.log( arr2 );// [ 100, "呀吼吼", true ]
/* 如果对复制的数据进行修改原本的数据不会被修改 */
arr2[ 1 ] = "哇哈哈";// 修改数据
console.log( arr2 );// 修改后效果：[ 100, "娃哈哈", true ]
console.log( arr1 );// 修改后效果：[ 100, "呀吼吼", true ]

是复制在数组中储存的内容地址

如果对复制的数据内容进行修改，会同时修改被复制的数组中的数据值

/* 浅复制：是指对数组中存放的内容地址进行复制 */
var arr3 = [ 100, "呀吼吼", true ];
var arr4 = [];
arr4 = arr3;
console.log( arr3 );//显示效果：[ 100, "呀吼吼", true ]
/* 但是要注意如果对数据进行修改会同时修改 */
arr4[ 1 ] = "哇哈哈";//修改数据
console.log( arr4 );//修改后效果：[ 100, "娃哈哈", true ]
console.log( arr3 );//修改后效果：[ 100, "娃哈哈", true ]

通过循环语句来获取数组中的全部数据内容

/* for语句遍历索引数组 */
var arr1 = [ "啊哈哈", 100, true, undefined, null ];
for ( var i = 0; i < arr1.length; i++ ) {
    console.log( arr1[i] );
}

for ( var 变量 in 数组 ) {
    语句块
}

变量 - 表示得到的数组中的数据内容

/* for...in语句遍历索引数组 */
for ( var s in arr1 ) {
    console.log( arr1[s] );
}

for语句

循环的开始和结束，可以由开发人员决定

由于稀疏数组的数组长度和数组的有效内容不一致，遍历出的数据值，不能过滤掉无效数据值

由于关联数组的数组长度无效，所以无法使用for语句进行循环遍历

for...in语句

循环只能从开始到结束

在遍历稀疏数组时可以过滤掉无效数据值，直接得到有效数据值

for...in语句可以对关联数组进行遍历

/* 稀疏数组 */
var arr2 = [];
arr2[0] = 100;
arr2[4] = 300;
arr2[8] = 500;
/* for语句遍历稀疏数组 */
for ( var a = 0; a < arr2.length; a++ ) {
    /* 得到全部数据值，包括无效数据值 */
    console.log( arr2[a]);
}
/* for...in语句遍历稀疏数组 */
for ( var b in arr2 ) {
    /* 可以得到数组中的有效数据值 */
    console.log( arr2[b] );
}

/* 关联数组 */
var arr3 = [];
arr3["name"] = "啊哈哈";
arr3["nian"] = 100;
arr3["gong"] = "深山";
/* for语句遍历关联数组 */
for ( var x = 0; x < arr3.length; x++ ) {
    /* 关联数组没有数组长度，所以无法遍历 */
    console.log( arr3[x] );
}
/* for...in语句遍历关联数组 */
for ( var y in arr3 ) {
    /* 可以遍历到数组中的数据值 */
    console.log( arr3[y] );
}