迹忆客 专注技术分享

当前位置:主页 > 学无止境 > WEB前端 > JavaScript >

在 JavaScript 中替换数组中的元素

作者:迹忆客 最近更新:2022/11/12 浏览次数:

要替换数组中的元素:

  1. 使用 indexOf() 方法获取元素的索引。
  2. 使用括号表示法更改特定索引处元素的值。
  3. 数组元素的值将就地更新。
const arr = ['a', 'b', 'c'];

const index = arr.indexOf('a'); // 👉️  0

if (index !== -1) {
  arr[index] = 'z';
}

console.log(arr); // 👉️ ['z', 'b', 'c']

我们使用 Array.indexOf() 方法来获取值为 a 的数组元素的索引。

然后我们用新值替换了该索引处的元素。

请注意 ,如果 indexOf 方法没有找到具有所提供值的元素,则返回 -1。 我们检查该方法没有返回 -1 的索引,以确保存在具有指定值的元素。

JavaScript 中的索引从零开始,因此第一个元素的索引为 0,最后一个元素的索引为 arr.length - 1

或者,我们可以使用 array.splice() 方法。


使用 Array.splice() 替换数组中的元素

要替换数组中的元素:

  1. 使用 indexOf() 方法获取要替换的元素的索引。
  2. 调用 Array.splice() 方法替换特定索引处的元素。
  3. 数组元素将被替换到位。
const arr = ['a', 'b', 'c'];

const index = arr.indexOf('a'); // 👉️  0

arr.splice(index, 1, 'z');

console.log(arr); // 👉️ [ 'z', 'b', 'c' ]

javascript Array splice 替换数组中的元素

我们将以下 3 个参数传递给 Array.splice() 方法:

  • start index - 开始更改数组的索引。
  • delete count - 应该从数组中删除多少元素。
  • item1 - 要添加到数组的项目。

我们将 start 索引设置为要替换的数组元素的索引。

我们将删除计数设置为 1,因此 Array.splice() 方法将删除指定索引处的数组元素,并将提供的第三个参数添加到同一索引处。

在实践中,我们删除指定索引处的数组元素,然后在同一索引处插入不同的值,因此我们最终替换了数组元素。

另一种方法是使用基本的 for 循环。 **

使用 for 循环替换数组中的元素

要替换数组中的元素:

  1. 使用 for 循环迭代 array.length 次。
  2. 在每次迭代中,检查数组元素是否是要替换的元素。
  3. 如果满足条件,则替换索引处的元素并跳出 for 循环。
const arr = ['a', 'b', 'c'];

for (let index = 0; index < arr.length; index++) {
  if (arr[index] === 'a') {
    arr[index] = 'z';
    break;
  }
}

console.log(arr); // 👉️ ['z', 'b', 'c']

javascript for 循环替换数组中的元素

我们使用了一个基本的 for 循环来遍历数组。 在每次迭代中,我们检查元素是否是我们想要替换的元素。

一旦我们找到并替换了元素,我们就会跳出循环以避免不必要的工作。

如果您想用特定值替换所有数组元素,只需删除 break 语句。

另一种解决方案是不更改原始数组,而是创建一个包含所需值的新数组。 为此,我们可以使用 map() 方法。


使用 map() 替换数组中的元素

要替换数组中的元素:

  1. 使用 map() 方法遍历数组。
  2. 检查当前元素的值是否是要替换的元素。
  3. 如果满足条件,则返回替换值,否则返回原值。
const arr = ['a', 'b', 'c'];

const newArr = arr.map(element => {
  if (element === 'a') {
    return 'z';
  }
  return element;
});

console.log(newArr); // 👉️ ['z', 'b', 'c']

console.log(arr) // 👉️ ['a', 'b', 'c']

javascript map() 替换数组中的元素

我们传递给 Array.map() 方法的函数被数组的每个元素调用。

map() 方法返回一个新数组,其中包含我们从回调函数返回的值。

在示例中,我们将所有数组元素替换为 a 的值,并将它们设置为 z 值。

我们没有更改原始数组的内容,而是使用我们需要的值创建了一个新数组。 这通常更容易在更大的代码库中进行推理和跟踪。

转载请发邮件至 1244347461@qq.com 进行申请,经作者同意之后,转载请以链接形式注明出处

本文地址:

相关文章

Do you understand JavaScript closures?

发布时间:2025/02/21 浏览次数:108 分类:JavaScript

The function of a closure can be inferred from its name, suggesting that it is related to the concept of scope. A closure itself is a core concept in JavaScript, and being a core concept, it is naturally also a difficult one.

Do you know about the hidden traps in variables in JavaScript?

发布时间:2025/02/21 浏览次数:178 分类:JavaScript

Whether you're just starting to learn JavaScript or have been using it for a long time, I believe you'll encounter some traps related to JavaScript variable scope. The goal is to identify these traps before you fall into them, in order to av

How much do you know about the Prototype Chain?

发布时间:2025/02/21 浏览次数:150 分类:JavaScript

The prototype chain can be considered one of the core features of JavaScript, and certainly one of its more challenging aspects. If you've learned other object-oriented programming languages, you may find it somewhat confusing when you start

JavaScript POST

发布时间:2024/03/23 浏览次数:96 分类:JavaScript

本教程讲解如何在不使用 JavaScript 表单的情况下发送 POST 数据。

扫一扫阅读全部技术教程

社交账号
  • https://www.github.com/onmpw
  • qq:1244347461

最新推荐

教程更新

热门标签

扫码一下
查看教程更方便