js数组方法宝典

224 阅读3分钟

js数组方法宝典

添加与删除元素

  1. push() : 在数组末尾添加一个或多个元素。
let arr = [1, 2, 3];
arr.push(4); // arr = [1, 2, 3, 4]
  1. pop() : 从数组末尾删除一个元素并返回该元素。
let arr = [1, 2, 3];
let last = arr.pop(); // last = 3, arr = [1, 2]
  1. shift() : 从数组开头删除一个元素并返回该元素。
let arr = [1, 2, 3];
let first = arr.shift(); // first = 1, arr = [2, 3]
  1. unshift() : 在数组开头添加一个或多个元素。
let arr = [1, 2, 3];
arr.unshift(0); // arr = [0, 1, 2, 3]

迭代方法

  1. forEach() : 对数组的每个元素执行提供的函数。
let arr = [1, 2, 3];
arr.forEach(num => console.log(num));
  1. map() : 创建一个新数组,包含调用原数组每个元素后返回的结果。
let arr = [1, 2, 3];
let doubled = arr.map(num => num * 2); // doubled = [2, 4, 6]
  1. filter() : 创建一个新数组,包含所有通过测试的元素。
let arr = [1, 2, 3, 4];
let filtered = arr.filter(num => num > 2); // filtered = [3, 4]
  1. reduce() : 将数组的所有元素汇总为一个值。
let arr = [1, 2, 3, 4];
let sum = arr.reduce((acc, num) => acc + num, 0); // sum = 10
  1. reduceRight() : 与 reduce() 类似,但是从右到左进行操作。

查找与搜索

  1. find() : 返回数组中满足提供的测试函数的第一个元素的值。
let arr = [1, 2, 3, 4];
let found = arr.find(num => num > 2); // found = 3
  1. findIndex() : 返回数组中满足提供的测试函数的第一个元素的索引。
let arr = [1, 2, 3, 4];
let index = arr.findIndex(num => num > 2); // index = 2
  1. indexOf() : 返回指定元素在数组中的第一个索引,如果不存在则返回 -1。
let arr = [1, 2, 3];
let index = arr.indexOf(2); // index = 1
  1. includes() : 判断数组是否包含某个元素,返回布尔值。
let arr = [1, 2, 3];
let hasTwo = arr.includes(2); // hasTwo = true

数组变换

  1. slice() : 返回数组中选定的部分复制到一个新数组。
let arr = [1, 2, 3, 4];
let newArr = arr.slice(1, 3); // newArr = [2, 3]
  1. splice() : 从数组中添加/删除项目。
let arr = [1, 2, 3, 4];
arr.splice(1, 1, 5); // arr = [1, 5, 3, 4]
  1. concat() : 将两个或多个数组合并为一个新数组。
let arr1 = [1, 2];
let arr2 = [3, 4];
let newArr = arr1.concat(arr2); // newArr = [1, 2, 3, 4]

排序与反转

  1. sort() : 对数组的元素进行排序。
let arr = [3, 1, 4, 2];
arr.sort(); // arr = [1, 2, 3, 4]
  1. reverse() : 反转数组中的元素顺序。
let arr = [1, 2, 3];
arr.reverse(); // arr = [3, 2, 1]

其他方法

  1. join() : 将数组的所有元素合并为一个字符串。
let arr = ['a 'b', 'c'];
let str = arr.join('-'); // str = 'a-b-c'
  1. toString() : 返回数组的字符串表示。
let arr = [1, 2, 3];
let str = arr.toString(); // str = '1,2,3'
  1. flat() 将嵌套的数组扁平化。
let arr = [1, [2, 3], [4, [5]]];
let flatArr = arr.flat(1); // flatArr = [1, 2, 3, 4, [5]]
  1. flatMap() : 首先映射每个元素,通过给定的映射函数,然后将结果扁平化。
let arr = [1, 2, 3];
let flatMapped = arr.flatMap(x => [x, x * 2]); // flatMapped = [1, 2, 2, 4, 3, 6]

数组方法综合运用代码示例

// 定义一个任务数组
let tasks = [];

// 添加任务
function addTask(task) {
    tasks.push(task); // 使用 push 方法添加任务
    console.log(`任务 "${task}" 已添加.`);
}

// 删除最后一个任务
function removeLastTask() {
    const removed = tasks.pop(); // 使用 pop 方法移除最后一个任务
    console.log(`任务 "${removed}" 已删除.`);
}

// 删除第一个任务
function removeFirstTask() {
    const removed = tasks.shift(); // 使用 shift 方法移除第一个任务
    console.log(`任务 "${removed}" 已删除.`);
}

// 在任务开头添加任务
function addTaskToStart(task) {
    tasks.unshift(task); // 使用 unshift 方法在开头添加任务
    console.log(`任务 "${task}" 已添加到开头.`);
}

// 获取任务的一个子数组
function getTaskSlice(start, end) {
    const slice = tasks.slice(start, end); // 使用 slice 方法获取子数组
    console.log(`获取的任务片段: ${slice}`);
}

// 从特定位置删除任务,添加新任务
function replaceTask(index, task) {
    tasks.splice(index, 1, task); // 使用 splice 方法替换任务
    console.log(`在索引 ${index} 位置替换为 "${task}".`);
}

// 显示所有任务
function showTasks() {
    tasks.forEach((task, index) => { // 使用 forEach 方法遍历任务
        console.log(`${index}: ${task}`);
    });
}

// 任务映射
function getTaskLengths() {
    const lengths = tasks.map(task => task.length); // 使用 map 方法获取任务长度
    console.log(`任务长度: ${lengths}`);
}

// 过滤任务
function filterTasks(criteria) {
    const filtered = tasks.filter(task => task.includes(criteria)); // 使用 filter 方法过滤任务
    console.log(`过滤后的任务: ${filtered}`);
}

// 统计任务字符总数
function countTotalCharacters() {
    const total = tasks.reduce((sum, task) => sum + task.length, 0); // 使用 reduce 方法统计字符总数
    console.log(`所有任务字符总数: ${total}`);
}

// 检查是否每个任务都是字符串
function checkIfAllTasksAreStrings() {
    const allStrings = tasks.every(task => typeof task === 'string'); // 使用 every 方法检查
    console.log(`所有任务都是字符串: ${allStrings}`);
}

// 检查是否有任务包含特定字符串
function checkIfAnyTaskContains(criteria) {
    const anyContains = tasks.some(task => task.includes(criteria)); // 使用 some 方法检查
    console.log(`是否有任务包含 "${criteria}": ${anyContains}`);
}

// 查找第一个包含特定字符串的任务
function findFirstMatch(criteria) {
    const found = tasks.find(task => task.includes(criteria)); // 使用 find 方法查找
    console.log(`找到的第一个匹配任务: ${found}`);
}

// 排序任务
function sortTasks() {
    tasks.sort(); // 使用 sort 方法排序任务
    console.log(`排序后的任务: ${tasks}`);
}

// 示例使用
addTask("学习JavaScript");
addTask("完成作业");
addTask("阅读书籍");
addTask("锻炼身体");
showTasks();

removeLastTask();
showTasks();

addTaskToStart("吃早餐");
showTasks();

getTaskSlice(1, 3);
replaceTask(1, "参加会议");
showTasks();

getTaskLengths();
filterTasks("书");
countTotalCharacters();
checkIfAllTasksAreStrings();
checkIfAnyTaskContains("锻");
findFirstMatch("锻");
sortTasks();
showTasks();