总结一下 JS中提供的方法可以对数组元素进行增、删、改、查以及其他方法

一、增加元素

1、push()

push可接收任意数量的参数,把它们逐个添加至数组末尾,并且可以返回修改后数组的长度。

例子:

var arr = [];var len = arr.push(1); //返回数组长度console.log(arr); // [1]
console.log(len); // 1len = arr.push(2,3);console.log(arr); // [1,2,3]
console.log(len); // 3

2、unshift()

该方法与push()类似,也可接收任意数量的参数,只不过是将参数逐个添加至数组前端而已,同样返回新数组长度。

例子:

var arr = [1,2,3];var len = arr.unshift(0);console.log(arr); // [0, 1, 2, 3]
console.log(len); // 4len = arr.unshift(-2,-1);console.log(arr);  // [-2, -1, 0, 1, 2, 3]
console.log(len);  // 6

3、concat()

该方法与push()方法有点类似,同样是将元素添加至数组末尾,只不过这个数组已经不是原来的那个数组了,而是其副本,所以concat()操作数组后会返回一个新的数组。

特性:

  1. 不传参数,返回当前数组副本
  2. 传递非数组参数,这些参数就会被直接添加到结果数组的末尾
  3. 传递数组参数,将数组每一个元素,添加新的数组中

例子:

var arr = [1,2,3];var arr2 = arr.concat(4,[5,6]);
console.log(arr);  // [ 1, 2, 3]
console.log(arr2); // [ 1, 2, 3, 4, 5, 6]

4、splice()

前面的三个方法都具有很大局限性,因为不是添加到数组前就是数组后,而splice()它非常灵活,它可以添加元素到数组的任意位置。

它除了可以添加元素之外还具有删除和替换元素的功能。

splice()可以向数组指定位置添加任意数量的元素。

需要传入至少3个参数:splice(a, b, c, d, ......)

1、a 起始元素的位置

2、b 要删除的元素个数,从起始元素开始算

3、c后面的是要插入的元素,可以是数组

var arr = [1,2,3];arr.splice(2, 0, 6, 7, 8);
console.log(arr); //[1, 2, 6, 7, 8, 3]arr.splice(2, 3, 10, 20, 30);
console.log(arr); //[1, 2, 10, 20, 30, 3]arr.splice(2, 3, [40, 50, 60]);
console.log(arr); //[1, 2, [40, 50, 60], 3]

二、删除元素

1、pop()

与push()方法配合使用可以构成后进先出的栈,该方法可从数组末尾删除最后一项并返回该项。

例子:

var arr = [1,2,3];var item = arr.pop();
console.log(item);  // 3console.log(arr);  // [1, 2]

2、shift()

与push()方法配合使用可以构成先进先出的队列,该方法可删除数组第一项并返回该项。

例子:

var arr = [1,2,3,4,5];var item = arr.shift();console.log(item); // [1]console.log(arr);  // [2, 3, 4, 5]

3、slice()

该方法同concat()一样是返回一个新数组,不会影响原数组,只不过slice()是用来裁剪数组的,返回裁剪下来的数组。

slice()方法可以接受一或两个参数,

1、一个参数,返回从该参数指定位置开始到当前数组末尾的所有项。

2、两个参数,返回起始和结束位置之间的项,但不包括结束位置的项。

例子:

var arr = [1,2,3,4,5];var arr3 = arr.slice(2); console.log(arr);  //[1, 2, 3, 4, 5]
console.log(arr3); //[3, 4, 5]var arr2 = arr.slice(1, 3);console.log(arr); //[1, 2, 3, 4, 5]
console.log(arr2); //[2, 3] 前包括后不包括

4、splice()

它除了可以添加元素之外还具有删除和替换元素的功能。

splice()可以向数组指定位置添加任意数量的元素。

需要传入至少3个参数:splice(a, b, c, d, ......)

1、a 起始元素的位置,从1开始;

2、b 要删除的元素个数,从起始元素开始算

3、c后面的是要插入的元素,可以是数组

var arr = [1,2,3];arr.splice(2, 0, 6, 7, 8);
console.log(arr); //[1, 2, 6, 7, 8, 3]arr.splice(2, 3, 10, 20, 30);
console.log(arr); //[1, 2, 10, 20, 30, 3]arr.splice(2, 3, [40, 50, 60]);
console.log(arr); //[1, 2, [40, 50, 60], 3]

三、修改元素

使用splice() 修改数组元素。原理很简单,就是向指定位置插入任意数量的元素,且同时删除任意数量的元素。

例子:

var arr = [1,2,3,4,5];arr.splice(2, 1, 10);console.log(arr); //[1, 2, 10, 4, 5]

四、查找元素

indexOf() 和 lastIndexOf()

这两个方法都接收两个参数:

1、要查找的项

2、表示查找起点位置的索引。(可选的)

indexOf() 从数组的开头(位置0)开始向后查找。

lastIndexOf() 从数组的末尾开始向前查找。

两个方法,当找不到该元素时,都返回 -1

例如:

var arr = [1,2,3,4,5,2];var index = arr.indexOf(2);console.log(index);  // 1index = arr.indexOf(2, 0);
console.log(index);  // 1index = arr.indexOf(2, 2);
console.log(index);  // 5index = arr.indexOf(6);
console.log(index);  // -1

其它方法:

1.join()

该方法用来将数组转换为字符串,不改变原数组,返回转换后的字符串

var arr = [1,2,3,4,5,2];
console.log(arr.join("-")); //1-2-3-4-5-2
console.log(arr); //[1,2,3,4,5,2]

2.sort()

按ascii码排序,改变原数组,返回排序后的数组

var arr = [1,2,3,4,5,2];
console.log(arr.sort()); //[1, 2, 2, 3, 4, 5]
console.log(arr); //[1, 2, 2, 3, 4, 5]

3.reverse() 

用于颠倒数组中元素的顺序。返回的是颠倒后的数组,会改变原数组。、

var arr = [1,2,3,4,5,2];
console.log(arr.reverse()); // [2, 5, 4, 3, 2, 1]
console.log(arr); // [2, 5, 4, 3, 2, 1]

4.filter()

返回数组中满足条件的元素组成的新数组,原数组不变

var arr = [1,2,3,4,5,2];
var arr2 = arr.filter(function(current, index, array){console.log("当前元素current="+current + "索引index="+index +"数组array="+array)return current < 4
})
console.log(arr) //[1, 2, 3, 4, 5, 2]
console.log(arr2) //[1, 2, 3, 2]

5.map() 

map() 方法来根据需求格式化原数组,返回格式化后的数组。原数组不变

var arr = [1,2,3,4,5,2];
var arr2 = arr.map(function(current, index, array){console.log("当前元素current="+current + "索引index="+index +"数组array="+array)return "$"+current
})
console.log(arr) //[1, 2, 3, 4, 5, 2]
console.log(arr2) //["$1", "$2", "$3", "$4", "$5", "$2"]

6.every() 

对数组的每一项都运行给定的函数,若每一项都返回 ture,则返回 true

var arr = [1,2,3,4,5,2];
var bool = arr.every(function(current, index, array){console.log("当前元素current="+current + "索引index="+index +"数组array="+array)return current < 3
})
var bool2 = arr.every(function(current, index, array){console.log("当前元素current="+current + "索引index="+index +"数组array="+array)return current < 6
})
console.log(bool) //false
console.log(bool2) //true

7.some()

对数组的每一项都运行给定的函数,若存在一项或多项返回 ture,否则返回 false

var arr = [1,2,3,4,5,2];
var bool = arr.some(function(current, index, array){console.log("当前元素current="+current + "索引index="+index +"数组array="+array)return current < 3
})
var bool2 = arr.some(function(current, index, array){console.log("当前元素current="+current + "索引index="+index +"数组array="+array)return current < 0
})
console.log(bool) //true
console.log(bool2) //false

8.forEach()

遍历整个数组,不中断

var arr = [1,2,3,4,5,2];
var arr2 = [];
arr.forEach(function(item){arr2.push(item)
})
console.log(arr2) //[1, 2, 3, 4, 5, 2]
console.log(arr)  //[1, 2, 3, 4, 5, 2]

JS中对数组元素进行增、删、改、查的方法,以及其他方法相关推荐

  1. 表单的增 删 改 查

    django单表操作 增 删 改 查 一.实现:增.删.改.查 1.获取所有数据显示在页面上 model.Classes.object.all(),拿到数据后,渲染给前端;前端通过for循环的方式,取 ...

  2. properties(map)增.删.改.查.遍历

    import java.util.Map; import java.util.Properties; import java.util.Set;/*** properties(map)增.删.改.查. ...

  3. python学生姓名添加删除_python-函数-实现学生管理系统,完成对学员的增,删,改,查和退出学生管理系统。...

    实现学生管理系统,完成对学员的增,删,改,查和退出学生管理系统. 要求1:使用一个list用于保存学生的姓名. 要求2:输入0显示所有学员信息,1代表增加,2代表删除,3代表修改,4代表查询,exit ...

  4. pyRedis - 操作指南:增/删/改/查、管道与发布订阅功能

    文章目录 1 redis docker 部署与安装 2 py - redis的使用 2.1 redis的连接 2.2 常规属性查看 2.2.2 关于删除 2.3 STRING 字符串的操作 2.4 H ...

  5. PySpark︱DataFrame操作指南:增/删/改/查/合并/统计与数据处理

    笔者最近需要使用pyspark进行数据整理,于是乎给自己整理一份使用指南.pyspark.dataframe跟pandas的差别还是挺大的. 文章目录 1.-------- 查 -------- -- ...

  6. list 增 删 改 查 及 公共方法

    1 # 热身题目:增加名字,并且按q(不论大小写)退出程序 2 li = ['taibai','alex','wusir','egon','女神'] 3 while 1: 4 username = i ...

  7. 简单的php数据库操作类代码(增,删,改,查)

    数据库操纵基本流程为: 1.连接数据库服务器 2.选择数据库 3.执行SQL语句 4.处理结果集 5.打印操作信息 其中用到的相关函数有 •resource mysql_connect ( [stri ...

  8. Linux技术--mysql数据库增-删-改-查

    # mysql 数据库 ## 数据库的操作 ### 五个单位 * 数据库服务器   Linux或者 windows  * 数据库  * 数据表 * 数据字段 * 数据行 ### 连接数据库 ``` 1 ...

  9. Python 操作 Elasticsearch 实现 增 删 改 查

    Github 地址:https://github.com/elastic/elasticsearch-py/blob/master/docs/index.rst 官网地址:https://elasti ...

最新文章

  1. Python 之 matplotlib (十四)图中图
  2. 机器学习基础专题:逻辑回归
  3. spring mvc DispatcherServlet详解之前传---FrameworkServlet
  4. Hive 任务卡在 map = 0%, reduce = 0%
  5. 算法题目——被围绕的区域(dfs,bfs)
  6. 洛谷P2480 [SDOI2010]古代猪文(卢卡斯定理+中国剩余定理)
  7. 中关村win11 32位全新官方版镜像v2021.07
  8. Flex3 CRUD 与Java后台交互 完整Demo
  9. 实测解决:SpringBoot 中 Invalid character found in the request target 异常
  10. 残暴啊,HR 智库联盟,难道真是打工人的噩梦?
  11. 不可预料的压缩文件末端怎么解决
  12. 刚刚用鸿蒙跑了个“helloworld”!我特么怀疑人生了
  13. python内置函数str的作用_Python3.6内置函数——str
  14. PPT突然不能翻页了
  15. WebBrowser查看版本
  16. C#SharpDevelop如何开发插件详细记录
  17. SQLyog的下载安装与配置(转载)
  18. Android_001_校园APP_001_底部导航栏_Fragment_0
  19. python基础教程Day04
  20. (DCDC)CM3601降压型开关稳压器 60V,480KHz,0.5A

热门文章

  1. javaee 第五周作业
  2. Eclipse快捷键 10个最有用的快捷键---摘录
  3. 红罐王老吉品牌定位战略制定过程详解
  4. 虚实结合:无需人工标注的可泛化行人再辨识
  5. 超硬核的 OCR 开发利器推荐:从场景案例到实操演示,快速掌握OCR模型训练
  6. 实时“头发-面部皮肤”分割与人脸肤色分类
  7. 何恺明一作,刷新7项检测分割任务,无监督预训练完胜有监督
  8. GAN也有脾气:「太难的部分我就不生成了,在下告退」
  9. OpenCV多目标跟踪与视频分析
  10. 百度音乐 android,千千音乐(com.ting.mp3.android) - 8.2.3.4 - 应用 - 酷安