JavaScript 数组基础与常用方法详解

JavaScript 数组基础与定义

一、定义数组。

在 JavaScript 中，创建数组主要包含两种语法形式：

1、var arr1 = []; //定义一个空数组

2、var arr2 = [1,2,3,"str1","str2"]; //定义一个有5个元素的数组。

3、var arr3 = new Array(3); //定义一个空数组

4、var arr4 = new Array(1,2,3,"str1","str2"); //定义一个指定长度为5的数组。

二、数组元素的读和写。

arr[0]; //读取第一个数组元素

arr[0] = "str1"; //改变数组第一个元素的值。

三、稀疏数组。

稀疏数组是指索引从 0 开始但不连续的数组结构。在常规数组中，length 属性通常等于元素个数；而在稀疏数组中，length 属性的值会大于实际存在的元素数量。

使用 in 操作符可以检测指定索引位置是否存在元素，需要注意的是，即使该位置的值是 undefined，in 操作符仍可能返回 true。

例如：var a1 = [,,];

var a2 = new Array(3);

0 in a1; //true,因为a[0]有undefined元素

0 in a2; //false,a2在索引0处没有元素

四、数组长度

length 属性用于标识数组的长度。

例如：var arr = [1,2,3,4,5];

arr.length; //5 arr数组有5个元素

五、数组元素的添加和删除

push: //在数组的末尾添加一个元素

var arr = [1,2,3];

arr.push(4,5); //arr变为[1,2,3,4,5]

delete: //删除数组某个位置的元素

var arr = [1,2,3]

delete arr[1] //arr变为[1,,3]

1 in arr //false

六、数组的遍历

数组遍历通常通过 for 循环语句来实现。

var arr = [1,2,3,4,5];

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

if(!a[i]) continue; //跳过null,undefined和不存在的元素

　　　　}

七、多维数组

多维数组是指数组元素本身仍为数组的结构。

如:var arr = [[1,2,3],[,4,5,6]];

arr[1][1]; // 5

常用数组操作方法

八、数组方法

1、 join() 用于将数组中所有元素都转化为字符串 并连接在一起，还可以自定义连接字符

var arr = [1,2,3];

arr.join(); // => "1,2,3"

arr.join("=="); // => "1==2==3";

2、 reverse() 用于将数组元素的顺序颠倒

var arr = [1,2,3];

arr.reverse(); //arr数组变为[3,2,1]

3、 sort(); //用于对数组内的元素进行排序。可以传入一个函数用作排序，如果为空，则按字母顺序排序。undifined元素排到最后

var arr = [1,2,3];

a.sort(function(a,b){

return a-b; //排序标准 负数 0 正数，比较结果先返回小的那个

}); //arr数组的值为[1,2,3] 如果第二个条件变为b-a则结果为[3,2,1]

4、concat() //用于组合一个新的数组，返回一个新的数组

var arr = [1,2,3]

arrnew = arr.concat(4,5) //arrnew数组为[1,2,3,4,5]

arrnew1 = arr.concat([4,5],[6,7]); //arrnew1数组为[1,2,3,4,5,6,7]

5、slice() //用于返回数组指定区间的元素组成的数组，如果输入一个参数，则是从这个参数到结束之间的数组。两个参数就是，第一个参数是起始位置，第二个参数是个数。

var arr = [1,2,3,4,5];

var arr1 = arr.slice(2); //[3,4,5]

var arr2 = arr.slice(1,3); //[2,3]

6、splice() 删除或者添加元素。会改变原数组本身，相当于C#中的引用(ref)，原数组是删除的元素组成的数组，返回值是剩下的元素组成的数组。

var arr = [1,2,3,4,5];

var arr1 = arr.splice(1,3); //arr为[2,3,4],返回的数组arr1为[1,5]

var arr2 = [1,2,3,4,5];

var arr3 = arr2.splice(2,0,'a','b'); //从第2位开始删除，删除两个元素，然后从该位置插入'a','b';arr2为[]，因为没有删除任何元素，arr3[1,2,'a','b',3,4,5]

7、 push()与pop() 在数组尾部添加或删除一个元素，添加时返回之为最后一个添加的元素，删除时。返回值为删除的那个元素。

push() 函数在数组尾部添加一个元素。

pop() 函数删除数组的最后一个元素。

var arr = [1,2,3]

arr.push(4); //arr为[1,2,3,4]

var arr1 = [1,2,3]

arr.pop(); //arr1为[1,2]

8、unshift()和shift()

shift(),unshift()与push(),pop()只不过，是在数组头部操作而非尾部。

shift() 在数组头部移除一个元素，返回值为被删元素。

unshift() 在数组头部添加一个元素，返回组为最后一个添加的元素。

var arr = [1,2,3];

var a = arr.shift(); //arr变为[2,3] a为1

var arr1 = [1,2,3];

var b = arr1.unshift([4,5]); //arr1变为[4,51,2,3]，b为4 返回最后一个添加的，先添加5再添加4

9、toString()和toLocaleString() 将数组转化为字符串

var arr = [1,2,3]

arr.toString(); //生成"1,2,3" 与不使用任何参数的join()是一样的。

ECMAScript 标准数组方法

二、ECMAScript中的数组方法

1、forEach() forEach() 从头到尾遍历数组，为每个元素调用指定的函数。

var arr = [1, 2, 3, 4, 5]; var sum = 0; arr.forEach(function (value) { sum = sum + value; }); document.write(sum); //sum最终为15

2、map() map()方法将调用的数组的每个元素传递给指定的函数，并返回一个数组。

var arr = [1, 2, 3, 4, 5]; var arr1 = arr.map(function (value) { return value + 1; }); document.write(arr1.join()); //arr1为[2,3,4,5,6]

3、filter() filter()过滤，返回的元素是调用数组的一个子集，过滤掉不符合条件的元素。

var arr = [1, 2, 3, 4, 5, 6]; var arr1 = arr.filter(function (i) { return i % 2 == 0 }); document.write(arr1.join()); //arr1为[2,4,6]

4、every()和some()

every()当且仅当数组里的所有元素调用判定函数都返回true，它才返回true。第一次返回false就停止遍历。

some()当数组里存在一个元素调用判定函数返回true，它就返回true。第一次返回true就停止遍历。

var arr = [1, 2, 3, 4, 5, 6]; var a = arr.every(function (x) { return x > 3; }); var b = arr.some(function(y){ return y > 3; }); document.write("a的值是：" + a); //a的值是false,a中不是所有元素大于3 document.write("b的值是：" + b); //b的值是true,b中存在元素大于3

5、reduce()和reduceRight()

reduce() 将数组中的元素以指定函数进行组合，生成单个值，第一个参数是简化操作函数，第二个参数是传递给函数的初始值。最后结果是初始值再按组合函数与最后结果计算一次。第二个参数即初始值可以省略，当初始值省略就直接从第一个元素开始计算。

var arr = [1, 2, 3, 4, 5, 6]; var count = arr.reduce(function (x, y) { return x + y; },0); document.write(count); reduceRight(); 与reduce()唯一的不同就是它从右至左选择元素进行计算。

6、indexOf()和lastInsexOf()

indexOf() indexOf()从头至少尾返回找到的第一个元素的索引。

lastIndexOf() lastIndexOf()倒序查找元素，返回第一个找到元素的索引。

var arr = [1, 2, 3, 2, 1]; var i = arr.indexOf(2); //从头至尾搜索，第一次遇见2是arr[1]，因此返回1 var j = arr.lastIndexOf(2); //从尾至头搜索，第一次遇见2是arr[3]，因此返回3 document.write(i + "<br/>"); document.write(j);

7、Array.isArray(); //判定一个对象是否数组对象

var arr = [1, 2, 3]; var str = "str1"; document.write(Array.isArray(arr)); //返回true arr是数组对象 document.write(Array.isArray(str)); //返回false str是字符串，并非数组对象