JS数组的一些方法

1.concat()

连接两个或更多的数组,并返回结果。

 const arr1 = [1,2,3];
 const arr2 = [4,5,6];
 console.log(arr1.concat(arr2));

2.pop()

删除数组的最后一个元素并返回删除的元素。

const arr = [1,2,3,4,5,6,7];
arr.pop();//7
console.log(arr);

3.push()

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

const arr = [1,2,3,4,5,6,7];     
console.log(arr.push(9));//返回当前数组的长度:8
console.log(arr);//[1,2,3,4,5,6,7,9]

4.join()

把数组的所有元素放入一个字符串。

const arr = ["aaa","bbb","ccc"];
console.log(arr.join());//  aaa,bbb,ccc

 此时输出结果为   aaa,bbb,ccc  每两个数组元素之间通过逗号连接。

5.every()

检测数值元素的每个元素是否都符合条件。

      const arr = [12, 32, 30];
      console.log(arr.every((item) => item > 10));//true
      console.log(arr.every((item) => item > 20));//false

每个元素都符合条件结果才为真。

6.some()

检测数组元素中是否有元素符合指定条件。

      const arr = [12, 32, 30];
      console.log(arr.some((item) => item > 10));//true
      console.log(arr.some((item) => item > 30));//true
      console.log(arr.some((item) => item > 40));//false

有一个元素符合条件结果就为真,全都不满足条件时结果才为false。

7.shift()

删除并返回数组的第一个元素。

      const arr = [1,2,3,4,5];
      console.log(arr.shift());// 1
      console.log(arr);//         [2,3,4,5]

8.unshift()

向数组的开头添加一个或更多元素,并返回新的长度。

      const arr = [1,2,3,4,5];
      console.log(arr.unshift(0));// 返回当前数组长度:6
      console.log(arr);//            [0,1,2,3,4,5]

9.splice()

从数组中添加或删除元素。

splice() 方法用于添加或删除数组中的元素。

注意:这种方法会改变原始数组。

    <script>
      const arr = [1, 2, 3, 4, 5];
      console.log(arr.splice(1, 2));
      //从数组下标为1的位置开始,删除两个元素,并返回一个数组。此时结果为[2,3]
      console.log(arr); //[1,4,5]

      const arr2 = [1, 2, 3, 4, 5];
      console.log(arr2.splice(1, 0, 6, 7)); //此时输出结果为[],第二个参数为0时返回结果为空数组
      console.log(arr2); //[1,6,7,2,3,4,5]

      const arr3 = [1, 2, 3, 4, 5];
      console.log(arr3.splice(1, 1, 6, 7)); //[2]
      console.log(arr3); //[1,6,7,3,4,5]

      /* splice第一个参数表示开始删除和插入的位置,
         第二个参数为删除元素的数量,
         第二个之后的参数为要插入的新元素
         插入是在第一个参数对应的数组下标之前插入,
         删除则是从第一个参数对应的数组下标开始删除
      */
    </script>

10.slice()

选取数组的一部分,并返回一个新数组。slice方法不修改原数组。

      const arr = [1, 2, 3, 4, 5];
      console.log(arr.slice()); //      [1, 2, 3, 4, 5]
      console.log(arr.slice(4)); //    [5]
      console.log(arr); //             [1, 2, 3, 4, 5]
      const arr2 = [1, 2, 3, 4, 5];
      console.log(arr2.slice(1, 4)); // [2,3,4]
      console.log(arr2); //            [1, 2, 3, 4, 5]
      const arr3 = [1, 2, 3, 4, 5];
      console.log(arr3.slice(-3, -1)); //从倒数第三个元素开始截取到最后一个元素(不包括最后一个)[3,4]
      console.log(arr3); //            [1, 2, 3, 4, 5]
      const arr4 = [1, 2, 3, 4, 5];
      console.log(arr3.slice(-3)); //截取最后三个元素[3,4,5]
      console.log(arr4); //            [1, 2, 3, 4, 5]
      /*
      slice有两个参数,slice方法不改变原数组,
      slice的两个参数为可选参数,当slice方法中不写参数,此时返回原数组;
      slice方法只写一个参数时,此时参数的意义表示截取元素的数量,结果返回截取后数组剩余的部分;
      当两个参数都存在时,表示从第一个数组下标开始截取,
      到第二个参数的数组下标结束(不包含第二个元素对应的数组下标元素)
      返回结果为当前截取的元素数组
      slice参数可以为负数,-1表示最后一个元素,
      */

11.sort()

sort() 方法用于对数组的元素进行排序,排序顺序可以是字母或数字,并按升序或降序,默认排序顺序为按字母升序。

注意: 这种方法会改变原始数组。

      const arr = [3, 1, 0, 4, 2];
      console.log(arr.sort()); // [0, 1, 2, 3, 4]
      console.log(arr); // [0, 1, 2, 3, 4]

      const fruits = ["Banana", "Orange", "Apple", "Mango"];
      console.log(fruits.sort()); //['Apple', 'Banana', 'Mango', 'Orange']

12.reverse()

reverse() 方法用于颠倒数组中元素的顺序。reverse方法会修改原数组。

      const arr = [1, 2, 3, 4, 5];
      console.log(arr.reverse()); //[5, 4, 3, 2, 1]
      console.log(arr); //[5, 4, 3, 2, 1]

13.fill()

fill() 方法用于将一个固定值替换数组的元素。

语法array.fill(value, start, end)

value参数是必须的,表示填充的值;start、end为可选参数,分别代表开始填充和结束填充的位置。

      const name = ["张三", "王五", "李四", "赵六"];
      console.log(name.fill("小明", 2, 3));
      // ['张三', '王五', '小明', '赵六']
      //从数组下标为2的位置开始填充,到数组下标为3的位置结束(不包括3)
      

14.filter()

检测数值元素,并返回符合条件所有元素的数组。filter()方法不修改原数组。

      const arr = [10, 20, 15, 5];
      console.log(arr.filter((item) => item > 10));//[20, 15]
      console.log(arr);//[10, 20, 15, 5]

filter()方法返回满足条件的数组元素,返回结果是一个数组。

15.find()

返回符合传入测试(函数)条件的数组元素。find()方法不修改原数组,一般返回满足条件的第一个数组元素,返回结果是一个数组元素。

      const arr = [10, 20, 15, 5];
      console.log(arr.find((item) => item > 10));//20
      console.log(arr);//[10, 20, 15, 5]

16.findIndex()

返回符合传入测试(函数)条件的数组元素索引。

      const arr = [10, 20, 15, 5];
      console.log(arr.findIndex((item) => item > 10));//1
      console.log(arr);//[10, 20, 15, 5]

findIndex()方法不修改原数组,一般返回满足条件的第一个数组元素的下标。

17.foreach()

数组每个元素都执行一次回调函数。

      const arr = ["张三", "王五", "李四", "小明"];
      arr.forEach(function(value,index,obj){
        console.log(value,index,obj)
      })

18.map()

通过指定函数处理数组的每个元素,并返回处理后的数组。map() 方法返回一个新数组,原数组不改变,返回的新数组中的元素为原始数组元素调用函数处理后的值。

      const arr = [1, 2, 3, 4];
      console.log("map方法处理后的数组:",
        arr.map((item, index, array) => {
          console.log(item, index, array);
          return 2 * item;
        })
      ); 

19.form()

通过给定的对象中创建一个数组。

      const myArr = Array.from("RUNOOB");
      console.log(myArr); // ['R', 'U', 'N', 'O', 'O', 'B']

      const arr = Array.from([1, 2, 3], (x) => x * 10);
      console.log(arr); // [10, 20, 30]

      let obj = {
        '0': "一一",//'0':"一一"中的'0'将转换为下标0
        '1': "二二",
        '2': "三三",
        length: 4,//length规定了转换的数组有多长
      };
      let newObj = Array.from(obj, (item) => {
        return item;
      });
      console.log(newObj);// ['一一', '二二', '三三', undefined]

 20.includes()

判断一个数组是否包含一个指定的值。

      const arr = [10, 20, 30, 40];
      console.log(arr.includes(10)); //true
      console.log(arr.includes(1)); //false
      console.log(arr.includes(15)); //false

21.indexOf()

搜索数组中的元素,并返回它所在的位置(所要查找元素对应的数组下标)。

      const arr = [10, 20, 30, 40];
      console.log(arr.indexOf(30)); //2(30对应的数组下标)

      const fruits = ["Banana", "Orange", "Apple", "Mango"];
      console.log(fruits.indexOf("Apple"));//2

22.isArray()

判断对象是否为数组。

      const fruits = ["Banana", "Orange", "Apple", "Mango"];
      const aa = { 0: "1", 1: "2", 2: "3" };
      console.log(Array.isArray(fruits)); //true
      console.log(Array.isArray(aa)); //false

23.lastIndexOf

搜索数组中的元素,并返回它最后出现的位置。

      const arr = [1, 3, 5, 3, 2, 7, 9, 1, 10];
      console.log("数字1最后出现的数组下标为:",arr.lastIndexOf(1)); //数字1最后出现的数组下标为: 7

24.reduce()

将数组元素计算为一个值(从左到右)。

      const arr = [65, 44, 12, 4];

      const result = arr.reduce((item1, item2) => {
        console.log(item1, item2);
        return item1 + item2;
      });
      console.log(result);

reduceRight()

将数组元素计算为一个值(从右到左)。

      const arr = [65, 44, 12, 4];

      const result = arr.reduceRight((item1, item2) => {
        console.log(item1, item2);
        return item1 + item2;
      });
      console.log(result);

25.reverse()

反转数组的元素顺序。

      const arr = [1, 2, 3, 4];
      console.log(arr.reverse()); //[4 , 3, 2, 1]

 26.toString()

把数组转换为字符串,并返回结果。

      const name = ["aaa", "bbb", "ccc", "ddd"];
      console.log(name.toString()); //aaa,bbb,ccc,ddd

27.valueOf()

返回数组对象的原始值。valueOf() 方法返回 Array 对象的原始值。

      const name = ["aaa", "bbb", "ccc", "ddd"];
      console.log(name.valueOf()); // ['aaa', 'bbb', 'ccc', 'ddd']
      console.log(name); // ['aaa', 'bbb', 'ccc', 'ddd']
      console.log(name == name.valueOf()); //true

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值