🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
## 数组 **1.数组简介** 数组是值的有序集合。每个值叫做一个元素,而每个元素在数组中有一个位置,以数字表示(从0开始),称为索引,整个数组用方括号表示。 ``` var arr = [1,2,3]; ``` 除了在定义时赋值,数组也可以先定义后赋值。 ``` var arr = []; arr[0] =1; ``` 数组元素可以是任意类型。 ``` var arr = [1,'a',{name:'a'},function(){}]; ``` 上面数组arr的4个元素分别是数字,字符串,对象,函数。 数组属于一种特殊的对象。 ``` typeof [1] // "object" ``` JavaScript语言规定,对象的键名一律为字符串,所以,数组的键名其实也是字符串。之所以可以用数值读取,是因为非字符串的键名会被转为字符串。 **2、创建数组** **2.1 创建数组** **(1)数组直接量** 使用数组直接量是创建数组最简单的方法,在方括号中将数组元素用逗号隔开即可。 ``` var arr = [1,2,3]; ``` 注:如果省略数组直接量的某个值,省略的元素将被赋予undefined值。 **(2)new Array()** 我们也可以调用构造函数Array()创建数组 ``` var a=new Array(); var a2=new Array(10); var a3=new Array(1,2,3,4); ``` 上面的例子,a是一个空数组,a2是一个包含10个数组项但为undefined的数组,a3是包含4个数组项,并且分别有值。 **2.2 数组长度** 每个数组都有一个**length**属性,返回数组的元素数量 ``` [1,2,3].length //3 ``` JavaScript使用一个32位整数,保存数组的元素个数。这意味着,数组成员最多只有4294967295个(232 - 1)个,也就是说length属性的最大值就是4294967295。 只要是数组,就一定有length属性。该属性是一个动态的值,等于键名中的最大整数加上1. length属性是可写的。如果人为设置一个小于当前成员个数的值,该数组的成员会自动减少到length设置的值。 ``` var arr = [1,2,3] arr.length //3 arr.length = 2; arr //[1,2] ``` 将数组清空的一个有效方法,就是将length属性设为0。 ``` var arr = [1,2,3]; arr.length = 0; arr //[] ``` 如果人为设置length大于当前元素个数,则数组的成员数量会增加到这个值,新增的位置都是空位。 ``` var arr = [1]; arr.length=3; arr[1] //undefined ``` 在ECMAScript 5中,可以用Object.defineProperty() 让数组的length属性变成只读。 **2.3 空位** 当数组的某个位置是空元素,即两个逗号之间没有任何值,我们称该数组存在空位(hole)。 ``` var arr = [1,,2] arr.length //3 ``` 但是,如果最后一个元素后面有逗号,并不会产生空位。数组直接量的语法允许有可选的结尾的逗号,故[,,]只有两个元素而非三个。 ``` var arr = [,,]; arr.length //2 ``` **2.4 数组元素的读和写** 使用([])操作符来访问数组中的一个元素。 ``` var arr = [1,2] arr[0] //1 arr[1]=3; // [1,3] ``` **2.5 数组元素的添加和删除** 可以使用push()方法在数组末尾添加一个或多个元素。 ``` var arr = [1,2] arr.push(3) // [1,2,3] arr.push('a','b') //[1,2,3,'a','b'] // shift()是删除数组的一个元素。 arr.shift() // [2,3,'a','b'] ``` **2.6 稀疏数组** 稀疏数组是指包含从0开始的不连续索引的数组。通常,数组的length属性值代表数组中元素的个数,但如果是稀疏数组,length属性值大于元素的个数。 **2.7 多维数组** JavaScript不支持真正的多维数组,但可以用数组的数组来近似。也可以说,数组里放数组。 ``` var arr = [[1],[2,3]]; arr[0][0] // 1 arr[1][1] //3 ``` **2.8 遍历数组** 我们可以使用for循环、while循环、for..in或者forEach()方法来遍历数组 ``` var a = [1, 2, 3]; // for循环 for(var i = 0; i < a.length; i++) { console.log(a[i]); } //while var i = 0; while (i < a.length) { console.log(a[i]); i++; } //for..in for (var i in a) { console.log(a[i]); } //forEach a.forEach(function(v){ console.log(v); }) ``` **2.9 类数组对象** 在JavaScript中,有些对象被称为“类数组对象”。意思是,它们看上去很像数组,可以使用length属性,但是它们并不是数组,无法使用一些数组的方法。 ``` var o = { 0: 'a', 1: 'b', length:2 } o[0] // "a" o[1] // "b" o.length // 2 o.push('d') // TypeError: o.push is not a function ``` 上面代码中,变量o是一个对象,虽然使用的时候看上去跟数组很像,但是无法使用数组的方法。这就是类数组对象。 `类数组对象`有一个特征,就是具有length属性。换句话说,只要有length属性,就可以认为这个对象类似于数组。但是,对象的length属性不是动态值,不会随着成员的变化而变化。 由于类数组对象没有继承自Array.prototype,那就不能在它们上面直接调用数组方法。不过我们可以间接的使用Function.call方法调用。 ``` var o = { 0: 'a', 1: 'b', length:2 }; Array.prototype.slice.call(o) // ["a","b"] ``` 典型的类似数组的对象是函数的arguments对象,以及大多数DOM元素集,还有字符串。