JavaScript 数组及其常用方法

news/2025/1/13 17:45:14/

1. JavaScript 数组概述

数组是 JavaScript 中用于存储多个值的数据结构。它可以存储不同类型的元素,并提供强大的方法来操作和管理数据。数组的元素按索引(从 0 开始)进行访问。

2. 数组的创建方式

1) 使用数组字面量
javascript">let fruits = ["苹果", "香蕉", "橘子"];
2) 使用 Array 构造函数
javascript">let numbers = new Array(5);  // 创建一个长度为 5 的空数组
let colors = new Array("红色", "蓝色", "绿色");
3) 空数组
javascript">let emptyArray = [];

3. 数组的遍历方法

1) for 循环遍历
javascript">let fruits = ["苹果", "香蕉", "橘子"];
for (let i = 0; i < fruits.length; i++) {console.log(fruits[i]);
}
2) for…of 循环
javascript">for (let fruit of fruits) {console.log(fruit);
}
3) for…in循环
javascript">for (let index in fruits) {console.log(fruits[index]);
}

4. 常用数组方法

方法描述示例
join()将数组中的所有元素连接成一个字符串。fruits.join(", ") // "苹果, 香蕉, 橘子"
push()向数组末尾添加一个或多个元素,返回新数组的长度。fruits.push("葡萄") // 返回新长度 4
pop()移除数组末尾的元素,返回被移除的元素。fruits.pop() // 返回 "橘子"
shift()移除数组开头的元素,返回被移除的元素。fruits.shift() // 返回 "苹果"
unshift()在数组开头添加一个或多个元素,返回新数组的长度。fruits.unshift("菠萝") // 返回新长度 4
sort()对数组元素进行排序,默认按字符编码顺序。numbers.sort() // [11, 21, 300, 34, 43]
reverse()反转数组中元素的顺序。fruits.reverse() // ["橘子", "香蕉", "苹果"]
concat()合并两个或多个数组,返回新数组。fruits.concat(["葡萄"]) // ["苹果", "香蕉", "橘子", "葡萄"]
slice()返回数组中指定开始到结束之间的元素,不修改原数组。fruits.slice(0, 2) // ["苹果", "香蕉"]
splice()删除或替换数组中的元素,并可在指定位置添加新元素。fruits.splice(1, 1, "西瓜") // ["苹果", "西瓜", "橘子"]
indexOf()返回数组中某个元素的第一个索引,未找到时返回 -1。fruits.indexOf("香蕉") // 返回 1
lastIndexOf()返回数组中某个元素的最后一个索引,未找到时返回 -1。fruits.lastIndexOf("橘子") // 返回 2
includes()检测数组是否包含某个元素,可以找到 NaN 值。[1, 2, NaN].includes(NaN) // true
toString()将数组转换为逗号分隔的字符串。[1, 2, 3].toString() // "1,2,3"
copyWithin()在数组内部复制元素到其他位置,不改变数组长度。[1, 2, 3, 4, 5].copyWithin(0, 3) // [4, 5, 3, 4, 5]
map()返回一个新数组,每个元素是原数组元素调用函数后的结果。[1, 2, 3].map(x => x * 2) // [2, 4, 6]
filter()返回一个新数组,包含通过函数测试的所有元素。[1, 2, 3].filter(x => x > 1) // [2, 3]# 1/10
fill()用指定值填充数组的所有元素。[1, 2, 3].fill(0) // [0, 0, 0]
every()检测数组中的所有元素是否都通过了指定函数的测试。[1, 2, 3].every(x => x > 0) // true
some()检测数组中是否至少有一个元素通过了指定函数的测试。[1, 2, 3].some(x => x > 2) // true
flat()将多维数组扁平化为一维数组。[1, [2, [3]]].flat(2) // [1, 2, 3]
flatMap()映射每个元素然后将结果扁平化为一个新数组。[1, 2, 3].flatMap(x => [x, x * 2]) // [1, 2, 2, 4, 3, 6]

ps:sort()方法;NaN:Not a Number;flat(Infinity)多维数组转一维。

5. 示例代码

javascript">let fruits = ["苹果", "香蕉", "橘子"];// join() 示例
console.log(fruits.join(", "));  // 输出: "苹果, 香蕉, 橘子"// push() 和 pop() 示例
fruits.push("葡萄");
console.log(fruits);  // 输出: ["苹果", "香蕉", "橘子", "葡萄"]
console.log(fruits.pop());  // 输出: "葡萄"// shift() 和 unshift() 示例
fruits.shift();
console.log(fruits);  // 输出: ["香蕉", "橘子"]
fruits.unshift("菠萝");
console.log(fruits);  // 输出: ["菠萝", "香蕉", "橘子"]// sort() 和 reverse() 示例
let numbers = [3, 1, 4, 1, 5, 9];
numbers.sort();
console.log(numbers);  // 输出: [1, 1, 3, 4, 5, 9]
numbers.reverse();
console.log(numbers);  // 输出: [9, 5, 4, 3, 1, 1]// slice() 和 splice() 示例
let selectedFruits = fruits.slice(1, 3);
console.log(selectedFruits);  // 输出: ["香蕉", "橘子"]
fruits.splice(1, 1, "西瓜");
console.log(fruits);  // 输出: ["菠萝", "西瓜", "橘子"]// indexOf() 和 lastIndexOf() 示例
console.log(fruits.indexOf("西瓜"));  // 输出: 1
console.log(fruits.lastIndexOf("橘子"));  // 输出: 2// includes() 示例
console.log(fruits.includes("香蕉"));  // 输出: true
console.log([NaN].includes(NaN));      // 输出: true// toString() 示例
console.log(fruits.toString());        // 输出: "苹果,香蕉,橘子"// copyWithin() 示例
let numbers = [1, 2, 3, 4, 5];
numbers.copyWithin(0, 3);
console.log(numbers);                  // 输出: [4, 5, 3, 4, 5]// map() 示例
let doubledNumbers = numbers.map(num => num * 2);
console.log(doubledNumbers);           // 输出: [8, 10, 6, 8, 10]// filter() 示例
let filteredNumbers = doubledNumbers.filter(num => num > 8);
console.log(filteredNumbers);          // 输出: [10, 10]// fill() 示例
let arr = [1, 2, 3, 4, 5];
arr.fill(0, 1, 4);
console.log(arr);  // 输出: [1, 0, 0, 0, 5]// every() 示例
let allPositive = arr.every(num => num >= 0);
console.log(allPositive);  // 输出: true// some() 示例
let hasZero = arr.some(num => num === 0);
console.log(hasZero);  // 输出: true// flat() 示例
let nestedArr = [1, [2, [3, [4]]]];
let flatArr = nestedArr.flat(2);
console.log(flatArr);  // 输出: [1, 2, 3, [4]]// flatMap() 示例
let mappedArr = [1, 2, 3].flatMap(x => [x, x * 2]);
console.log(mappedArr);  // 输出: [1, 2, 2, 4, 3, 6]

凡是过去,皆为序章;凡是未来,皆有可期。


http://www.ppmy.cn/news/1562851.html

相关文章

Spring Framework 5.3.x源码构建 (jdk-1.8, gradle 7.5.1, idea2024.3)

1、下载jdk安装并配置环境变量&#xff08;自行百度&#xff09; https://www.oracle.com/java/technologies/downloads/#java8 2、下载spring-framework源码&#xff0c;切换分支到5.3.x https://github.com/spring-projects/spring-framework.git 备用地址 https://gitco…

FastApi Swagger 序列化问题

问题 错误现象&#xff1a; fastapi的 swagger 界面无法正常打开控制台报错&#xff1a;raise PydanticInvalidForJsonSchema(fCannot generate a JsonSchema for {error_info}) 详细报错&#xff1a; File "d:\Envs\miniconda3\envs\xdagent\lib\site-packages\pydan…

shell练习2

1、shell 脚本写出检测 /tmp/size.log 文件如果存在显示它的内容&#xff0c;不存在则创建一个文件将创建时间写入。 #!/bin/bash #shell 脚本写出检测 /tmp/size.log 文件如果存在显示它的内容&#xff0c;不存在则创建一个文件将创建时间写入。file"/tmp/size.log"…

IntelliJ IDEA和MAVEN基本操作:项目和缓存存储到非C盘

为了将 IntelliJ IDEA 的所有项目和缓存存储到 C 盘以外的地方&#xff0c;以下是你需要调整的设置和步骤&#xff1a; 1. 更改项目默认存储位置 打开 IntelliJ IDEA。点击顶部菜单的 File > Settings &#xff08;Windows&#xff09;或 IntelliJ IDEA > Preferences &…

Maven 仓库的分类

Maven 是一个广泛使用的项目构建和依赖管理工具&#xff0c;在 Java 开发生态中占据重要地位。作为 Maven 的核心概念之一&#xff0c;仓库&#xff08;Repository&#xff09;扮演着至关重要的角色&#xff0c;用于存储项目的依赖、插件以及构建所需的各种资源。 了解 Maven 仓…

使用 Docker 在 Alpine Linux 下部署 Caddy 服务器

简介 在现代 web 开发中&#xff0c;选择合适的 web 服务器至关重要。Caddy 是一个功能强大的现代化 HTTP/2 服务器&#xff0c;支持自动 HTTPS&#xff0c;配置简单&#xff0c;适合开发和生产环境。Docker 则为我们提供了一种轻量级的容器化技术&#xff0c;使得应用程序的部…

CPU缓存架构详解与Disruptor高性能内存队列实战

引言 现代计算机系统的性能很大程度上取决于CPU与内存之间的交互效率。随着处理器技术的发展&#xff0c;CPU的速度远超主内存&#xff0c;为了弥补这种速度差异&#xff0c;引入了多级高速缓存&#xff08;Cache&#xff09;。然而&#xff0c;在多核环境下&#xff0c;缓存一…

xcrun: error: invalid active developer path 解决

在拉取 github 代码时&#xff0c;提示如下报错&#xff1a; xcrun: error: invalid active developer path (/Library/Developer/CommandLineTools), missing xcrun at: /Library/Developer/CommandLineTools/usr/bin/xcrun 原因是&#xff1a;这是由于 Xcode command line t…