JavaScript:数组学习

创建

主要分为构造函数和字面量两种方式。数组本质是对象。

构造函数

  1. var a1=new Array(); 无参数,创建一空数组
  2. var a2=new Array(5); 一个数字参数,指定数组长度(由于数组长度可以动态调整,作用并不大),创建指定长度的数组
  3. var a3=new Array(4,'hello',new Date()); 有初始化数据,创建数组并初始化参数数据;这种类型不一致的情况,数组类型为object

字面量

  1. var a4=[]; 使用方括号,创建空数组,等同于调用无参构造函数
  2. var a5=[10]; 使用中括号,并传入初始化数据,等同于调用调用带有初始化数据的构造函数;这种情况是创建了一个元素的数组,这个元素的值是10;字面量不论给1还是多个参数,只有初始化值这一种含义
  3. var arr = [element0, element1, ..., elementN]; 推荐使用字面量方式

缺少指定个数,每个元素都是指定初始值的构造方法。比如,创建一个数组,一共n个元素,每个元素都初始化为false。这个需要两步,先创建一个空数组,然后来一个for循环,每个元素赋值为false

访问

  • 主要通过索引访问
  • 长度length是一个属性,是最后一个元素的索引值+1
  • 长度length可以被修改,不过这样会改变数组容量,有时会丢失数据,不推荐这样做。通常,还是把它当做一个只读属性来用比较好。
  • length=0 清空数组,没有提供清空数组的方法,就用这个来实现
  • 如果[]中给的不是正数,而是负数,或者字符,会给数组增加一个属性。
  • 索引也是数组的一个属性,[]可以放索引,也可以放其他属性,
  • 索引如果超出length,返回undefined
var arr = ["one", "two", "three"];
arr[2];  // three
arr["length"];  // 3
arr[6]; // undefined

遍历

  • 最常用的方法是for循环,仅仅是遍历,不做任何变换
var colors = ['red', 'green', 'blue'];
for (var i = 0; i < colors.length; i++) {
  console.log(colors[i]);
}

由于 for in 循环会枚举原型链上的所有属性,唯一过滤这些属性的方式是使用hasOwnProperty 函数, 因此会比普通的 for 循环慢上好多倍。 使用 for in 遍历数组被认为是不好的代码习惯并倾向于产生错误和导致性能问题。

  • forEach()方法,遍历数组并且变换,不返回新的数组,直接在原数组上操作
var a = ['a', 'b', 'c'];
a.forEach(function(element) { console.log(element);} ); 
// logs each item in turn
  • map()方法,遍历数组并且变换,不改变原数组,变换后的结果放在一个新数组中返回
var a1 = ['a', 'b', 'c'];
var a2 = a1.map(function(item) { return item.toUpperCase(); });
console.log(+a1); // logs a,b,c
console.log(+a2); // logs A,B,C

添加

  • arrayObj. push([item1 [item2 [. . . [itemN ]]]]);// 将一个或多个新元素添加到数组结尾,并返回数组新长度。加后面,最常用;多个元素用逗号隔开
  • arrayObj.unshift([item1 [item2 [. . . [itemN ]]]]);// 将一个或多个新元素添加到数组开始,数组中的元素自动后移,返回数组新长度。加前面,有时候会用到;多个元素用逗号隔开
  • arrayObj.splice(insertPos,0,[item1[, item2[, . . . [,itemN]]]]);//将一个或多个新元素插入到数组的指定位置,插入位置的元素自动后移,返回""。加中间,相当于其他语言的插入函数;多个元素用逗号隔开。第2个参数是0,表示删除0个元素,只剩下插入功能了。

删除

  • arrayObj.pop(); //移除最后一个元素并返回该元素值。删后面,最常用;只能一个元素
  • arrayObj.shift(); //移除最前一个元素并返回该元素值,数组中元素自动前移。删前面,有时候会用到;只能一个元素
  • arrayObj.splice(deletePos,deleteCount); //删除从指定位置deletePos开始的指定数量deleteCount的元素,数组形式返回所移除的元素。删中间,有时候会用到;可以有多个元素。后面可选的添加元素没有,只剩下删除功能。

截取子Array

arrayObj.slice(start, [end]); //以数组的形式返回数组的一部分,注意不包括 end 对应的元素,如果省略 end 将复制 start 之后的所有元素。

  • 原来的数组不会被修改。splice会直接修改原来的数组,这个差别很大。
var a = new Array ("a", "b", "c", "d", "e");
var b = a(1, 4); 
var c = a(1); 
console.log(a) // ["a", "b", "c", "d", "e"]
console.log(b) // ["b", "c", "d"]
console.log(c) // ["b", "c", "d", "e"]

合并

arrayObj.concat([item1[, item2[, . . . [,itemN]]]]); //将多个数组(也可以是字符串,或者是数组和字符串的混合)连接为一个数组,返回连接好的新的数组

  • 原来的数组不会被修改。splice会直接修改原来的数组,这个差别很大。
var a = new Array("1", "2", "3");
var b = new Array("a", "b", "c");
var c = a.concat(b);
console.log(a); // ["1", "2", "3"]
console.log(b); // ["a", "b", "c"]
console.log(c); // ["1", "2", "3", "a", "b", "c"]

排序

  • arrayObj.reverse(); //反转元素(最前的排到最后、最后的排到最前),返回数组地址
  • arrayObj.sort(); //对数组元素排序,返回数组地址,从小到大,升序排列
  • sort() 也可以带一个回调函数来决定怎么比较数组元素。这个回调函数比较两个值,并返回3个值中的一个:1, -1, 0三条分支要写全,不要图省事,否则很容易出现意想不到的逻辑问题
    例如,下面的代码通过字符串的最后一个字母进行排序:
var myArray = new Array("Wind", "Rain", "Fire");
var sortFn = function(a, b){
  if (a[a.length - 1] < b[b.length - 1]) return -1;
  if (a[a.length - 1] > b[b.length - 1]) return 1;
  if (a[a.length - 1] == b[b.length - 1]) return 0;
}
myArray.sort(sortFn); 
// sorts the array so that myArray = ["Wind","Fire","Rain"]

字符串化

arrayObj.join(separator); //返回字符串,这个字符串将数组的每一个元素值连接在一起,中间用 separator 隔开。
toLocaleString 、toString 、valueOf:可以看作是join的特殊用法,不常用。
返回的字符串是新创建的,原来的数组并不会被修改

var myArray = new Array("Wind", "Rain", "Fire");
var list = myArray.join(" - "); // list is "Wind - Rain - Fire"
console.log(myArray); // ["Wind", "Rain", "Fire"]
console.log(list); // Wind - Rain - Fire

小结

  • 数组是普通的对象,并不是特殊的集合类型。和c语言一段连续的内存有本质的差别
  • length, index等都是属性,可以访问,也可以设置,不用当心数组越界。访问不存在的属性,返回一个undefined就可以了,设置一个不存在的index,添加一个属性就可以了。length, index两者的关系有对象内部维护。
  • 没有提供清空数据的方法,用length = 0;间接达到目的,这个有点特殊,个人感觉也不是很好。提供一个清空方法应该不是难事啊。
  • 数组操作的方法提供的还是比较全的,用起来应该笔记方便。合适的时候采用合适的方法。
  • splice这个方法比较特殊,又删除,又插入,而且会改变目标数组本身。功能很全,各种参数情况下表现不同,需要小心使用。
  • 数组的定义,还是用最简单的[],最方便

参考文章

数组对象(Array object)
Mozzilla的教程,写得很不错,有空多看看

javascript之数组操作
这个写得比较简洁,推荐多看看

JavaScript 数组详解
这个写得比较详细,推荐多看看

RUNOOB.COM
一个学习JavaScript等技术的网站,排版还可以

JavaScript Array 对象
很简明的W3C手册,偶尔可以查查看看

你可能感兴趣的:(JavaScript:数组学习)