JS数组移除元素的八种方法

一、修改arr的length方法

let arr = [1,2,3,4,5,6,7,8,9];
arr.length = 3;
console.log('length',arr.length); // 3
console.log('arr',arr); // [1, 2, 3]
二、delete方法
修改arr的内容,但是length不变。let arr = [1,2,3,4,5,6,7,8,9];
delete arr[2];
console.log('length',arr.length); // 9
console.log('arr',arr); // arr [1, 2, empty, 4, 5, 6, 7, 8, 9]
三、pop()方法
栈方法,删除arr的最后一个元素。let arr = [1,2,3,4,5,6,7,8,9];
arr.pop();
console.log('length',arr.length); // 8
console.log('arr',arr); // [1, 2, 3, 4, 5, 6, 7, 8]
四、shift()方法
删除arr的第一个元素。let arr = [1,2,3,4,5,6,7,8,9];
arr.shift();
console.log('length',arr.length); // 8
console.log('arr',arr); // [2, 3, 4, 5, 6, 7, 8, 9]
五、splice()方法
可以对arr进行增删改操作。删除操作:第一位参数 0: 代表的是起始下标注。第二位参数 2: 代表的是删除的位数。let arr = [1,2,3,4,5,6,7,8,9];
arr.splice(0,2);
console.log('length',arr.length); // 7
console.log('arr',arr); // [3, 4, 5, 6, 7, 8, 9]
增加操作:第1位参数:2代表从何处添加数据,为必需参数。第2位参数:0代表要删除的个数,可选。第3...位参数:可选,要添加的元素。var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,0,"Lemon","Kiwi"); // Banana,Orange,Lemon,Kiwi,Apple,Mango// 移除数组的第三个元素,并在数组第三个位置添加新元素
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,1,"Lemon","Kiwi"); // Banana,Orange,Lemon,Kiwi,Mango
六、slice()方法
slice() 方法返回一个新的数组对象,这一对象是一个由 begin 和 end 决定的原数组的浅拷贝(包括 begin,不包括end)。原始数组不会被改变。const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];// 第一个参数:可选,begin从该索引处开始提取元素;如果该参数为负数,则表示从原数组中的倒数第几个元素开始提取,slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素(包含最后一个元素)。
// 如果省略 begin,则 slice 从索引 0 开始。
// 如果 begin 超出原数组的索引范围,则会返回空数组。
// 第二个参数:可选,end从该索引处结束提取元素;如果该参数为负数, 则它表示在原数组中的倒数第几个元素结束抽取。 slice(-2,-1) 表示抽取了原数组中的倒数第二个元素到最后一个元素(不包含最后一个元素,也就是只有倒数第二个元素)。
// 如果 end 被省略,则 slice 会一直提取到原数组末尾。
// 如果 end 大于数组的长度,slice 也会一直提取到原数组末尾。
console.log(animals.slice(2)); // ["camel", "duck", "elephant"]
console.log(animals.slice(2, 4)); // ["camel", "duck"]
console.log(animals.slice(1, 5)); // ["bison", "camel", "duck", "elephant"]
console.log(animals.slice(-2)); // ["duck", "elephant"]
console.log(animals.slice(2, -1)); // ["camel", "duck"]
七、forEach() || filter()方法
通过迭代循环,删除元素。// forEach()
let arr = [1,2,3,4,5,6,7,8,9];
arr.forEach((item,index,arr) => {if(item === 3){arr.splice(index,1);}
});
console.log('length',arr.length); // 8
console.log('arr',arr); // [1, 2, 4, 5, 6, 7, 8, 9]// filter()
let arr1 = [1,2,3,4,5,6,7,8,9];
arr1 = arr1.filter((item)=>{return item !== 3;
});
console.log('length',arr1.length); // 8
console.log('arr',arr1); // [1, 2, 4, 5, 6, 7, 8, 9]
八、操作原型
通过在Array原型上添加方法来完成删除。let arr = [1,2,3,4,5,6,7,8,9];
Array.prototype.remove = function(v) {for(let i = 0, j = 0; i < this.length; i++) {if(this[i] != v) {this[j++] = this[i];}}this.length -= 1;
}
arr.remove(2); //参数为要移除的元素
console.log('length',arr.length); // 8
console.log('arr',arr); // [1, 3, 4, 5, 6, 7, 8, 9] 

JS数组移除元素的八种方法相关推荐

  1. php 从数组里删除元素,PHP从数组中删除元素的四种方法实例

    PHP从数组中删除元素的四种方法实例 一.总结 一句话总结:unset(),array_splice(),array_diff(),array_diff_key() 二.PHP从数组中删除元素的四种方 ...

  2. 详解JavaScript数组过滤相同元素的5种方法

    详解JavaScript数组过滤相同元素的5种方法:https://www.jb51.net/article/114490.htm 转载于:https://www.cnblogs.com/bydzha ...

  3. 遍历List移除元素的若干种方法

    众所周知,List在for.while正常遍历过程中,如果remove元素,容易出现ConcurrentModificationException 异常,根本原因的话,之前ArrayList源码分析文 ...

  4. 前端html隐藏元素方式,CSS 隐藏元素的八种方法

    前言 总括: 本文详细讲述了在网页中用CSS隐藏元素的七种方法. 念念不忘,必有回响;有一口气,点一盏灯. 正文 说起隐藏元素我想每一个前端er都能说起几种,但能说全的我想就不是很多了.博主总结了几种 ...

  5. JS获取DOM元素的八种方法

    什么是HTML DOM 文档对象模型(Document Object Model),是W3C组织推荐的处理可扩展置标语言的标准编程接口.简单理解就是HTML DOM 是关于如何获取.修改.添加或删除 ...

  6. Js中去除数组中重复元素的几种方法

    方法1: 1 Array.prototype.method1=function(){ 2 var arr=[]; 3 for(var i=0;i<this.length;i++){ 4 if(a ...

  7. JS数组移除元素的方法

    1. 修改Arr的length let arr = [1,2,3,4,5,6,7,8,9]; arr.length = 3; console.log('length',arr.length); con ...

  8. java删除数组中重复元素的几种方法

    Java操控数组,删除数组中所有的重复元素,使其数组元素全部唯一,有以下几种方法: 1,使用set(最好想到),set本身就是不重复的集合: package Array_test;import jav ...

  9. 数组中交换元素的几种方法总结

    在完成关于数组的大量算法中,基本都会涉及到元素交换,比如排序中是最常见的,一般的方法是新建一个临时变量,然后完成交换,如果给定的数组中元素是有范围的,其实还有其他方法也可以完成交换.下面就来总结一下这 ...

最新文章

  1. 选择排序算法实现思想个人理解
  2. github:已经提交并push后再次追加提交
  3. Ubuntu11.10配置Eclipse下Android开发环境
  4. MyEclipse使用总结——MyEclipse去除网上复制下来的来代码带有的行号
  5. GitLab CI持续集成配置方案
  6. C语言课后习题(53)
  7. oracle数据库无法写入文件,如何在ORACLE的PL/SQL中将数据写入文件
  8. pythonmatplot可视化_python:matplotlib基础数据可视化,pythonmatplotlib
  9. Lesson 3.1 - Python Core Data Types
  10. HTML5与HTML4区别
  11. 基于java SSM的房屋租赁系统设计和实现
  12. 华为方会提供一份CRS(客户需求)和SOW(工作任务书)
  13. html点中弹出选择框,javascript点击弹出选择框
  14. 米家和苹果HomeKit二选一,你怎么选?
  15. Hdu 1496 Equations(巧妙哈希)
  16. 如何同时对多个 Word 的内容进行批量替换
  17. 关于 负反馈放大电路,你需要了解这些
  18. 2022年安全员-B证考试试题模拟考试平台操作
  19. 求一个方阵的主对角线及次对角线的和(C语言)(二维数组)
  20. php时间期间检测重叠,如何检查PHP中多个日期范围之间的重叠?

热门文章

  1. 安装操作系统的操作步骤
  2. Android关于WebView控件net::ERR_CLEARTEXT_NOT_PERMITTED报错问题解决
  3. SQL server 触发器 instead of
  4. CSS对象中心点对齐与旋转
  5. JS学习笔记二 DOM,正则表达式简单例子介绍
  6. static静态代码块
  7. java暑假_Java暑假作业
  8. grep 命令系列:grep 中的正则表达式
  9. linux系统句柄数命令
  10. 面试快速复习(三):概率论与数理统计