谈谈JavaScript数组常用方法总结


Posted in Javascript onJanuary 24, 2017

在JavaScript中,我们需要时常对数组进行操作,现在特将常用方法总结如下:

1.增加数据

在JavaScript为数组增加数据主要分为两种方式。

 从数组末尾增加内容:push方法

从数组的前端增加内容:unshift方法

这两种方法的返回值都是数组的长度

var arr=[1,2,3]; 
//从末尾增加 
arr.push(4); 
console.log(arr);//[1,2,3,4] 
 
//从前端增加 
arr.unshift(0); 
console.log(arr);//[0,1,2,3,4]

2.删除数据

和增加数据一样,删除数据和主要分为两种方式。

从数组末尾增加内容:pop方法

从数组的前端增加内容:shift方法

这两种方法的返回值都是删除的数据

var arr=[1,2,3]; 
//从末尾删除 
arr.pop(); 
console.log(arr);//[1,2] 
 
//从前端删除 
arr.unshift(); 
console.log(arr);//[2]

3.从指定位置删除和增加数据

splice(startIndex,deleteCount,addValue1,addValue2...):从数组的startIndex位置开始,删除deleteCount个数据,然后在插入addValue1,addValue2等,返回值是被删除的数组所组成的数组。

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

从上面所知,数组的删除方法返回的都是被删除的内容,增加的方法返回的都是数组改变后的长度。

4.反序数组

reverse():将数组内容逆序。

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

5.将数组内容组成一个有特定分隔符的字符串

join(seperator):将数组内容组成一个字符串,内容以seperator分隔

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

6.合并两个数组

concat():合并数组并返回一个新的数组,不影响原有数组。

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

7.数组排序

sort():默认将数组进行数字或字母进行升序排序,但也可以自定义降序排序

var arr=[3,5,1]; 
 
arr.sort(); 
 
console.log(arr);//[1,3,5]; 
 
//指定降序 
var arr1=[4,2,7]; 
arr1.sort(function(a,b){ 
  return b-a; 
}) 
console.log(arr1);//[7,4,2]

8.截取子数组

slice(startIndex,endIndex):截取数组中从startIndex到endIndex之间的内容,不包括endIndex所在位置的内容组成一个新的数组

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

 9.判断给定数据在数组中的位置

indexOf(data):该方法返回data在该数组中所在的第一个元素位置,如果没有找到就返回-1

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

10.迭代器

数组的迭代器方法很多。

a.普通的遍历数组:forEach(function(value,index,arr){}),其中index是索引,value是值,arr就是数组本身

var arr=[1,2,3]; 
 
//index是索引,value是值 
arr.forEach(function(value,index,arr){ 
   console.log(''index:"+index+" "+"value:"+value) 
})

b.过滤数组:filter(),根据过滤条件过滤数组,但不会改变原有数组

var arr=[1,2,3,4]; 
 
//返回数组中大于2的内容 
var newArr=arr.filter(function(item){ 
  return item>2; 
}) 
 
console.log(arr);//[1,2,3,4] 
console.log(newArr);//[3,4]

c.映射数组:map(),对数组每个元素进行一定映射后,返回一个新数组,不会改变原有数组

var arr=[1,2,3,4]; 
 
//将数组每个值扩大一倍 
var newArr=arr.map(function(item){ 
  return item*2; 
}); 
 
console.log(arr);//[1,2,3,4] 
console.log(newArr);//[2,4,6,8]

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 对象的定义方法
Jan 10 Javascript
DB.ASP 用Javascript写ASP很灵活很好用很easy
Jul 31 Javascript
Javascript:为input设置readOnly属性(示例讲解)
Dec 25 Javascript
jQuery中innerHeight()方法用法实例
Jan 19 Javascript
jQuery中bind()方法用法实例
Jan 19 Javascript
学习Javascript面向对象编程之封装
Feb 23 Javascript
Vue.js进行查询操作的实例详解
Aug 25 Javascript
Angular2仿照微信UI实现9张图片上传和预览的示例代码
Oct 19 Javascript
浅谈gulp创建完整的项目流程
Dec 20 Javascript
iview通过Dropdown(下拉菜单)实现的右键菜单
Oct 26 Javascript
js取0-9随机取4个数不重复的数字代码实例
Mar 27 Javascript
weui中的picker使用js进行动态绑定数据问题
Nov 06 Javascript
js实现日历的简单算法
Jan 24 #Javascript
JSON键值对序列化和反序列化解析
Jan 24 #Javascript
js自制图片放大镜功能
Jan 24 #Javascript
JS中绑定事件顺序(事件冒泡与事件捕获区别)
Jan 24 #Javascript
input获取焦点时底部菜单被顶上来问题的解决办法
Jan 24 #Javascript
JavaScript解析JSON格式数据的方法示例
Jan 24 #Javascript
解决ajax不能访问本地文件问题(利用js跨域原理)
Jan 24 #Javascript
You might like
php一句话cmdshell新型 (非一句话木马)
2009/04/18 PHP
浅析PHP原理之变量分离/引用(Variables Separation)
2013/08/09 PHP
php对数组排序的简单实例
2013/12/25 PHP
PHP 实现手机端APP支付宝支付功能
2018/06/07 PHP
php写入txt乱码的解决方法
2019/09/17 PHP
该如何加载google-analytics(或其他第三方)的JS
2010/05/13 Javascript
jquery 提示信息显示后自动消失的具体实现
2013/12/18 Javascript
js浏览器html5表单验证
2016/10/17 Javascript
JavaScript中 this 指向问题深度解析
2017/02/21 Javascript
详解如何用模块化的方式写vuejs
2017/12/16 Javascript
laydate时间日历插件使用方法详解
2018/11/14 Javascript
vue基础之事件v-onclick="函数"用法示例
2019/03/11 Javascript
vue element-ui table组件动态生成表头和数据并修改单元格格式 父子组件通信
2019/08/15 Javascript
JavaScript判断浏览器版本的方法
2019/11/03 Javascript
Vue数字输入框组件使用方法详解
2020/02/10 Javascript
使用Typescript开发微信小程序的步骤详解
2021/01/12 Javascript
[02:29]完美世界高校联赛上海赛区回顾
2015/12/15 DOTA
[01:05]主宰至宝剑心之遗
2017/03/16 DOTA
python使用PIL缩放网络图片并保存的方法
2015/04/24 Python
用Python抢过年的火车票附源码
2015/12/07 Python
Django应用程序中如何发送电子邮件详解
2017/02/04 Python
Python中生成Epoch的方法
2017/04/26 Python
python flask 多对多表查询功能
2017/06/25 Python
python使用标准库根据进程名如何获取进程的pid详解
2017/10/31 Python
浅析Python装饰器以及装饰器模式
2018/05/28 Python
Python RabbitMQ消息队列实现rpc
2018/05/30 Python
解决Ubuntu pip 安装 mysql-python包出错的问题
2018/06/11 Python
使用Python写一个量化股票提醒系统
2018/08/22 Python
python简单验证码识别的实现方法
2019/05/10 Python
python实现一个函数版的名片管理系统过程解析
2019/08/27 Python
使用 Python 读取电子表格中的数据实例详解
2020/04/17 Python
军训鉴定表自我鉴定
2014/02/13 职场文书
股指期货心得体会
2014/09/13 职场文书
2014年党风廉政工作总结
2014/12/03 职场文书
民事代理词范文
2015/05/25 职场文书
Java 数组内置函数toArray详解
2021/06/28 Java/Android