理解JS中数组的常见应用

JavaScript中数组是用方括号包裹起来的一组元素，各元素之间以逗号隔开，例如：

var array = [1,2,4,6];

如上述代码所示，数组array是若干整数构成的数组。

数组元素的获取

获取数组元素需采用数组名加下标的方式。下标从0到数组长度减一，第一个元素用arry[0]表示，第二个元素用arry[1]表示，以此类推...

  var array = [1,2,4,6];
  array[1]; // 返回2
  arraay[2]; //返回4
  var len = array.length; //数组长度为4
  array[len-1]; //6

push()和pop()

在数组的尾部添加一个或若干个给定的元素用push方法，在数组尾部删除元素用pop方法

  var array = [1,6];
  //添加尾部元素
  array.push(8,9);  // [1,6,8,9]
  //删除尾部元素
  array.pop();      // 9
  array  //[1,6,8]      

unshift()和shift()

在数组的头部添加一个或若干个指定元素用unshift方法，在数组头部删除元素用shift方法

  var array = [1,6];
  //添加头部元素
  array.unshift(8,9);  // [8,9,1,6]
  //删除头部元素
  array.shift();      // 8
  array  //[9,1,6]        

slice()

使用slice方法可以截取数组部分元素，slice(start,end)，start表示开始索引值，end表示结束索引值。slice方法生成了一个新数组，原先数组的值不变。

  var array = [1,2,3,'A','B','C']; 
  array.slice(2,5); //[3,'A','B'] 开始索引2，结束索引5，但不包含5
  array; //[1,2,3,'A','B','C']
  var array1 = array.slice();  //创建一个新数组
  array1;   // [1,2,3,'A','B','C']
  array1 === array; // false

splice()

splice方法可以从指定位置删除一些元素，然后再新加一些元素。splice方法改变了原数组，返回了一个被删除元素形成的数组。

  var arr = ['Microsoft', 'Apple', 'Yahoo', 'AOL', 'Excite', 'Oracle'];
  // 从索引2开始删除3个元素,然后再添加两个元素:
  arr.splice(2, 3, 'Google', 'Facebook'); // 返回删除的元素 ['Yahoo', 'AOL', 'Excite']
  arr; // ['Microsoft', 'Apple', 'Google', 'Facebook', 'Oracle']
  // 只删除,不添加:
  arr.splice(2, 2); // ['Google', 'Facebook']
  arr; // ['Microsoft', 'Apple', 'Oracle']
  // 只添加,不删除:
  arr.splice(2, 0, 'Google', 'Facebook'); // 返回[],因为没有删除任何元素
  arr; // ['Microsoft', 'Apple', 'Google', 'Facebook', 'Oracle']

concate()

concat方法把当前的Array和另一个Array连接起来，并返回一个新的Array：

  var arr = ['A', 'B', 'C'];
  var added = arr.concat([1, 2, 3]);
  added; // ['A', 'B', 'C', 1, 2, 3]
  arr; // ['A', 'B', 'C']

join()

join方法可以将数组用给定的字符串连接起来，生成一个新的字符串

  var arr = ['A', 'B', 'C', 1, 2, 3];
  arr.join('-'); // 'A-B-C-1-2-3'

map()

该方法将创建一个新的数组，这个新数组由原数组中的每个元素都调用一次提供的函数后的返回值组成。

  var arr=[1,3,4,55,23];
  arr.map(function(x){
      //每个元素乘以2
      return x*2;
  })
  //[2,6,8,110,46]

filter()

该方法将创建一个新的数组，这个新数组由原数组中的每个元素都调用提供的函数进行判断，满足条件的元素保留后所组成的。

  var arr=[1,3,4,55,23];
  arr.filter(function(x){
      //每个元素乘以2
      return x>10;
  })
  //[55,23]

forEach()

对数组的每个元素执行一次给定的函数。

  var arr=[1,3,4,55,23];
  arr.forEach(function(x){
      //在控制台打印出元素
      console.log(x);
  })
  //1
  //3
  //4
  //55
  //23

every()

对数组的每一个元素按给定的函数判断是否满足条件，如果都满足则返回true，相反则返回false

  var arr=[23,11,9,8,12,2];
  arr.every(function(x){
      return x>10;
  })
  //false

some()

对数组的元素按给定的函数判断是否存在满足的情况，如果存在则返回true，否则则返回false

  var arr=[23,11,9,8,12,2];
  arr.some(function(x){
      return x>10;
  })
  //true

reduce()

对数组中的每个元素按序执行一个提供的 reducer 函数，每一次运行 reducer 会将先前元素的计算结果作为参数传入， 最后将其结果汇总为单个返回值。

  var arr=[10,8,12,56];
  arr.reduce(function(sum,x){
      return sum+x;
  });
  //86

find()

对数组元素按照给定的函数进行查找，并返回第一个满足条件的数组元素

  var arr=[-2,-4,12,0,13]
  arr.find(function(x){
      return x>0
  });
  //12

findIndex()

对数组元素按照给定的函数进行查找，并返回第一个满足条件的数组元素的索引

  var arr=[-2,-4,12,0,13]
  arr.findIndex(function(x){
      return x>0
  });
  //2

findLastIndex()

对数组元素按照给定的函数进行查找，并返回最后一个满足条件的数组元素的索引

  var arr=[-2,-4,12,0,13]
  arr.findLastIndex(function(x){
      return x>0
  });
  //4

sort()

对数组元素按照给定的函数进行排序

  var arr = [34,2,21,12,33,56,10];
  // 按找倒序的方式进行排序
  arr.sort(function(x,y){
      if (x>y){
          return -1;
      }else if(x==y){
          return 0;
      }else{
          return 1;
      }
  })
  //[56, 34, 33, 21, 12, 10, 2]

文章同时发表在：码农编程网 欢迎访问

本节重点：

• 理解什么是数组；
• 在数组尾部添加或删除元素；
• 在数组头部添加或删除元素；
• 数组元素的截取，连接，转换等操作。
• 数组其它的常用方法