数组

747 阅读9分钟

数组 Array

数组是一个有序的集合.每个值叫做一个元素,而每个元素在数组中有一个位置,以数字表示,称为索引下标.

数组元素可以是任意类型,并且同一个数组中的不同元素也可能有不同的类型.

javaScript 数组是动态的,更具需要可以增长或缩减.

创建数组

  1. 数组直接量
  var empty = []; // 没有元素的数组
  var primes = [2, 3, 4, 9, 5]; // 数字类型元素的数组
  var misc = [1, 'hello', true, undefined] // 不同数据类型元素的数组
  1. new 和 Array() 构造函数调用
  var arr = new Array(); // 创建一个空数组
  var arr = new Array(10); // 传递一个参数制定数组的长度 length
  var arr = new Array(5,4,3,'hello'); // 创建一个数组并制定两个或多个数组元素

稀疏数组

稀疏数据就是包含从 0 开始的不连续索引的数组.

例如:

  var a = new Array(5); // 数组长度是5,但是没有任何元素
  a = []; // 重新赋值一个空数组直接量
  a[1000] = 10; // 添加一个元素,但是数组的长度是 1001

数组长度

每一个数组都有一个 length 属性, 在非稀疏数组的情况下, length 属性值代表数组中元素的个数. 我们也可以通过改变数组的长度,来删除元素. 例如:

  var arr = [1,2,3,4];
  arr.length = 2;
  arr // [1,2]

数组元素的添加和删除

元素的添加

  1. 通过索引添加元素
  var arr = [];
  arr[0] = 1;
  arr[1] = 'two';
  1. 数组的 push() 方法在数组末尾增加元素

数组的 push() 方法在数组末尾增加一个或多个元素, 返回数组的长度

  var arr = [];
  arr.push('one'); // arr = ['one'];
  arr.push('two', 3); // arr = ['one', 'two', 3];
  1. 数组的 unshift() 方法在数组首部插入元素

数组的 unshift() 在数组首部插入一个或多个元素,并将已存在的元素移动到更高索引的位置来获得足够的空间.

  var arr = [];
  arr.unshift('one'); // ['one'];
  arr.unshift('two', '3'); // ['two', '3', 'one'];

元素的删除

  1. delete 运算符删除元素
  var arr = [1,2,3];
  delete arr[1];
  1 in arr // false;
  arr.length // 3 delete 不会影响数组的长度
  1. 数组 pop() 方法在数组末尾删除元素

数组 pop() 方法在数组末尾删除元素, 返回删除的元素

  var arr = [1,2];
  arr.pop(); // 返回 2, arr = [1];
  1. 数组 shift() 方法在数组首部删除元素

数组 shift() 方法在数组首部删除第一个元素,并返回删除的元素. 所有随后的元素前移一个位置来填补头部删除的空缺.

  var arr = [1,2];
  arr.shift(); // 返回 1, arr = [2]

数组的方法

join()

Array.join() 方法将数组中将所有元素都转化为字符串并连接在一起,最后返回生成的字符串. 不修改原数组 返回字符串 可以指定一个可选的字符串在生成的字符串来分隔数组的各个元素,如果不指定默认使用逗号.

  var arr = [1,2,3];
  arr.join(); // "1,2,3" arr = [1,2,3]
  arr.join(""); // "123" arr = [1,2,3]

reverse()

Array.reverse() 方法将数组中的元素颠倒顺序,返回逆序的数组. 修改原数组 返回数组

  var arr = [1,2,3];
  arr.reverse(); // 返回 [3,2,1] arr = [3,2,1]

sort()

Array.sort() 方法将数组中的元素排序并返回排序后的数组. 当不带参数调用 sort() 时,数组元素以字符表顺序排序. 如果数组包含 undefined 它将会排到数组的尾部. 修改原数组 返回数组

  var arr = ["banana","cherry","apple"];
  arr.sort(); // ["apple","banana","cherry"]

数字类型排序

sort() 方法传递一个比较函数.该函数决定了它的两个参数在排好序的数组中的先后顺序.

假设第一个参数在前,比较函数需要返回一个小于 0 的值 [3,2,5] => [2,3,5] 第一个参数减去第二个参数 (2 - 3) < 0 (3 - 5) < 0

反之假设第二个参数在前,比较函数需要返回一个大于 0 的值 [3,2,5] => [5,3,2] 第二个参数减去第一个参数 (5 - 3) > 0 (3 - 2) > 0

  var arr = [3,2,5];
  arr.sort(function(a, b) {
    return a - b; // 第一个参数减去第二个参数小于 0, 正序, 反之倒序
  })

concat()

Array.concat() 方法创建并返回一个新数组,它的元素包括调用 concat() 的原始数组的元素和 concat() 的每个参数. 如果参数是一个数组,则连接的是数组的元素. 不修改原数组 返回数组

  var arr = [1,2,3];
  arr.concat(4,5); // 返回 [1,2,3,4,5]
  arr.concat([6,7]); // 返回 [1,2,3,6,7] 
  arr.concat(["hello", ["world"]]); // 返回 [1,2,3,"hello",["world"]]

slice()

Array.slice() 方法返回指定数组的一个片段或子数组.它的两个参数分别指定了片段的开始和结束位置. 不修改原数组 返回数组

  • 传两个正整数参数, 返回数组包含第一个参数指定的索引位置和所有到,但不包含第二个参数指定的索引位置之间所用的数组元素.
  var arr = [1,2,3,4,5];
  arr.slice(1,4); // 返回 [2,3,4];
  • 传一个正整数参数, 返回数组从参数指定的索引位置到数组结尾的所有元素
  var arr = [1,2,3,4,5];
  arr.slice(1); // 返回 [2,3,4,5]
  • 参数含有负整数, 表示相对于数组中最后一个元素的位置开始, -1 表示数组中最后一个元素, -3 表示数组倒数第三个元素.
  var arr = [1, 2, 3, 4, 5];
  arr.slice(-1); // 返回 [5]
  arr.slice(-3); // 返回 [3,4,5]
  arr.slice(0, -3); // 返回 [1,2]
  arr.slice(-3, -1); // 返回 [3,4]

splice()

Array.splice() 方法是在数组中插入删除元素的通用方法. splice() 能够从数组中删除数组、插入数组或者同时完成这两种操作. 修改原数组 返回数组

  • 第一个参数指定了插入或删除的起始索引位置,如果只有一个参数,从指定索引位置开始到数据结尾所有元素将被删除
  var arr = [1,2,3,4,5];
  arr.splice(2); // 返回 [3,4,5]; a = [1,2]
  • 第二个参数指定了从数组中删除的个数
  var arr = [1,2,3,4,5];
  arr.splice(2, 1); // 返回 [3]; a = [1,2,4,5]
  arr.splice(2, 2); // 返回 [4,5]; a = [1,2]
  • 前两个参数指定了需要删除的数组元素, 紧随其后的任意个数的参数指定了需要插入到数组的元素
  var arr = [1,2,3,4,5];
  arr.splice(2, 0, 'a', 'b'); // 返回 [] a = [1,2,'a','b',3,4,5];
  arr.splice(2, 3, [1,2]); // 返回 ['a','b',3] a = [1,2,[1,2],4,5];

区别于concat(),splice()会插入数组本身而非数组的元素

push() 和 pop()

push() 和 pop()方法允许将数组当做栈来使用. push() 在数组尾部添加一个或多个元素并返回数组的新长度. pop() 在数组尾部删除一个元素,减小数组的长度并返回删除的值. 修改原数组

unshift() 和 shift()

unshift() 在数组头部添加一个或多个元素,返回数组的新长度. shift() 在数组头部删除一个元素,减小数组的长度并返回删除的值. 修改原数组

ECMAScript 5中的数组方法

forEach()

forEach() 方法从头到位遍历数组,为每个元素调用指定的函数. 这个指定的函数是 forEach() 的第一个参数, forEach() 使用三个参数调用该指定函数.

  1. 第一个参数: 数组元素
  2. 第二个参数: 元素的索引
  3. 第三个参数: 数组本身
  var arr = [1,2,3,4,5];
  arr.forEach(function(val, i, arr) {
    arr[i] = val + 1;
  })
  arr // [2,3,4,5,6]

forEach() 无法在所有元素都传递给调用的函数之前终止遍历,无法像for循坏使用break语句

map()

map() 方法将调用的数组的每个元素传递给指定的函数(类似 forEach()),并返回一个数组. map()调用数组的每个元素指定的函数内应该有返回值

  var arr = [1,2,3,4,5];
  var newArr = arr.map(function(val, i, arr) {
    return val * 2;
  })
  arr // [1,2,3,4,5]
  newArr // [2,4,6,8,10]

filter()

filter() 方法返回的数组元素是调用的数组的一个子集.传递的函数是用来逻辑判定的:该函数返回 true 或 false. 调用判定函数就像调用 forEach() 和 map() 的元素指定函数一样. 如果返回值转化为布尔值为 true,那么传递给判定函数的元素就是这个子集成员.

  var arr = [1,2,3,4,5];
  var smallValues = arr.filter(function(val) {
    return val > 3;
  })
  smallValues // [4,5]

every() 和 some()

every() 和 some() 方法是数组的逻辑判定: 它们对数组元素应用指定的函数进行判定,返回 true 或 false. every() 方法像数学中的“针对所用”量词

  var arr = [1,2,3,4,5];
  arr.every(function(val) {
    return val < 10
  }) // 返回 true 数组所有的元素都小于10
  arr.every(function(val) {
    return val % 2 === 0;
  }) // 返回 false 数组不是所有的元素都是偶数

some() 方法像数学中的“存在”量词

 var arr = [1,2,3,4,5];
 arr.some(function(val) {
   return val % 2 === 0;
 }) // 返回 true 数组中含有偶数

reduce() 和 reduceRight()

reduce() 和 reduceRight() 方法使用指定的函数将数组元素进行组合,生成单个值. reduce() 需要两个参数,第一个是执行化简操作的函数.第二个(可选)的参数是一个传递给函数的初始值. 区别于 forEach()、map() 元素指定函数的第一个参数是到目前为止化简操作累计的结果.第二到第四个参数与 forEach()、map() 元素指定函数的参数一致. 当第一次调用时,第一个参数是初始值,他就是传递给 reduce() 的第二个参数.

  var arr = [1,2,3,4,5];
  var sum = arr.reduce(function(init, val, i, arr) {
    return init + val;
  }, 0)
  sum // 数组求和
  var product = arr.reduce(function(init, val, i, arr) {
    return init * val;
  })
  product // 数组求积

reduceRight() 与 reduce() 工作原理一样,不同的是它按照数组索引从高到底(从左到右)处理数组

indexOf() 和 lastIndexOf()

indexOf() 和 lastIndexOf() 搜索整个数组具有给定值的元素,返回招到的第一个元素的索引或者如果没有招到返回 -1. indexOf() 从头至尾搜索,而 lastIndexOf() 则反向搜索.

数组类型

数组是具有特殊行为的对象. 当给定一个未知的对象,判定它是否为数组而进行下一步操作. 可以通过 Array.isArray() 方法判断该对象是否为数组类型