数组常用方法

144 阅读3分钟

1. for of循环

const list = [1, 2, 3];
for (const item of list) {
    //do something
    if (item >= 2) {
        console.log(item);
    }
}

2. forEach

​ Array.prototype上内置的,遍历出item和index,不会改变原数组,没有返回值。

const list = [1, 2, 3];
list.forEach((item, index) => {
    //do something
});

3. map

​ 获得原数组的映射,遍历出item和index,不会改变原数组,返回新数组。

const list = [1, 2, 3];
const newList = list.map((item, index) => item * index); //[0,2,6]

4. filter

​ 执行迭代函数的返回值如果为真值,则会将这个成员放进新数组,若为假,则不放入,不会改变原数组,返回新数组。

const list = [1, 2, 3];
const newList = list.filter((item, index) => item * index >= 4); //[3]

5. find和findIndex

​ find()返回值的结果是第一个执行迭代函数的返回值为真值的那一项成员,若都为假,则返回undefined,不会改变原数组。findIndex方法和find方法的原理一样,区别是findIndex方法返回的是第一个符合条件成员的index。如果没有找到符合条件的成员,那么findIndex的返回值是-1。

const list = [
  {
    id: 1,
    label: "1"
  },
  {
    id: 2,
    label: "2"
  },
  {
    id: 3,
    label: "3"
  },
  {
    id: 4,
    label: "4"
  }
];
const item = list.find(item => item.id === 2);	//{id: 2,label: "2"}
const index = list.findIndex(item => item.id === 2);//1

6. some和every

​ some方法有返回值,如果原数组的每一项成员执行迭代函数的结果,有一项为真值,那么some方法会返回true。反之,如果每一项成员执行迭代函数的返回值都是false,那么some方法的返回值就是false。(或)

​ every方法有返回值,如果原数组的每一项成员执行迭代函数的结果,有一项为假值,那么every方法会返回false。反之,如果每一项成员执行迭代函数的返回值都是true,那么every方法的返回值就是true。(且)

const list = [1, 2, 3];
const res = list.some(item => item >= 2);	//true
const res = list.every(item => item >= 2); //false

7. indexOf

​ indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。如果匹配到则返回当前项的索引,否则返回-1(如果未找到)。

let arr = ["1", "2", "3"];
console.log(arr.indexOf("1"));//0
console.log(arr.indexOf("5"));//-1

8. concat

​ 把元素衔接到数组中。

var str1 = "Hello";
var str2 = "world!";
var n = str1.concat(str2);//"Helloworld!"

9. join

​ 将数组的所有元素转化为字符串

var fruits = ["1", "2", "3", "4"];
var energy = fruits.join();//1,2,3,4

10. reverse

​ 在原数组中颠倒元素的顺序。

var fruits = ["1", "2", "3", "4"];
fruits.reverse();//["4", "3", "2", "1"]

11. slice

截取数组的一部分。索引从0开始,不包括最后一个参数

var fruits = ["1", "2", "3", "4", "5"];
var citrus = fruits.slice(1, 3);//["2","3"]

12. splice

插入、删除或替换数组元素。

//插入 在第一个参数前面插入
var fruits = ["1", "2", "3", "4"];
fruits.splice(1, "5", "6"); //["1", "5", "6", "2", "3", "4"]
//删除   第一个参数是开始删除的位置,第二个参数是删除几个,第三个参数是替换被删除的元素
var fruits = ["1", "2", "3", "4"];
fruits.splice(1, 1, "5"); // ["1", "5", "3", "4"]

13. sort

​ 在原数组中对数组元素进行排序

var fruits = ["1", "5", "4", "8"];
fruits.sort();//["1", "4", "5", "8"]

14. toString

​ 将数组转化为字符串。

var arr = ["1", "2", "3"];
var newArr = arr.toString();//1,2,3