当前位置:首页 > JavaScript

js实现数组删除

2026-02-02 18:17:13JavaScript

删除数组元素的几种方法

使用 splice() 方法

splice() 方法可以删除数组中的元素,并返回被删除的元素。该方法会改变原数组。

let arr = [1, 2, 3, 4, 5];
arr.splice(2, 1); // 从索引2开始删除1个元素
console.log(arr); // [1, 2, 4, 5]

使用 pop() 方法

pop() 方法删除数组的最后一个元素,并返回该元素。

let arr = [1, 2, 3, 4, 5];
arr.pop(); // 删除最后一个元素
console.log(arr); // [1, 2, 3, 4]

使用 shift() 方法

shift() 方法删除数组的第一个元素,并返回该元素。

let arr = [1, 2, 3, 4, 5];
arr.shift(); // 删除第一个元素
console.log(arr); // [2, 3, 4, 5]

使用 delete 操作符

delete 操作符可以删除数组中的元素,但不会改变数组的长度,被删除的元素会变成 undefined。

let arr = [1, 2, 3, 4, 5];
delete arr[2]; // 删除索引为2的元素
console.log(arr); // [1, 2, empty, 4, 5]

使用 filter() 方法

filter() 方法创建一个新数组,包含通过测试的元素,不会改变原数组。

let arr = [1, 2, 3, 4, 5];
let newArr = arr.filter(item => item !== 3); // 删除值为3的元素
console.log(newArr); // [1, 2, 4, 5]

使用 slice() 方法

slice() 方法返回一个新的数组对象,不会改变原数组。

let arr = [1, 2, 3, 4, 5];
let newArr = arr.slice(0, 2).concat(arr.slice(3)); // 删除索引为2的元素
console.log(newArr); // [1, 2, 4, 5]

使用 length 属性

通过修改数组的 length 属性可以删除数组末尾的元素。

let arr = [1, 2, 3, 4, 5];
arr.length = 3; // 删除最后两个元素
console.log(arr); // [1, 2, 3]

使用 for 循环

通过 for 循环可以手动删除数组中的元素。

let arr = [1, 2, 3, 4, 5];
for (let i = 0; i < arr.length; i++) {
  if (arr[i] === 3) {
    arr.splice(i, 1); // 删除值为3的元素
    i--; // 调整索引
  }
}
console.log(arr); // [1, 2, 4, 5]

使用 reduce() 方法

reduce() 方法可以用于删除数组中的特定元素。

let arr = [1, 2, 3, 4, 5];
let newArr = arr.reduce((acc, val) => {
  if (val !== 3) acc.push(val);
  return acc;
}, []);
console.log(newArr); // [1, 2, 4, 5]

js实现数组删除

标签: 数组js
分享给朋友:

相关文章

js实现轮播图

js实现轮播图

轮播图实现方法 基础HTML结构 <div class="slider"> <div class="slides"> <img src="image1.jpg…

css3结合js制作

css3结合js制作

CSS3 结合 JavaScript 制作动态效果 CSS3 和 JavaScript 结合可以实现丰富的动态效果,包括动画、交互和响应式设计。以下是几种常见的实现方式: CSS3 动画与 Jav…

js实现跳转

js实现跳转

使用 window.location 跳转 通过修改 window.location.href 实现页面跳转,这是最常用的方法。 window.location.href = 'https://…

js实现图片预览

js实现图片预览

使用FileReader API实现图片预览 通过FileReader对象读取用户选择的图片文件并显示预览: const input = document.getElementById('imag…

vue实现数组

vue实现数组

vue实现数组操作 在Vue中操作数组需要使用Vue提供的响应式方法,直接修改数组元素不会触发视图更新。以下是常见的数组操作方法: 添加元素 使用push、unshift或splice方法添加元素:…

js 实现vue

js 实现vue

Vue.js 的基本实现 在 JavaScript 中实现 Vue.js 的核心功能,可以通过数据绑定、响应式系统和虚拟 DOM 来实现。以下是实现 Vue.js 核心功能的简化版本。 数据响应式系…