js中数组的方法

已于 2023-06-28 11:22:16 修改
阅读量980 收藏 6
点赞数 1
分类专栏： 前端面试题 JavaScript 文章标签： javascript 前端 开发语言
于 2022-08-05 09:29:51 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/fangqi20170515/article/details/126020678
版权

js中数组的方法


pop、push、reverse、shift、sort、splice、unshift、copyWithin、fill修改了数组自身的值。

方法注释
*push()可以向数组末尾中添加一个或多个元素，并返回数组新的长度（影响原来的数组）
pop()删除数组的最后一个元素，并将被删除的元素作为返回值返回（影响原来的数组）
unshift()数组开头添加一个或多个元素，并且返回新的数组长度（影响原来的数组）
shift()删除数组的第一个元素，并将被删除的元素作为返回值返回
slice()从已有的数组返回选定的元素。该方法不会影响原数组，而是将截取到的元素封装到一个新数组中返回。
*splice()删除数组中的指定元素。使用splice（）会影响到原数组，会将指定元素从原数组中删除，并将被删除的元素作为返回值返回。
*concat()可以连接两个或多个数组，并将新的数组返回。该方法不会对原数组产生影响。
*join()将数组转换为一个字符串，该方法不会对原数组产生影响，而是将转换后的字符串作为结果返回。
reverse()用来反转数组（前边的去后边，后边的去前边）。该方法影响到原数组
sort()对数组元素进行排序，该方法会影响原数组，默认按照Unicode编码进行排序；
*forEach()对数组进行遍历
*filter( )用于把数组中的某些元素过滤掉，将满足条件的元素组成一个新数组并返回，不会对原数组产生影响，不能过滤空数组。
*map()使用map()会返回一个新数组，该新数组的元素是经过过滤(逻辑处理)过的函数。
*reduce()累加器，把上一次计算的值，给下一次计算进行相加
*some()用于检测数组中的元素是否满足指定条件。
*every()方法用于检测数组所有元素是否都符合指定条件

1、push()

  可以向数组末尾中添加一个或多个元素，并返回数组新的长度（影响原来的数组）

let arr=[1,3,6];
arr.push(6,9,0);
console.log(arr);//[ 1, 3, 6, 6, 9, 0 ]

2、pop()

  删除数组的最后一个元素，并将被删除的元素作为返回值返回（影响原来的数组）

let arr=[2,4,74,8];
const result=arr.pop();
console.log(result);//8
console.log(arr);//[ 2, 4, 74 ]

3、unshift()

  数组开头添加一个或多个元素，并且返回新的数组长度（影响原来的数组）

let arr=[3,5,7,2];
arr.unshift(666,2,5);
console.log(arr);//[666, 2, 5, 3,5, 7, 2]

4、shift()

  删除数组的第一个元素，并将被删除的元素作为返回值返回

let arr=[27,3,5,1,7];
let result=arr.shift()
console.log(result);//27
console.log(arr);//[ 3, 5, 1, 7 ]

5、slice()

  从已有的数组返回选定的元素。该方法不会影响原数组，而是将截取到的元素封装到一个新数组中返回。

参数：

  1. 截取开始的位置的索引，包含开始位置的索引（必需）
  2. 截取结束的位置的索引，不包括结束位置的索引。若第二个参数不写，则会截取从开始索引往后的所有元素；如果传递一个负值，则从后往前计算。
let arr = [2, 4, 7, 2, 8];

  第一个参数为正数，第二个参数为正数

let result=arr.slice(0,2);
console.log(result);//[ 2, 4 ]
console.log(arr);//[ 2, 4, 7, 2, 8 ]

  第一个参数为正数，第二个参数为负数

let result=arr.slice(2,-1);
console.log(result);//[ 7, 2 ]

  第一个参数为负数，第二个参数为负数

let result=arr.slice(-4,-1);
console.log(result);//[ 4, 7, 2 ]

  第一个参数为正数，第二个参数不写，截取从开始索引往后的所有元素

let result=arr.slice(3);
console.log(result);//[ 2, 8 ]

  第一个参数为负数，第二个参数不写，从后往前计算，截取从开始索引往后的所有元素

let result=arr.slice(-4);
console.log(result);//[ 4, 7, 2, 8 ]

6、splice()

  删除数组中的指定元素。使用splice（）会影响到原数组，会将指定元素从原数组中删除，并将被删除的元素作为返回值返回。

参数：

  1. 开始位置的索引（必需）;
  2. 删除的数量（不能为负数）；
  3. 第三个及以后，可以传递一些新的元素，这些元素将会自动插入到开始位置索引前边
let arr=[2,4,8,1,4,7,3];

  第一个参数为正数，第二个参数不写，删除从开始索引往后的所有元素


let result=arr.splice(4);
console.log(result);//[ 4, 7, 3 ]
console.log(arr);//[ 2, 4, 8, 1 ]

  第一个参数为负数，第二个参数不写，从后往前计算，删除从开始索引往后的所有元素；

let result=arr.splice(-2);
console.log(result);//[ 7, 3 ]
console.log(arr);//[ 7, 3 ]

  第一个参数为正数，第二个参数正数，删除从开始索引往后指定的数量；

let result=arr.splice(4,2);
console.log(result);//[ 4, 7 ]
console.log(arr);//[ 2, 4, 8, 1, 3 ]

  第一个参数为负数，第二个参数正数，从后往前计算，删除从开始索引往后指定的数量；

let result=arr.splice(-5,2);
console.log(result);//[ 8, 1 ]
console.log(arr);//[ 2, 4, 4, 7, 3 ]

  三个及三个以上参数，自动插入到开始位置索引前边

let result=arr.splice(5,1,999,666,555);
console.log(result);//[ 7 ]
console.log(arr);//[2,   4,   8, 1, 4,999, 666, 555, 3]

7、concat()

  可以连接两个或多个数组，并将新的数组返回。该方法不会对原数组产生影响。

let arr1 = ['arr1',28,  27];
let arr2 = ['arr2',29, 19, 0, 42];
let arr3 = ['arr3', 78, 36];
let result1 = arr1.concat(arr3);
let result2=arr2.concat(arr1,arr3);
console.log(result1);//[ 'arr1', 28, 27, 'arr3', 78, 36 ]
console.log(result2);//['arr2', 29, 19,0, 42, 'arr1',28,27, 'arr3',78,36]

8、join()

  将数组转换为一个字符串，该方法不会对元数组产生影响，而是将转换后的字符串作为结果返回。

let arr = [1, 2, 3, 4, 5];
let result = arr.join()
console.log(typeof result, result);//string 1,2,3,4,5
console.log(typeof arr, arr);//object [ 1, 2, 3, 4, 5 ]

9、reverse()

  用来反转数组（前边的去后边，后边的去前边）。该方法影响到原数组

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

10、sort()

  对数组元素进行排序，该方法会影响原数组，默认按照Unicode编码进行排序；

let arr=['赵六','李四','王麻子','张三','王五','钱七'];
arr.sort();
console.log(arr);//[ '张三', '李四', '王五', '王麻子', '赵六', '钱七' ]

  即使对于纯数字的数字，使用sort()进行排序时，也会按照Unicode编码进行排序，所以对数值进行排序时，可能会得到错误的结果。

let arr=[2,8,99,5,88,9,22];
arr.sort();
console.log(arr);//[2, 22,  5, 8,88,  9, 99]

  我们可以自己来指定排序的规则。可以在sort（）添加一个回调函数，来指定排序规则。回调函数中需要定义两个形参，浏览器将会分别使用数组中的元素作为实参去调用回调函数。使用哪个元素调用不确定，但是肯定的是在数组中a一定在b前面。
  浏览器会根据回调函数的返回值来觉得元素的顺序，如果返回大于0的值，则元素会交换位置；如果返回一个小于0的值，则元素位置不变；如果返回一个0，则认为两个元素相等，也不会交换位置。

let arr = [2, 3, 41, 5, 21, 11];
arr.sort(function (a, b) {
    // document.write("a="+a);
    // document.write("b="+b);
    /*  if(a>b){
          //前边的大，返回的值大于0，交换位置
          return 1;
      }else if(a<b){
          //前边的大，返回的值小于0，不交换位置
          return -1;
      }else {
          //如果两个值相等，返回的值等于0，不交换位置
          return 0;
      }*/
    //升序，如果需要升序排列，则返回a-b
    // return a - b;
    //降序，如果需要降序排列，则返回b-a
    return b-a;
});
console.log(arr);//[ 41, 21, 11, 5, 3, 2 ]

11、forEach()

  对数组进行遍历， 无法使用 break 和continue，可以使用return实现continue关键字的效果

参数

  1. 每一个元素（必需）
  2. 每个元素的下标（可选）
  3. 当前元素所属的数组对象。（可选）
const arr = [1, 5, 3, 8, 4];
arr.forEach((item, index, arr) => {
    if (index === 3) {//下标为3时跳过当次
        return;
    }
    console.log("元素", item, '下标', index, '遍历的数组', arr);
})

在这里插入图片描述

forEach可以暂停么？可以使用抛出异常进行暂停；

const array = [1, 2, 3, 4, 5];
try {
    array.forEach((item, index, arr) => {
        console.log("元素", item);//数组的元素
        if (index === 2) {
            throw  new Error("中断")
        }
    })
} catch (err) {
    console.log(err);
}

在这里插入图片描述

12、filter()

  用于把数组中的某些元素过滤掉，将满足条件的元素组成一个新数组并返回，不会对原数组产生影响，不能过滤空数组。

参数

  1. 每一个元素（必需）
  2. 每个元素的下标（可选）
  3. 当前元素所属的数组对象。（可选）
const arr=[{name:'张三',sex:'女'},{name:'王五',sex:'男'},{name:'赵六',sex:'女'},{name:'钱七',sex:'女'}]
let newArr=arr.filter((item,index,arr)=>{
    //返回性别为“女”的元素
    return item.sex==='女'
})
console.log('arr', arr);
console.log('newArr', newArr);

在这里插入图片描述

13、map()

  使用map()会返回一个新数组，该新数组的元素是经过过滤(逻辑处理)过的函数。

参数

  1. 每一个元素（必需）
  2. 每个元素的下标（可选）
  3. 当前元素所属的数组对象。（可选）

注意：
  map()不会对空数组进行检测。
  map()不会改变原始数组。
  map() 函数的作用是对数组中的每一个元素进行处理，返回新的元素。

const arr = [1,4,2,8]
let newArr = arr.map((item, index, arr) => {
    if (item===8) {
        item=88888
    }
    return item
})
console.log('arr', arr);//arr [ 1, 4, 2, 8 ]
console.log('newArr', newArr);//newArr [ 1, 4, 2, 88888 ]

14、reduce()

  累加器，把上一次计算的值，给下一次计算进行相加。

参数

  1. prev（之前计算过的值）
  2. next（之前计算过的下一个的值）
  3. index每个元素的下标（可选）
  4. arr当前元素所属的数组对象。（可选）
const arr = [5,25,35,45]
const result = arr.reduce(function(prev,next,index,arr){
    console.log('prev', prev,index);
    console.log('next', next);
    console.log('prev + next', prev + next);
    return prev + next;
})
console.log(result);

在这里插入图片描述

15、some()

some()用于检测数组中的元素是否满足指定条件。
some() 方法会依次执行数组的每个元素：

  1. 如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。
  2. 如果没有满足条件的元素，则返回false。
  3. some() 不会对空数组进行检测。
  4. some() 不会改变原始数组。

参数

  1. 每一个元素（必需）
  2. 每个元素的下标（可选）
  3. 当前元素所属的数组对象。（可选）
const arr=[1,2,3,4,5];
const result=arr.some(item=>{return item===5});
console.log(result);//true
const temp=arr.some(item=>{return item===8})
console.log(temp);//false

16、every()

every() 方法用于检测数组所有元素是否都符合指定条件；
every() 方法使用指定函数检测数组中的所有元素：

  1. 如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测。
  2. 如果所有元素都满足条件，则返回 true。
  3. every() 不会对空数组进行检测。
  4. every() 不会改变原始数组。

参数

  1. 每一个元素（必需）
  2. 每个元素的下标（可选）
  3. 当前元素所属的数组对象。（可选）
const arr=[1,2,3,4,5];
const result=arr.every(item=>{return item===1});
console.log(result);//false
const arr1=[3,3,3,3,3];
const temp1=arr1.every(item=>{return item===3});
console.log(temp1);//true
学习前端的渣渣
关注
  • 1
    点赞
  • 踩
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
JS中数组重排序方法
11-28
1.数组中已存在两个可直接用来重排序的方法：reverse（）和sort（）。 reverse()和sort（）方法的返回值是经过排序后的数组。reverse（）方法会反转数组项的顺序： var values=[1,2,3,4,5]; values.reverse(); alert(values); //5,4,3,2,1 在默认情况下，sort（）方法按升序排列数组，sort（）方法会调用每个数组项的toString（）转型方法，然后比较得到字符串，确定如何排序。即使数组中的每一项都是数值，sort（）方法比较的也是字符串： var values = [0,1,5,10,15]; val
javascript中数组方法汇总
10-23
本文给大家详细汇总了一下javascript中的数组方法，十分的全面细致，有需要的小伙伴可以参考下。
JS数组操作---删除，arr.pop()方法从数组中删除最后一个元素，并返回该元素的值，arr.shift() 删除第一个值，arr.splice()方法，删除指定元素，arr.splice，从第一
最新发布
weixin_54048131的博客
05-24 188
数组的增删改查的操作 arr.pop() 删除数组的写法 arr.pop()是去掉最后一个值 arr.shift() 删除第一个值 arr.splice()方法，删除指定元素，arr.splice()方法，删除指定元素 arr.splice(start,deleteCount)，arr.splice(起始位置，删除几个元素) arr.splice(1) 只写第一个 只写第一个，意味着从后面全部删掉了 arr.splice(1,1) 是从索引号1的位置开始删，只删除
javascript删除数组最后一个元素的几种方式
热门推荐
qq_46402927的博客
06-13 2万+
javascript删除数组最后一个元素的几种方式 输入数组[1, 2, 3, 4] 输出 [1, 2, 3] 第一种方式：利用slice,【slice()方法可以从已有的数组中返回固定的元素】它返回的是一个新的数组。用法：slice(start,end) 它有两个参数 【satrt】是必须要填的它规定是从哪里开始选取的，如果是负数那么规定他开始从尾部算起以此类推。【end】可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数，那么切分的数组包含从 start 到数组结束的所有元
5.删除数组arr的最后一个元素，不改变原数组，结果返回新数组。
阿木木
11-17 3319
方法一：slice()方法；var a=[1,5,'ff','g','h','sd','g']; alert( deletelast(a)); function deletelast(arr){ return arr.slice(0,arr.length-1)； }方法二：concat()或slice()加pop(); function deletel
4.js中next()方法与prev()方法使用
qq_44438941的博客
10-12 1206
日常总结
(js)如何删除数组的最后一项
nyf_unknow的博客
09-20 1845
效果：
删除数组最后一个元素、第一个元素、某个指定下标的元素、某个指定元素的方法、 获取两个数组之前的交集和并集
小草莓的博客
08-16 2862
① pop：默认删除数组最后一个元素【会改变原数组，返回被删除的元素arr.pop() // pop删除return arr② slice：从原有数组中提取要保留的元素【不会改变原数组，返回新数组，是浅拷贝newArr = arr.slice(0, arr.length - 1) // 方法一// newArr = arr.slice(0, -1) // 方法二slice不会修改原数组，只会返回一个浅复制了原数组中的元素的一个新数组。arr.push('原数组arr新加的值')
删除数组最后一个元素
yujie的博客
07-09 1万+
题目描述 删除数组 arr 最后一个元素。不要直接修改数组 arr，结果返回新的数组 示例1 输入 [1, 2, 3, 4] 输出 [1, 2, 3] 1.利用数组的length function truncate(arr) { var newarr=arr.slice(0); newarr.length=newarr.length-1; retu...
js 数组随手记
liyongjian12的博客
01-09 330
1、JavaScript concat() 方法 concat() 方法用于连接两个或多个数组。该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。 [1,2,3].concat(4); arr.concat(arr2,arr3) 2、slice()方法 slice() 方法可从已有的数组中返回选定的元素。返回一个新的数组，包含从 start 到 end （不包括该元素）的...
js中数组的常见方法
01-08
js中数组的常见方法 1.push()和pop() push(): 把里面的内容添加到数组末尾，并返回修改后的长度。 pop()：移除数组最后一项，也就是下标为length-1的项，返回移除的那个值，减少数组的length。 书写格式：arr.push...
js小甜点----数组最后一个元素的获取
I_Do_Well的博客
09-22 1748
slice方法是从数组中返回特定的元素，并作为一个新数组的元素，方法选择从给定开始的索引到结束索引中间的元素，但不包括结束索引的元素，slice()方法不会修改原数组，索引值允许为赋值，为负值就从数组的尾部计算索引。当slice()中索引值只有-1时，所返回的新数组中的元素就是原数组最后一个元素。pop()方法是从数组中删除数组的最后一个元素，并且讲此元素返回，而且此方法会改变原数组。如果数组为空数组，则返回undefined，并且不会改变空数组。2.通过slice 方法获取。3.通过pop方法获取。
js数组元素怎样删除最后一个元素
qq_32353979的博客
05-05 2万+
var arr = [ 1, 2, 3, 4, 5 ]; //原始数组 alert("原始数组：" + arr);// 1,2,3,4,5 //删除并且返回第一个元素 alert("执行arr.shift() 返回 ：" + arr.shift());//1 alert("数组：" + arr);//2,3,4,5 //删除并且返回最后一个元素 alert("执行arr.pop() 返回：" +
js数组中添加、删除、更改、查询元素方法
qq_44438941的博客
09-01 2422
日常总结
【JavaScript 教程】第六章 数组20—pop() ：从数组末尾删除一个元素
web前端开发
10-14 2442
来源 |https://www.javascripttutorial.net/翻译 | 杨小爱在今天的文章教程中，我们将一起来学习如何使用 JavaScript Array pop() 方法从数组中删除最后一个元素。JavaScript Array pop() 方法介绍Array.prototype.pop() 方法从数组中移除最后一个元素并返回移除的元素，下面是 pop() 方法的语法：ar...
如何快速获取数组最后一个值
weixin_48723799的博客
06-06 7998
在不知道快速获取数组最后一个值时，我们的写法是： 我们需要获取它的长度再去减1，然后通过下标得到最后一个值，本人认为这样的写法会比较麻烦，其实我们可以使用另外一种方式 = 》Array.prototype.at() 方法接收一个整数值并返回该索引的项目，允许正数和负数。负整数从数组中的最后一个项目开始倒数。方括号符号没有问题。例如，将返回第一个项目。然而，对于后面的项目，不要使用array.length，例如，对于最后一个项目，可以调用。(参见以下示例) 语法 at(index) Copy to C
删除数组arr最后一个元素。不要接修改数组arr，结果返回新的数组
二三的博客
03-11 1929
题目描述 删除数组 arr 最后一个元素。不要直接修改数组 arr，结果返回新的数组 输入 [ 1, 2, 3, 4 ] 输出 [ 1, 2, 3 ] 代码如下 第一种方法 function truncate(arr) { let newArr = arr.slice(0, arr.length); newArr.pop(); return newArr; } 代码解析：      题目要求删除数组最后一个元素，但不能直接修改原数组arr，且
js删除数组最后一个元素
weixin_44090040的博客
10-22 2677
truncate(arr) { return arr.filter(function(v, i, ar) { return i !== ar.length - 1 }) },
javascript中数组方法
10-11
JavaScript中常用的数组方法有： 1. push()：向数组末尾添加一个或多个元素，并返回新的长度。 2. pop()：删除数组末尾的元素，并返回该元素的值。 3. shift()：删除数组第一个元素，并返回该元素的值。 4. unshift()：向数组开头添加一个或多个元素，并返回新的长度。 5. slice()：返回一个新的数组，包含从开始到结束（不包括结束）的所有元素。 6. splice()：向/从数组中添加/删除元素，然后返回被删除的元素。 7. concat()：连接两个或多个数组，并返回新的数组。 8. join()：将数组中所有元素转换为字符串，并返回字符串。 9. indexOf()：返回指定元素在数组中第一次出现的位置，如果没有找到则返回-1。 10. lastIndexOf()：返回指定元素在数组中最后一次出现的位置，如果没有找到则返回-1。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值