JavaScript 数组方法总结

JavaScript 数组方法总结

    • 创建数组
    • 访问和修改数组(长度 & 元素)
    • 添加和删除元素
    • 数组遍历
    • 元素查找
    • 过滤和映射
    • 归并和缩减
    • 数组的连接
    • 数组的扁平化
    • 数组的排序
    • 数组的反转
    • 数组的复制
    • 数组的测试
    • 数组的填充

创建数组

  • Array.of(...elements): 创建一个包含所有传入参数的新数组。
  • Array.from(arrayLike, mapFn, thisArg): 从类数组对象或可迭代对象创建一个新数组。
    let arr = Array.of(1, 2, 3); // [1, 2, 3]let arr = Array.from('hello'); // ['h', 'e', 'l', 'l', 'o']
    

访问和修改数组(长度 & 元素)

  • arr.length: 获取或设置数组的长度。
  • arr[index]: 访问或修改数组指定位置的元素。
    let arr = [1, 2, 3];
    console.log(arr.length); // 3
    arr.length = 2;
    console.log(arr); // [1, 2]let arr = [1, 2, 3];
    console.log(arr[1]); // 2
    arr[1] = 4;
    console.log(arr); // [1, 4, 3]
    

添加和删除元素

  • arr.push(...elements): 向数组末尾添加一个或多个元素,返回新的长度
  • arr.pop(): 删除并返回数组的最后一个元素
  • arr.unshift(...elements): 向数组开头添加一个或多个元素,返回新的长度
  • arr.shift(): 删除并返回数组的第一个元素
    let arr = [1, 2];
    arr.push(3, 4); // [1, 2, 3, 4]let arr = [1, 2, 3];
    let last = arr.pop(); // 3
    console.log(arr); // [1, 2]let arr = [1, 2];
    arr.unshift(0); // [0, 1, 2]let arr = [1, 2, 3];
    let first = arr.shift(); // 1
    console.log(arr); // [2, 3]
    
  • arr.splice(start, deleteCount, ...items): 从数组中删除或添加元素
    let arr = [1, 2, 3];
    arr.splice(1, 1, 'a'); // [1, 'a', 3]
    

数组遍历

  • arr.forEach(callback, thisArg): 对数组的每个元素执行一次提供的函数
    let arr = [1, 2, 3];
    arr.forEach((item, index) => {console.log(index, item);
    });
    

元素查找

  • arr.indexOf(searchElement, fromIndex): 返回数组中第一次找到的指定元素的索引,没有则返回 -1。
  • arr.lastIndexOf(searchElement, fromIndex): 返回数组中最后一次找到的指定元素的索引,没有则返回 -1。
  • arr.includes(searchElement, fromIndex): 判断数组是否包含指定的元素
    let arr = [1, 2, 3];
    arr.indexOf(2); // 1let arr = [1, 2, 3, 2];
    arr.lastIndexOf(2); // 3let arr = [1, 2, 3];
    arr.includes(2); // true
    
  • arr.find(callback, thisArg): 返回数组中满足提供的测试函数的第一个元素的值
  • arr.findIndex(callback, thisArg): 返回数组中满足提供的测试函数的第一个元素的索引
    let arr = [1, 2, 3];
    let found = arr.find(item => item > 1); // 2let arr = [1, 2, 3];
    let index = arr.findIndex(item => item > 1); // 1
    

过滤和映射

  • arr.filter(callback, thisArg): 创建一个新数组,其中包含所有通过提供函数实现的测试的元素
  • arr.map(callback, thisArg): 创建一个新数组,其中每个元素是对原数组中的每个元素调用一个提供函数后的返回值
    let arr = [1, 2, 3];
    let filtered = arr.filter(item => item > 1); // [2, 3]let arr = [1, 2, 3];
    let mapped = arr.map(item => item * 2); // [2, 4, 6]
    

归并和缩减

  • arr.reduce(callback, initialValue): 对数组中的每个元素执行一个由您提供的 reducer 函数(升序执行),将其结果汇总为单个返回值
  • arr.reduceRight(callback, initialValue): 与 reduce 类似,但从右到左执行
    let arr = [1, 2, 3];
    let sum = arr.reduce((acc, item) => acc + item, 0); // 6let arr = [1, 2, 3];
    let sum = arr.reduceRight((acc, item) => acc + item, 0); // 6
    

数组的连接

  • arr.concat(...arrays): 合并两个或多个数组,不改变现有数组,返回一个新数组
  • arr.join(separator): 将数组的所有元素连接成一个字符串
    let arr1 = [1, 2];
    let arr2 = [3, 4];
    let merged = arr1.concat(arr2); // [1, 2, 3, 4]let arr = [1, 2, 3];
    let joined = arr.join('-'); // '1-2-3'
    

数组的扁平化

  • arr.flat(depth): 按照指定深度递归地将数组扁平化
  • arr.flatMap(callback, thisArg): 首先使用映射函数映射每个元素,然后将结果压缩成一个新数组
    let arr = [1, [2, [3, 4]]];
    let flat = arr.flat(2); // [1, 2, 3, 4]let arr = [1, 2, 3];
    let flatMapped = arr.flatMap(item => [item, item * 2]); // [1, 2, 2, 4, 3, 6]
    

数组的排序

  • arr.sort(compareFunction): 原地对数组的元素进行排序,并返回此数组。(其中,(a, b) => b - a 表示降序,(b, a) => a - b 表示升序)
    let arr = [3, 1, 2];
    arr.sort(); // [1, 2, 3]
    arr.sort((a, b) => b - a); // [3, 2, 1]
    

数组的反转

  • arr.reverse(): 原地反转数组中元素的顺序。
    let arr = [1, 2, 3];
    arr.reverse(); // [3, 2, 1]
    

数组的复制

  • arr.slice(start, end): 返回一个从开始到结束(不包括结束)选择的数组的一部分浅拷贝到一个新数组对象。
  • arr.copyWithin(target, start, end): 浅复制数组的一部分到同一数组中的另一个位置,并返回它,不会改变原数组的长度。
    let arr = [1, 2, 3];
    let sliced = arr.slice(1, 3); // [2, 3]let arr = [1, 2, 3, 4];
    arr.copyWithin(0, 2, 4); // [3, 4, 3, 4]
    

数组的测试

  • Array.isArray(value): 判断一个值是否为数组
    Array.isArray([1, 2, 3]); // true
    Array.isArray('hello'); // false
    
  • arr.every(callback, thisArg): 测试数组的所有元素是否都通过了指定函数的测试
  • arr.some(callback, thisArg): 测试数组中的某些元素是否至少有一个通过了指定函数的测试
    let arr = [1, 2, 3];
    let allPositive = arr.every(item => item > 0); // truelet arr = [1, 2, 3];
    let somePositive = arr.some(item => item > 2); // true
    

数组的填充

  • arr.fill(value, start, end): 用一个固定值填充数组中**从起始索引到终止索引(不包括)**的全部元素。
    let arr = [1, 2, 3];
    arr.fill(0, 1, 3); // [1, 0, 0]
    

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

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

相关文章

Singer模型与CT模型状态转移矩阵的求解

Singer模型与CT模型状态转移矩阵的求解 文章目录 Singer模型与CT模型状态转移矩阵的求解前言状态方程矩阵指数函数泰勒展开拉普拉斯变换 Singer模型CT模型 前言 回想起来,第一次接触Singer模型与CT模型时的状态转移矩阵时,对求解过程一知半解。现在&…

linux 上除了shell、python脚本以外,还有什么脚本语言用得比较多?

在开始前我有一些资料,是我根据网友给的问题精心整理了一份「 Linux的资料从专业入门到高级教程」, 点个关注在评论区回复“888”之后私信回复“888”,全部无偿共享给大家!!!说到在 Linux下的编程&#xf…

柯桥成人商务英语“​cold”是“冷”,“shoulder”是“肩膀”,​cold shoulder可不是冷肩膀!

英文中有很多俚语(idioms)都与身体部位有关,非常有趣。 今天,英语君就为大家介绍一些和身体部位有关的俚语,一起来看看吧! cold shoulder “cold shoulder”不能用字面意思理解为“冷肩膀”,我们…

学习毛概思想(自用)

一、单项选择题 毛泽东思想的主要创立者是( A ) A、毛泽东 B、刘少奇 C、周恩来 D、朱德中国共产党内第一个提出“毛泽东思想”科学概念的是( D  )    A、周恩来   B、刘少奇   C、朱德…

CommonJS 和 ESM 在模块加载和处理依赖关系的方式上的不同点理解

模块加载: CommonJS:当执行到 require() 函数时,Node.js 会同步地加载模块文件,即立即读取模块文件并执行其中的代码,然后返回模块的导出值。这就意味着,直到运行时我们才知道具体导入了哪些模块&#xff0…

智慧校园学工管理系统的部署

学工体系思政服务该怎么规划建造?思政作为高校育人的中心使命,在做到让学生健康高兴生长的一起,也应满意学生生长成才的各类需求。使用技术为学生供给优质的信息化服务,是其间的有效途径。大数据让个性化教育成为可能,…

【题解】AB33 相差不超过k的最多数(排序 + 滑动窗口)

https://www.nowcoder.com/practice/562630ca90ac40ce89443c91060574c6?tpId308&tqId40490&ru/exam/oj 排序 滑动窗口 #include <iostream> #include <vector> #include <algorithm> using namespace std;int main() {int n, k;cin >> n &…

css中弹性布局使用方法

最近写企业家用到许多弹性&#xff0c;感觉到弹性的重要性&#xff0c;今天给大家总结一下 弹性布局&#xff08;Flexbox&#xff09;是一种在 CSS 中用来实现灵活的布局方式&#xff0c;它能够方便地调整容器中子元素的尺寸、顺序和对齐方式。以下是一些常见的弹性布局属性及…

【探索数据结构】线性表之顺序表

&#x1f389;&#x1f389;&#x1f389;欢迎莅临我的博客空间&#xff0c;我是池央&#xff0c;一个对C和数据结构怀有无限热忱的探索者。&#x1f64c; &#x1f338;&#x1f338;&#x1f338;这里是我分享C/C编程、数据结构应用的乐园✨ &#x1f388;&#x1f388;&…

Vue3按顺序调用新增和查询接口

Vue3按顺序调用新增和查询接口 一、前言1、代码 一、前言 如果你想将两个调用接口的操作封装在不同的方法中&#xff0c;你可以考虑将这两个方法分别定义为异步函数&#xff0c;并在需要时依次调用它们。以下是一个示例代码&#xff1a; 1、代码 <template><div>…

丰田精益生产的模板

丰田精益生产&#xff0c;也被称为丰田生产方式&#xff08;Toyota Production System, TPS&#xff09;&#xff0c;是一套完整的生产和管理系统&#xff0c;其核心目标是最大化效率、消除浪费&#xff0c;并通过持续改进来提升产品质量。 学习优秀企业 学习福特 丰田精益生产…

C语言之函数指针(持续更新)

C语言精髓是指针&#xff0c;指针知识深似海&#xff0c;遇到一些学习一些~ 文章目录 1. typedef 定义函数指针类型2. void* 空指针的解引用 1. typedef 定义函数指针类型 函数参数化是指通过函数指针将函数的某些行为参数化。这样&#xff0c;我们可以在调用函数时动态地指定…

【每日刷题】Day48

【每日刷题】Day48 &#x1f955;个人主页&#xff1a;开敲&#x1f349; &#x1f525;所属专栏&#xff1a;每日刷题&#x1f34d; &#x1f33c;文章目录&#x1f33c; 1. 872. 叶子相似的树 - 力扣&#xff08;LeetCode&#xff09; 2. 114. 二叉树展开为链表 - 力扣&…

react中怎么为props设置默认值

在React中&#xff0c;你可以使用ES6的类属性&#xff08;class properties&#xff09;或者函数组件中的默认参数&#xff08;default parameters&#xff09;来定义props的默认值。 1.类组件中定义默认props 对于类组件&#xff0c;你可以在组件内部使用defaultProps属性来…

如何撰写EI会议的投稿信?

撰写EI会议的投稿信&#xff08;Cover Letter&#xff09;是向会议组织者介绍你的论文和研究工作的一个重要环节。以下是撰写投稿信的一些关键步骤和建议&#xff1a; 投稿信的结构 信头 你的信息&#xff1a;包括姓名、职位、单位名称、通讯地址、电子邮件和电话号码。日期&am…

力扣652. 寻找重复的子树

Problem: 652. 寻找重复的子树 文章目录 题目描述思路复杂度Code 题目描述 思路 1.利用二叉树的后序遍历将原始的二叉树序列化&#xff08;之所以利用后序遍历是因为其在归的过程中是会携带左右子树的节点信息,而这些节点信息正是该解法要利用的东西&#xff09;&#xff1b; 2…

js积累二(web页面实现 时间走秒)

<tr><td class"ys04"><span class"ys02">当前时间&#xff1a;</span></td><td colspan"2"><span class"showTime"></span><script>var t null;t setTimeout(time, 1000); /…

【ai】chatgpt的plugin已经废弃

发现找不到按钮,原来是要申请: https://openai.com/index/chatgpt-plugins/ 发现申请已经跳转了,好像是废弃了? 不接受新插件了,但是openai的api 是可以继续用的。 https://openai.com/waitlist/plugins/We are no longer accepting new Plugins, builders can now create…

Windows11的这个地方暴露着你的隐私,把它关掉避免尴尬

前言 现在的电脑真的是越来越智能化&#xff01;现在有很多小伙伴都是用着Windows11的吧&#xff01;用习惯了Windows11之后&#xff0c;突然发现它还是挺顺手的。 但不知道你有没有发现&#xff0c;Windows11上面有个地方暴露着你的隐私。这个隐私可能是某个小姐姐的图片&am…