常用的JavaScript数组内置方法

 

目录

1、修改数组

push()：添加

pop()：删除

 unshift()：添加

 shift()：删除

 splice()：修改，删除，添加

2、访问数组

concat()：连接数组

 join()：连接

 slice()：提取字符串或数组

indexOf()：索引

 lastIndexOf()：索引

includes()：判断

 forEach()：遍历

3、数组操作

sort()：排序

 reverse()：颠倒数组

 filter()：判断数组

 map()：处理数组

 reduce()：累加

---

1、修改数组

• push()：添加

在数组末尾添加一个或多个元素，并返回新的长度。

    let arr = [1, 2, 3, 4, 5];
        let str = arr.join(",");
        console.log(str); // 输出 "1, 2, 3, 4, 5"

• pop()：删除

删除数组末尾的元素，并返回该元素。

var fruits = ["apple", "banana", "orange"];
var lastFruit = fruits.pop();
// fruits: ["apple", "banana"]
// lastFruit: "orange"

•  unshift()：添加

在数组头部添加一个或多个元素，并返回新的长度。

var fruits = ["apple", "banana"];
var length = fruits.unshift("orange");
// fruits: ["orange", "apple", "banana"]
// length: 3

•  shift()：删除

删除数组头部的元素，并返回该元素。

var fruits = ["orange", "apple", "banana"];
var firstFruit = fruits.shift();
// fruits: ["apple", "banana"]
// firstFruit: "orange"

•  splice()：修改，删除，添加

从指定位置开始修改数组，删除/添加元素，并返回被删除的元素（如果有）组成的数组。

 //1, 删除元素：索引都是从0开始
        var array = [1, 2, 3, 4, 5];
        array.splice(2, 1); // 从索引 2 开始删除 1 个元素
        console.log(array); // 输出 [1, 2, 4, 5]
        //2 插入元素：
        let array1 = [1, 2, 3, 4, 5];
        array1.splice(2, 0, 'a', 'b'); // 从索引 2 开始删除 0 个元素，并插入 'a' 和 'b'
        console.log(array1); // 输出 [1, 2, 'a', 'b', 3, 4, 5]
        // 3替换元素：
        let array2 = [1, 2, 3, 4, 5];
        array2.splice(2, 2, 'a', 'b'); // 从索引 2 开始删除 2 个元素，并插入 'a' 和 'b'
        console.log(array2); // 输出 [1, 2, 'a', 'b', 5]

2、访问数组

• concat()：连接数组

连接两个或多个数组，并返回新的数组。

var fruits = ["apple", "banana"];
var moreFruits = ["orange", "pear"];
var allFruits = fruits.concat(moreFruits);
// allFruits: ["apple", "banana", "orange", "pear"]

•  join()：连接

将数组中的所有元素以指定分隔符连接成一个字符串并返回。

var fruits = ["apple", "banana", "orange"];
var fruitString = fruits.join("-");
// fruitString: "apple-banana-orange"

•  slice()：提取字符串或数组

从原数组中返回选定的元素，不会修改原数组。

        // slice() 方法的基本语法如下：
        // str 是要处理的字符串，
        // startIndex 是起始位置的索引（包括该位置的字符），
        //endIndex 是结束位置的索引（不包括该位置的字符）。
        // str.slice(startIndex, endIndex)
        let str = "Hello, world!";
        let slicedStr = str.slice(7, 12);
        console.log(slicedStr); // 输出 "world"

        let arr = [1, 2, 3, 4, 5];
        let slicedArr = arr.slice(1, 3);
        console.log(slicedArr); // 输出 [2, 3]

• indexOf()：索引

返回指定元素在数组中第一次出现的位置，如果不存在则返回-1。

var fruits = ["apple", "banana", "orange"];
var index = fruits.indexOf("banana");
// index: 1

•  lastIndexOf()：索引

返回指定元素在数组中最后一次出现的位置，如果不存在则返回-1。

var fruits = ["apple", "banana", "orange", "banana"];
var index = fruits.lastIndexOf("banana");
// index: 3

• includes()：判断

判断数组是否包含指定元素，返回布尔值。

var fruits = ["apple", "banana", "orange"];
var hasBanana = fruits.includes("banana");
// hasBanana: true

•  forEach()：遍历

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

var fruits = ["apple", "banana", "orange"];
fruits.forEach(function(fruit){
  console.log(fruit);
});
// 输出结果：
// apple
// banana
// orange

3、数组操作

• sort()：排序

对数组进行排序，默认按照字符串的Unicode码进行排序。

var fruits = ["orange", "apple", "banana"];
fruits.sort();
// fruits: ["apple", "banana", "orange"]

•  reverse()：颠倒数组

将数组中的元素位置颠倒，并返回该数组。

var fruits = ["apple", "banana", "orange"];
fruits.reverse();
// fruits: ["orange", "banana", "apple"]

•  filter()：判断数组

返回一个新数组，其中包含通过给定函数测试的所有元素。

var numbers = [1, 2, 3, 4, 5];
var oddNumbers = numbers.filter(function(number){
  return number % 2 === 1;
});
// oddNumbers: [1, 3, 5]

•  map()：处理数组

返回一个新数组，其中包含使用给定函数处理后的所有元素。

var numbers = [1, 2, 3, 4, 5];
var doubledNumbers = numbers.map(function(number){
  return number * 2;
});
// doubledNumbers: [2, 4, 6, 8, 10]

•  reduce()：累加

将数组中的所有元素通过函数累加，返回一个值。

var numbers = [1, 2, 3, 4, 5];
var sum = numbers.reduce(function(total, number){
  return total + number;
});
// sum: 15