谈谈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 相关文章推荐
表单(FORM)的一些实用效果代码
Mar 25 Javascript
Jquery 高亮显示文本中重要的关键字
Dec 24 Javascript
JS 操作符整理[推荐收藏]
Nov 15 Javascript
Javascript 面向对象(一)(共有方法,私有方法,特权方法)
May 23 Javascript
php对mongodb的扩展(初识如故)
Nov 11 Javascript
js和jquery对dom节点的操作(创建/追加)
Apr 21 Javascript
jquery form 隐藏的input 选择
Apr 29 Javascript
js获取UserControl内容为拼html时提供方便
Nov 02 Javascript
基于javascript实现最简单的选项卡切换效果
May 16 Javascript
JavaScript中的垃圾回收与内存泄漏示例详解
May 02 Javascript
vue2配置scss的方法步骤
Jun 06 Javascript
解决layui弹出层layer的area过大被遮挡的问题
Sep 21 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
ThinkPHP使用心得分享-ThinkPHP + Ajax 实现2级联动下拉菜单
2014/05/15 PHP
通过php添加xml文档内容的方法
2015/01/23 PHP
php禁用cookie后session设置方法分析
2016/10/19 PHP
php正则提取html图片(img)src地址与任意属性的方法
2017/02/08 PHP
PHP实现按之字形顺序打印二叉树的方法
2018/01/16 PHP
PHP获取星期几的常用方法小结
2018/12/18 PHP
PHP框架实现WebSocket在线聊天通讯系统
2019/11/21 PHP
PHP的new static和new self的区别与使用
2019/11/27 PHP
js和jquery使按钮失效为不可用状态的方法
2014/01/26 Javascript
jquery动态改变form属性提交表单
2014/06/03 Javascript
借助FileReader实现将文件编码为Base64后通过AJAX上传
2015/12/24 Javascript
Javascript缓存API
2016/06/14 Javascript
Vuejs第十三篇之组件——杂项
2016/09/09 Javascript
JS控件bootstrap datepicker使用方法详解
2017/03/25 Javascript
Django中使用jquery的ajax进行数据交互的实例代码
2017/10/15 jQuery
AngularJs返回前一页面时刷新一次前面页面的方法
2018/10/09 Javascript
JS简单数组排序操作示例【sort方法】
2019/05/17 Javascript
原生Vue 实现右键菜单组件功能
2019/12/16 Javascript
Vue事件处理原理及过程详解
2020/03/11 Javascript
js实现随机圆与矩形功能
2020/10/29 Javascript
python中sets模块的用法实例
2014/09/30 Python
python实现汉诺塔方法汇总
2016/07/25 Python
Python cookbook(数据结构与算法)将名称映射到序列元素中的方法
2018/03/22 Python
python 调用有道api接口的方法
2019/01/03 Python
用Python和WordCloud绘制词云的实现方法(内附让字体清晰的秘笈)
2019/01/08 Python
python中break、continue 、exit() 、pass终止循环的区别详解
2019/07/08 Python
使用python代码进行身份证号校验的实现示例
2019/11/21 Python
Selenium之模拟登录铁路12306的示例代码
2020/07/31 Python
python实现企业微信定时发送文本消息的实例代码
2020/11/25 Python
分享unittest单元测试框架中几种常用的用例加载方法
2020/12/02 Python
给民警的表扬信
2014/01/08 职场文书
出国留学介绍信
2014/01/13 职场文书
运动会开幕式主持词
2014/03/28 职场文书
升职演讲稿范文
2014/05/23 职场文书
机械电子工程专业求职信
2014/06/22 职场文书
幼儿教师暑期培训方案
2014/08/27 职场文书