所有数组的方法（api）总结

目录所有数组的方法（api）

ES3 的数组方法

join();

• 目的：将数组转换为字符串
• 是否改变原数组：不改变原数组，返回一个新的字符串

• let arr = ["a","b","c","d","e"];
  let arr1 = arr.join();
  console.log(arr1); // a,b,c,d,e
  console.log(arr); // ["a", "b", "c", "d", "e"] 不改变原来的数组
  let arr2 = arr.join("-");
  console.log(arr2); // a-b-c-d-e

reverse();

• 目的 将数组中的元素颠倒顺序
• 是否改变原数组：改变原来的数组

• let arr = ["a","b","c","d","e"];
  let arr1 = arr.reverse();
  console.log(arr1); // ["e", "d", "c", "b", "a"]
  console.log(arr); // ["e", "d", "c", "b", "a"] 改变原来的数组
  //怎么颠倒字符串呢?
  //先把字符串转换数组再用数组的reverse转换
  let str = "abcde";
  let str1 = str.split("").reverse().join("");
  console.log(str1); // edcba
  

   

sort();

• 目的： 将数组中的元素按照一定规则排序(必须是数字)
• 是否改变原数组：改变原来的数组

• let arr = [5,4,6,1,8,2,9];
  let arr1 = arr.sort();
  console.log(arr1); // [1, 2, 4, 5, 6, 8, 9]
  console.log(arr); // [1, 2, 4, 5, 6, 8, 9] 改变原来的数组

concat();

• 目的 用于连接两个或多个数组
• 是否改变原数组：不改变原来的数组，返回一个新的数组

• let arr1 = [5,4,6,1,8,2,9];
  let arr2 = ["a","b","c","d"];
  let arr3 = arr1.concat(arr2);
  console.log(arr3); // [5, 4, 6, 1, 8, 2, 9, "a", "b", "c", "d"]

slice(start，end);

• 目的： 已有的数组中返回选定的元素
• 是否改变原数组：不改变原来的数组，返回一个新的数组

• let arr = ["a","b","c","d"];
  let arr1 = arr.slice(0,1); 
  let arr2 = arr.slice(1)
  console.log(arr1); // ["a"]
  console.log(arr2); // ["b", "c", "d"]

ES5的数组方法

map();

*目的： 创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果

• 是否改变原数组：不改变原来的数组，返回一个新数组

• let list = [1,2,3,];
  const data = list.map(item=>(item * 2));
  console.log(data); // [2, 4, 6]
  console.log(list); // 原来数组不变

filter();

• 目的： 将数组的每个元素传递给指定的函数，并返回一个数组，它包含该函数的返回值
• 是否改变原数组：不改变原来的数组，返回一个新数组,新数组是原数组的子集

• let arr = [1,2,3,4,5,8,9,10];
  let list = arr.filter((x) => {
     return x>2;
  })
  console.log(list); // [3, 4, 5, 8, 9, 10]

indexOf()和lastIndexOf()

• 目的：搜索数组中具有给定值的元素。
• indexOf() 指从前往后查询. lastIndexOf() 指从后往前查询.

• let arr = [2, 4, 6, 8, 8, 6, 4, 2];
  console.log(arr.indexOf(4, 2));     //从索引为2的位置开始查找   6
  console.log(arr.indexOf(4));        //从头开始找，找到第一个即停止  1
   
   
  let arr = [2, 4, 6, 8, 8, 6, 4, 2];
  console.log(arr.lastIndexOf(4));    //从后往前走，但返回的是从前往后的索引  6
  console.log(arr.indexOf("2"));      //找不到返回-1 -1

 

ES6的数组方法

Array.from();

• 目的：将类数组对象和可遍历对象转化为数组．

• let obj = "ffkfkfk";
  let list = Array.from(obj);
  console.log(list); // ["f", "f", "k", "f", "k", "f", "k"]
  

Array.of()

• 目的：将一组值转化为数组．

• let arr = [1,2,3,4];
  let list = Array.of(arr);
  console.log(list); // [Array(4)]

copyWithin();

• 目的：在数组内部，将指定位置的成员复制到其他位置(会覆盖原有成员)．
• 是否修改原数组：修改原数组.

• let fruits = ["Banana", "Orange", "Apple", "Mango"];
  let list = fruits.copyWithin(2, 0);
  console.log(list)   // ["Banana", "Orange", "Banana", "Orange"]

find()和findIndex()

• 目的：在数组内部, 找到第一个符合条件的数组成员．

• 查找元素，返回找到的值，找不到返回undefined。
  const arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
  const ret1 = arr1.find((value, index, arr) => {
    return value > 4
  })
   
  const ret2 = arr1.find((value, index, arr) => {
    return value > 14
  })
  console.log('%s', ret1)  // 5
  console.log('%s', ret2)  // undefined

fill();

• 目的：如其意，填充一个数组．

• const fruits = ["Banana", "Orange", "Apple", "Mango"];
  const list = fruits.fill("Runoob");
  console.log(list);  // ["Runoob", "Runoob", "Runoob", "Runoob"]

reduce()方法

reduce()方法用于对数组中的所有元素调用指定的回调函数，该回调函数的返回值为累积结果，并且此返回值在下一次调用该回调函数时作为参数提供

语法

array.reduce(callback[, value])

参数
array: 必传，一个数组对象
callback: 必传，对于数组中的每个元素，reduce方法都会调用一次callback函数
value: 可选，如果指定value，它将作为初始值来启动积累。第一次调用callback函数会将此值作为参数

返回值
通过最后一次调用回调函数获得的累积结果

例
 

<script>
    var arr = [1, 2, 3, 4, 5, 6, 7]
    function getSum(total, num){
        return total + num;
    }
    var sum = arr.reduce(getSum)
    console.log(sum);
</script>