经典面试题数组常用方法都有哪些

1.数组常用方法之 push（）（==改变原数组，产生新数组==）

  • push 是用来在数组的末尾追加一个元素,返回添加以后的长度

    var arr = [1, 2, 3]
​
// 使用 push 方法追加一个元素在末尾
arr.push(4)
​
console.log(arr) // [1, 2, 3, 4]
​
var res = arr.push(1,2,3,34);
​
res//8  
​
​

2.数组常用方法之 pop（）（==改变原数组，产生新数组==）

  • pop 是用来删除数组末尾的一个元素,返回删除的元素

    var arr = [1, 2, 3]
​
// 使用 pop 方法删除末尾的一个元素
var res = arr.pop()
​
console.log(arr) // [1, 2]

3.数组常用方法之 unshift（）（==改变原数组，产生新数组==）

  • unshift 是在数组的最前面添加一个元素

    var arr = [1, 2, 3]
​
// 使用 unshift 方法想数组的最前面添加一个元素
arr.unshift(4)
​
console.log(arr) // [4, 1, 2, 3]

4.数组常用方法之 shift（）（==改变原数组，产生新数组==）

  • shift 是删除数组最前面的一个元素

    var arr = [1, 2, 3]
​
// 使用 shift 方法删除数组最前面的一个元素
arr.shift()
​
console.log(arr) // [2, 3]

5.数组常用方法之 splice（==改变原数组==）

  • splice 是截取数组中的某些内容，按照数组的索引来截取

  • 语法： splice(从哪一个索引位置开始，截取多少个，替换的新元素) （第三个参数可以不写）

    var arr = [1, 2, 3, 4, 5]
​
// 使用 splice 方法截取数组
var res = arr.splice(1, 2)
​
console.log(arr) // [1, 4, 5]
console.log(res)//[2,3]- `arr.splice(1, 2)` 表示从索引 1 开始截取 2 个内容
- 第三个参数没有写，就是没有新内容替换掉截取位置```javascriptvar arr = [1, 2, 3, 4, 5]// 使用 splice 方法截取数组arr.splice(1, 2, '我是新内容')console.log(arr) // [1, '我是新内容', 4, 5]
  1）、删除元素,并返回删除的元素
​
可以删除任意数量的项，只需指定 2 个参数：要删除的第一项的位置和要删除的项数。例如， splice(0,2)会删除数组中的前两项。
​
var arr = [1,3,5,7,9,11];
​
var arrRemoved = arr.splice(0,2);
​
console.log(arr); //[5, 7, 9, 11]
​
console.log(arrRemoved); //[1, 3]
​
2）、向指定索引处添加元素
​
可以向指定位置插入任意数量的项，只需提供 3 个参数：起始位置、 0（要删除的项数）和要插入的项。例如，splice(2,0,4,6)会从当前数组的位置 2 开始插入 4 和 6。
​
var array1 = [22, 3, 31, 12];
​
array1.splice(1, 0, 12, 35); //[]
​
console.log(array1); // [22, 12, 35, 3, 31, 12]
​
3）、替换指定索引位置的元素
​
可以向指定位置插入任意数量的项，且同时删除任意数量的项，只需指定 3 个参数：起始位置、要删除的项数和要插入的任意数量的项。插入的项数不必与删除的项数相等。例如，splice (2,1,4,6)会删除当前数组位置 2 的项，然后再从位置 2 开始插入 4 和 6。
​
const array1 = [22, 3, 31, 12];
​
array1.splice(1, 1, 8); //[3]
​
console.log(array1); // [22, 8, 31, 12] 作者：物理达人Physics侯老师 https://www.bilibili.com/read/cv9715493/ 出处：bilibili

  • arr.splice(1, 2, '我是新内容') 表示从索引 1 开始截取 2 个内容

  • 然后用第三个参数把截取完空出来的位置填充

6.数组常用方法之 reverse（==改变原数组，产生新数组==）

  • reverse 是用来反转数组使用的

    var arr = [1, 2, 3]
​
// 使用 reverse 方法来反转数组
arr.reverse()
​
console.log(arr) // [3, 2, 1]

7.数组常用方法之 sort（==改变原数组，产生新数组==）

  • sort 是用来给数组排序的（默认按照字典排序 先按==照第一位排序-==如果第一位相等就按照第二位）

    var arr = [2, 3, 1]
​
// 使用 sort 方法给数组排序
arr.sort()
​
console.log(arr) // [1, 2, 3]

    • 这个只是一个基本的简单用法

    // 升序arr4.sort(function (a, b) {return a - b})// 降序arr4.sort(function (a, b) {return b - a})
            let arr5 = [{username: 'zhangsan',age: 19},{username: 'lisi',age: 10},]// 按照对象的年龄 降序  // a ，b  数组的元素arr5.sort(function (a, b) {return b.age - a.age})

8.数组常用方法之 concat（==不====改变原数组==）

  • concat 是把多个数组进行拼接

  • 和之前的方法有一些不一样的地方，就是 concat ==不会改变原始数组，而是返回一个新的数组==

    var arr = [1, 2, 3]
​
// 使用 concat 方法拼接数组
var newArr = arr.concat([4, 5, 6])
​
console.log(arr) // [1, 2, 3]
console.log(newArr) // [1, 2, 3, 4, 5, 6]

    • 注意： ==concat 方法不会改变原始数组==

9.数组常用方法之 join==（不会改变原始数组，而是把链接好的字符串返回）==

  • join 是把数组里面的每一项内容链接起来，变成一个字符串

  • 可以自己定义每一项之间链接的内容 join(要以什么内容链接)默认使用逗号作为分隔符

  • 不会改变原始数组，而是把链接好的字符串返回

    var arr = [1, 2, 3]
​
// 使用 join 链接数组
var str = arr.join('-')
​
console.log(arr) // [1, 2, 3]
console.log(str) // 1-2-3

    • 注意： join 方法不会改变原始数组，而是返回链接好的字符串

10.slice 复制数组的一部分 ==（不改变原始数组，返回一个新的数组）==

       var arr9 = [9,8,7,6,5,4,3,2];// 参数 两个  开始位置  结束位置,不包含结束位置,不改变原数组var res9 = arr9.slice(1,3)console.log(res9)//[8, 7]// 第二个参数不传入,复制到最后console.log(arr9.slice(1))//[8, 7, 6, 5, 4, 3, 2]// 如果传入负数,倒着数位置,最后一个是 -1console.log(arr9.slice(1,-2))// [8, 7, 6, 5, 4]

注：

如果之只传入一个大于数组长度的参数，则返回一个空数组
无论是如何提取数组元素，原数组始终保持不变

ES5 中常见的数组常用方法

11.indexOf

接收两个参数：要查找的项和（可选的）表示查找起点位置的索引。

indexOf()：从数组的开头（位置 0）开始向后查找。

lastIndexOf：从数组的末尾开始向前查找。

这两个方法都返回要查找的项在数组中的位置，或者在没找到的情况下返回-1。在比较第一个参数与数组中的每一项时，会使用全等操作符。

  • indexOf 用来找到数组中某一项的索引

  • 语法： indexOf(你要找的数组中的项)

    var arr = [1, 2, 3, 4, 5]
​
// 使用 indexOf 超找数组中的某一项
var index = arr.indexOf(3)
​
console.log(index) // 2

    • 我们要找的是数组中值为 3 的那一项

    • 返回的就是值为 3 的那一项在该数组中的索引

  • 如果你要找的内容在数组中没有，那么就会返回 -1

    var arr = [1, 2, 3, 4, 5]
​
// 使用 indexOf 超找数组中的某一项
var index = arr.indexOf(10)
​
console.log(index) // -1

    • 你要找的值在数组中不存在，那么就会返回 -1

12.forEach

  • 和 for 循环一个作用，就是用来遍历数组的

  • 这个方法没有返回值。参数都是 function 类型，默认有传

  • 语法：arr.forEach(function (item, index, arr) {})

    var arr = [1, 2, 3]
​
// 使用 forEach 遍历数组
arr.forEach(function (item, index, arr) {// item 就是数组中的每一项// index 就是数组的索引// arr 就是原始数组console.log('数组的第 ' + index + ' 项的值是 ' + item + '，原始数组是', arr)
})

    • forEach() 的时候传递的那个函数，会根据数组的长度执行

    • 数组的长度是多少，这个函数就会执行多少回

13.map ==（不改变原数组，返回新数组）==

  • 和 forEach 类似，只不过可以对数组中的每一项进行操作，==返回一个新的数组==

    var arr = [1, 2, 3]
​
// 使用 map 遍历数组
var newArr = arr.map(function (item, index, arr) {// item 就是数组中的每一项// index 就是数组的索引// arr 就是原始数组return item + 10
})
​
console.log(newArr) // [11, 12, 13]

14.filter==（不改变原数组，返回新增数组）==

  • 和 map 的使用方式类似，按照我们的条件来筛选数组

  • 把原始数组中满足条件的筛选出来，组成一个新的数组返回

    var arr = [1, 2, 3]
​
// 使用 filter 过滤数组
var newArr = arr.filter(function (item, nindex, arr) {// item 就是数组中的每一项// index 就是数组的索引// arr 就是原始数组return item > 1
})
​
console.log(newArr) // [2, 3]

    • 我们设置的条件就是 > 1

    • 返回的新数组就会是原始数组中所有 > 1 的项

    15.every 返回布尔值

    判断 是否数组所有的元素都满足条件

    let flag =  arr.every(function(item,index,arr){return 条件})let res4 = arr4.every(function (v) {return v >= 18})console.log(res4);

16.some 返回布尔值

判断是否数组有一些元素满足条件

let flag =  arr.some(function(item,index,arr){return 条件})let res5 = arr4.some(function (v) {return v >= 18})console.log(res5);//true

17.find

查找数组中第一个满足条件的元素

        var arr6 = [10, 19, 17, 20];let res6 = arr6.find(function (v, i) {return v === 19})console.log(res6);
​var arr7 = [{ id: 1, name: 'zs' }, { id: 2, name: 'lisi' }];
​var obj = arr7.find(function (v) {return v.id == 2})console.log(obj);console.log(obj.name);
​

18.findIndex

查找数组中第一个满足条件的元素的下标

var res7 = arr7.findIndex(function (v) {return v.id == 2})console.log(res7);

19.reduce

let res8 = arr8.reduce(function (a, b) {console.log(a, b);//a 第一次是 数组中第一个元素 //10+19 =29 
​// 然后几次 就是前面 数字的和
​//a = 29  // b 17  return a + b;})console.log(res8);
​let res9 = arr8.reduce(function (a, b) {console.log(a, b);//a 是累积变量  ，1000就是累积变量的初始值// b 是数组的元素return a + b;}, 1000)console.log(res9);

20.fill() es6 新增 ==（会改变原数组）==

fill()方法能使用特定值填充数组中的一个或多个元素。当只是用一个参数时，该方法会用该参数的值填充整个数组。

let arr = [1, 2, 3,  cc , 5];
​
arr.fill(1);
​
console.log(arr);//[1,1,1,1,1];

如果不想改变数组中的所有元素，而只是想改变其中一部分，那么可以使用可选的起始位置参数与结束位置参数（不包括结束位置的那个元素）

3 个参数： 填充数值，起始位置参数，结束位置参数（不包括结束位置的那个元素）

let arr = [1, 2, 3,  arr , 5];
​
arr.fill(1, 2);
​
console.log(arr);//[1,2,1,1,1]
​
arr.fill(0, 1, 3);
​
console.log(arr);//[1,0,0,1,1];

21.includes() es7 新增，返回布尔值

includes() 方法用来判断一个数组是否包含一个指定的值，如果是返回 true，否则 false。

参数有两个，其中第一个是（必填）需要查找的元素值，第二个是（可选）开始查找元素的位置

const array1 = [22, 3, 31, 12,  arr ];
​
const includes = array1.includes(31);
​
console.log(includes); // true
​
const includes1 = array1.includes(31, 3); // 从索引3开始查找31是否存在
​
console.log(includes1); // false

需要注意的是：includes使用===运算符来进行值比较，仅有一个例外：NaN 被认为与自身相等。

let values = [1, NaN, 2];
​
console.log(values.indexOf(NaN));//-1
​
console.log(values.includes(NaN));//true

22.toLocaleString() 和 toString()

将数组转换为字符串

const array1 = [22, 3, 31, 12];
​
const str = array1.toLocaleString();
​
const str1 = array1.toString();
​
console.log(str); // 22,3,31,12
​
console.log(str1); // 22,3,31,12

23.copyWithin() [es6 新增]==（该方法会改变现有数组）==

copyWithin() 方法用于从数组的指定位置拷贝元素到数组的另一个指定位置中。

//将数组的前两个元素复制到数组的最后两个位置
​
let arr = [1, 2, 3,  arr , 5];
arr.copyWithin(3, 0);
​
console.log(arr);//[1,2,3,1,2]

默认情况下，copyWithin()方法总是会一直复制到数组末尾，不过你还可以提供一个可选参数来限制到底有多少元素会被覆盖。这第三个参数指定了复制停止的位置（不包含该位置本身）。

let arr = [1, 2, 3,  arr , 5, 9, 17];
​
//从索引3的位置开始粘贴
​
//从索引0的位置开始复制
​
//遇到索引3时停止复制
​
arr.copyWithin(3, 0, 3);
​
console.log(arr);//[1,2,3,1,2,3,17]

24.flat() 和 flatMap() es6 新增（==该方法返回一个新数组，不改变原数组。）==

flat() 方法会按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。

该方法返回一个新数组，对原数据没有影响。

参数： 指定要提取嵌套数组的结构深度，默认值为 1。

const arr1 = [0, 1, 2, [3, 4]];
​
console.log(arr1.flat());
​
// expected output: [0, 1, 2, 3, 4]
​
const arr2 = [0, 1, 2, [[[3, 4]]]];
​
console.log(arr2.flat(2));
​
// expected output: [0, 1, 2, [3, 4]]
​
//使用 Infinity，可展开任意深度的嵌套数组
​
var arr4 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];
​
arr4.flat(Infinity);
​
// [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
​
// 扁平化数组空项,如果原数组有空位，flat()方法会跳过空位
​
var arr4 = [1, 2, , 4, 5];
​
arr4.flat();
​
// [1, 2, 4, 5]

flatMap()方法对原数组的每个成员执行一个函数，相当于执行Array.prototype.map(),然后对返回值组成的数组执行flat()方法。

该方法返回一个新数组，不改变原数组。

// 相当于 [[2, 4], [3, 6], [4, 8]].flat()
​
[2, 3, 4].flatMap((x) => [x, x * 2])
​
// [2, 4, 3, 6, 4, 8]

25、 entries(),keys() 和 values() 【ES6】

entries()，keys()和values() —— 用于遍历数组。它们都返回一个遍历器对象，可以用for...of循环进行遍历
区别是keys()是对键名的遍历、values()是对键值的遍历，entries()是对键值对的遍历
for (let index of [ a ,  b ].keys()) {
​
console.log(index);  
​
}  
​
// 0  
​
// 1  
​
for (let elem of [ a ,  b ].values()) {  
​
console.log(elem);
​}  
​
//  a  
​
//  b   
​
for (let [index, elem] of [ a ,  b ].entries()) {  
​
console.log(index, elem);
​}
​// 0 "a"
​// 1 "b"

如果不使用for...of循环，可以手动调用遍历器对象的next方法，进行遍历。

let letter = [ a ,  b ,  c ];  
​
let entries = letter.entries();
​
console.log(entries.next().value); // [0,  a ]  
​
console.log(entries.next().value); // [1,  b ]  
​
console.log(entries.next().value); // [2,  c ]

JS 如何终止 forEach 循环 break 报错，return 跳不出循环

  • 终止 forEach 可以使用 try catch 内部抛出错误，catch 捕获错误。

    let arr = [1, 2, 3]
try {arr.forEach(item => {if (item === 2) {throw('循环终止')}console.log(item)})
} catch(e) {console.log('e: ', e)
}
复制代码

当然我们大可以用其他方法代替

  • Array.prototype.some

    当 return true 的时候，会终止遍历

  • Array.prototype.every

    当 return false 的时候，会终止遍历

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/802106.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

实现 jwt 鉴权- SpringBoot + 微服务

实现 jwt 鉴权- SpringBoot + 微服务

目录 项目结构 主要步骤 auth-service里： 1. 配置 pom.xml 依赖 2. 实现HandlerInterceptor 接口的 preHandle 函数 3. 实现 WebMvcConfigurer 的 addInterceptors 接口 4. 生成 token 和验证 token 5. 登录接口示例 user-service 里： 6. 实现拦…
阅读更多...
Python-VBA函数之旅-ascii函数

Python-VBA函数之旅-ascii函数

ascii函数在Python中主要用于将对象(特别是字符和字符串)转换为它们的ASCII表示形式。这种转换在处理文本数据、调试代码以及确保文本以 ASCII 格式存储或传输时非常有用。常见应用场景有： 1、调试和文本处理：当处理包含非ASCII字符(如Unicode字符)的文…
阅读更多...
从概念到实践：揭开枚举与联合体在数字化创新时代的神秘面纱

从概念到实践：揭开枚举与联合体在数字化创新时代的神秘面纱

欢迎来到白刘的领域 Miracle_86.-CSDN博客 系列专栏 C语言知识 先赞后看，已成习惯 创作不易，多多支持！ 在编程的世界中，枚举和联合体是两种非常基础且重要的数据结构。它们各自具有独特的特点和用途，为程序员提供…
阅读更多...
S参数介绍：双端口和四端口S参数有哪些

S参数介绍：双端口和四端口S参数有哪些

信号在传输过程中，并非完全不变，而是存在一定的损耗和变化。这类似于光的折射现象，在信号传输过程中，一部分信号会在输入端被反射回来，一部分信号会被传输到其它端口，还有一部分信号会在传输过程中被耗散。…
阅读更多...
ROS机器人未知环境自主探索功能包explore_lite最全源码详细解析（三）

ROS机器人未知环境自主探索功能包explore_lite最全源码详细解析（三）

本系列文章主要针对ROS机器人常使用的未知环境自主探索功能包explore_lite展开全源码的详细解析，并进行概括总结。 本系列文章共包含六篇文章，前五篇文章主要介绍explore_lite功能包中 explore.cpp、costmap_tools.h、frontier_search.cpp、costmap_clie…
阅读更多...
Linux输出输入重定向

Linux输出输入重定向

输出重定向 # echo 是打印内容 输出重定向，将123写进1.txt文件中 [rootlocalhost ~]# echo 123 > 1.txt # 将services文件的前5行写进1.txt中 [rootlocalhost ~]# head -5 services > 1.txt注意：输出重定向会先清空文件的内容，再进行写…
阅读更多...
C语言-函数指针-快速排序算法(书籍示例-入门)

C语言-函数指针-快速排序算法(书籍示例-入门)

概述 使用C语言，实现结构体多元素，排序算法（冒泡排序），这里使用示例：书籍示例讲解 函数简介 函数声明 void qsort(void *base, size_t nitems, size_t size, int (*compar)(const void *, const void*)) 参…
阅读更多...
初识23种设计模式：分类、原理与实际应用

初识23种设计模式：分类、原理与实际应用

目录 1. 简介2. 设计模式的分类概述3. 设计模式详解3.1 创建型模式（共5种）3.1.1 单例模式（Singleton）3.1.2 工厂方法模式（Factory Method）3.1.3 抽象工厂模式（Abstract Factory）3.1.…
阅读更多...
oracle 中的大页无法使用问题

oracle 中的大页无法使用问题

oracle 中的大页问题 今天巡检数据库的时候，发现有一个备库节点上的负载很大。这个备库基本无人使用。仅做延时查询使用，按理来说不应该有这么大负载， 环境说明 11.2.0.4 单节点dg库。 问题 大页不生效。且数据库所在服务器负载极大 top…
阅读更多...
高并发环境下的实现与优化策略

高并发环境下的实现与优化策略

在现代互联网应用中，高并发处理能力是衡量系统性能和稳定性的关键指标之一。尤其对于电商、社交、在线支付等业务场景，面对瞬间涌入的大规模用户请求，如何保证系统的稳定性和响应速度，对技术架构设计与优化提出了极高要求。本文将…
阅读更多...
【Linux】Supervisor 基础

【Linux】Supervisor 基础

要在Linux上启动Supervisor，你可以按照以下步骤进行操作： 确保你已经安装了Supervisor。使用适合你的Linux发行版的包管理器进行安装。例如，对于Ubuntu，可以运行以下命令安装Supervisor： sudo apt-get update sudo apt…
阅读更多...
在Java应用程序中嵌入百度地图的实现方法

在Java应用程序中嵌入百度地图的实现方法

在许多应用程序中，展示地图是一个常见的需求，特别是对于需要展示位置信息或者导航功能的应用。百度地图是一种常用的地图服务，本文将介绍如何在Java应用程序中嵌入百度地图，并提供一个简单易懂的示例代码。 1. 准备工作 在开始之…
阅读更多...
Leetcode:283.移动零

Leetcode:283.移动零

题目要求 给定一个数组 nums，编写一个函数将所有 0 移动到数组的末尾，同时保持非零元素的相对顺序。 请注意 ，必须在不复制数组的情况下原地对数组进行操作。 示例 1: 输入: nums [0,1,0,3,12] 输出: [1,3,12,0,0] 示例 2: 输入: nums [0…
阅读更多...
OAuth2.0客户端和服务端Java实现

OAuth2.0客户端和服务端Java实现

oauth2 引言 读了《设计模式之美》和《凤凰架构》架构安全篇之后，决定写一个OAuth2.0的认证流程的Demo，也算是一个阶段性的总结，具体原理实现见《凤凰架构》(架构安全设计篇)。 涉及到的源码可以从https://github.com/WeiXiao-Hyy/oauth2获…
阅读更多...
Digicert 证书

Digicert 证书

一、简介 在当今数字化时代，网络安全已成为全球关注的焦点。随着网络攻击和数据泄露事件的频发，企业和组织越来越重视保护自己的网络环境。在这种背景下，数字证书成为了确保网络通信安全的关键工具。作为数字证书行业的领导者，Di…
阅读更多...
2024.4.9记——C++多线程系列文章（五）之死锁

2024.4.9记——C++多线程系列文章（五）之死锁

引言 如果用单一的全局互斥保护所有共享数据，也即锁的粒度过大，例如在共享大量数据的系统中，这么做会消除并发带来的任何性能优势，原因是多线程系统由此受到强制限定，任意时刻都只准许运行其中一个线程，即…
阅读更多...
python应援灯牌代码

python应援灯牌代码

代码如下 import pygame import sys import random# 初始化Pygame pygame.init()# 设置窗口尺寸 WINDOW_WIDTH 800 WINDOW_HEIGHT 600 window_surface pygame.display.set_mode((WINDOW_WIDTH, WINDOW_HEIGHT)) pygame.display.set_caption(应援语跑马灯模拟)# 定义颜色 WH…
阅读更多...
Web API（六）之正则表达式

Web API（六）之正则表达式

Web API（六）之正则表达式 正则表达式正则基本使用元字符边界符量词范围字符类替换和修饰符change 事件判断是否有类正则表达式 正则表达式（Regular Expression）是一种字符串匹配的模式（规则） 使用场景： 例如验证表单：手机号表单要求用户只能输入11位的数字 (匹配)过滤…
阅读更多...
利用AI开源引擎：文本自动摘要提取API (可本地化部署)

利用AI开源引擎：文本自动摘要提取API (可本地化部署)

新闻摘要提取技术是一种高效的自然语言处理技术，它通过算法对新闻文章进行全面的语义理解和分析，自动抽取文章中的关键信息，生成简洁、连贯的摘要文本。该技术在多个领域都有着广泛的应用，下面将深入探讨其主要的应用场景。 开源项…
阅读更多...
【接口】HTTP(4)｜Session、Cookie、token有什么区别?

【接口】HTTP(4)｜Session、Cookie、token有什么区别?

HTTP是一种无状态的协议，服务器本身没有记忆功能，无法记住客户端之前是否有发送过请求，因此客户端每次发送的请求都是独立的 无状态：HTTP是一个无状态的协议。这句话里的无状态是什么意思？ - 知乎 1、为什么需要cookie…
阅读更多...
最新文章

Copyright @ 2022~2023