JS中Array数组学习总结


Posted in Javascript onJanuary 18, 2017

引用类型分为Object类型(所谓的对象),Array类型(本文谈的数组),Function类型等。

那么,数组是干啥的呢?在我看来,它是用来保存数据的。

一、声明一个数组:

1、构造函数 var colors=new Array();简写的话可以省略new,即var colors=Array();

2、数组字面量 var colors=["black","green","pink"];

二、读取和设置数组的值:

读取:colors[x];参数x为0~colors.length-1;

设置的话直接给colors[x]=进行赋值就好,这样会覆盖之前的数值哦;

三、在这里简单说说length的用法:

colors.length获取数组的长度,也可以说是数组有几项,如果说一个数组有7项,但是你写入了colors.length=2,那么就会删除后面的5项;

利用length属性也可以为数组最后添加数据:colors[colors.length]=进行赋值;

四、数组中的操作:

方法 作用 返回值
Array.push(x,y,z) 把xyz添加到数组末尾 新数组长度
Array.pop() 移除数组最后一项 移除的最后一项
Array.shift() 移除数组第一项 移除的第一项
Array.unshift(a,b,c) 在数组前端添加a,b,c 新数组长度
Array.reverse() 反转数组 反转后的新数组
Array.sort() 对数组中每一项的字符串进行升序排列 重新排序后的数组
Array.concat(a,b,c) 连接数组 返回连接好的新数组
Array.slice(1,n) 截取数组,从1到n,1和n为索引值 返回截取的数组(在这里返回从1开始,到n之前结束)
Array.indexOf(a,start) 查找a的所在的位置,从start开始 返回a所在的索引值,如果没有查找到则返回-1
Array.lastIndexOf(a,atart) 与indexOf相反,lastIndexOf从末尾开始查找 返回a所在的索引值,如果没有查找到则返回-1

splice()方法单拿出来说说。为什么单拿出来?因为牛逼;

1.删除。接受两个参数:要删除第一项的位置和要删除的项数;

例:splice(1,2),就是要删除数组种的2,3项;

2.插入。接受三个参数:起始位置,0,要插入的项。

例:splice(2,0,"red","green"),会在数组索引值为2的位置插入red和green。

3.替换。接受三个参数:起始位置,要删除的项数,要插入的项。

例:splice(2,1,"red","green"),删除索引值为2这一项,添加red和green。

tips:sort()用法实例:按升序排列数组
function compare(val1,val2){
if(val1<val2){
return -1;
}else if(val1>val2){
return 1;
}else{
retuen 0
}
}
var num=[0,2,9,3,1];
num.sort(compare);
alert(num);//0,1,2,3,9

 五。数组中的迭代方法

1.every()和some():

查询数组中的每一项是否满足条件,如果每一项都返回true,则result返回true。
var numbers=[0,1,2,3,4];
var result=numbers.every(function(item,index,array){
return (item>2)
})
alert(result);//false
查询数组中的每一项是否满足条件,如果有一项都返回true,则result返回true。
var numbers=[0,1,2,3,4];
var result=numbers.some(function(item,index,array){
return (item>2)
})
alert(result);//true

2.filter():

该方法会返回结果为true的项组成的数组;

3.map():

var result=numbers.map(function(item,index,array){
return item*2;
})

返回数组执行完参数之后的新数组。

六、归并

Array.reduce()

var numbers=[1,2,3,4,5];
var sum=numbers.reduce(function(prev,cur,index,array){
return prev+cur
})
alert(sum);

在上个例子中,reduce()接受四个参数,第一个参数是数组的第一项,第二个参数是数组的第二项;

第一次执行函数,prev是1,cur是2,第二次执行,prev是3(1+2的结果),cur是3。

Array.reduceRight()。和reduce类似。只不过从数组右侧开始。

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
jQuery实现可拖动的浮动层完整代码
May 27 Javascript
JavaScript加强之自定义event事件
Sep 21 Javascript
JQEasy-ui在IE9以下版本中二次加载的问题分析及处理方法
Jun 23 Javascript
js+HTML5基于过滤器从摄像头中捕获视频的方法
Jun 16 Javascript
jQuery+JSON实现AJAX二级联动实例分析
Dec 18 Javascript
解析利用javascript如何判断一个数为素数
Dec 08 Javascript
原生JS轮播图插件
Feb 09 Javascript
详解ES6中的代理模式——Proxy
Jan 08 Javascript
JS获取url参数,JS发送json格式的POST请求方法
Mar 29 Javascript
vue首次赋值不触发watch的解决方法
Sep 11 Javascript
vue中的mvvm模式讲解
Jan 31 Javascript
js实现聊天对话框
Feb 08 Javascript
原生javascript实现图片放大镜效果
Jan 18 #Javascript
jQuery Validation Engine验证控件调用外部函数验证的方法
Jan 18 #Javascript
原生js实现回复评论功能
Jan 18 #Javascript
js实现表格筛选功能
Jan 18 #Javascript
js放大镜放大购物图片效果
Jan 18 #Javascript
详解vue 中使用 AJAX获取数据的方法
Jan 18 #Javascript
easyui 中的datagrid跨页勾选问题的实现方法
Jan 18 #Javascript
You might like
在同一窗体中使用PHP来处理多个提交任务
2006/10/09 PHP
兼容PHP5的PHP目录管理函数库
2008/07/10 PHP
PHP form 表单传参明细研究
2009/07/17 PHP
php中in_array函数用法分析
2014/11/15 PHP
codeigniter发送邮件并打印调试信息的方法
2015/03/21 PHP
利用PHP将图片转换成base64编码的实现方法
2016/09/13 PHP
PHP脚本自动识别验证码查询汽车违章
2016/12/20 PHP
javascript Prototype 对象扩展
2009/05/15 Javascript
javascript 关闭IE6、IE7
2009/06/01 Javascript
关于query Javascript CSS Selector engine
2013/04/12 Javascript
Ext GridPanel加载完数据后进行操作示例代码
2014/06/17 Javascript
Java中Timer的用法详解
2015/10/21 Javascript
基于JavaScript创建动态Dom
2015/12/08 Javascript
js HTML5 Canvas绘制转盘抽奖
2020/09/13 Javascript
微信小程序 setData使用方法及常用错误解决办法
2017/05/11 Javascript
angularjs2中父子组件的数据传递的实例代码
2017/07/05 Javascript
js实现登录注册框手机号和验证码校验(前端部分)
2017/09/28 Javascript
vue-resource + json-server模拟数据的方法
2017/11/02 Javascript
vue实现动态添加数据滚动条自动滚动到底部的示例代码
2018/07/06 Javascript
详解React之key的使用和实践
2018/09/29 Javascript
解决VUE-Router 同一页面第二次进入不刷新的问题
2020/07/22 Javascript
ant design vue 表格table 默认勾选几项的操作
2020/10/31 Javascript
Python数据类型详解(一)字符串
2016/05/08 Python
基于Python的PIL库学习详解
2019/05/10 Python
Python中typing模块与类型注解的使用方法
2019/08/05 Python
解决python pandas读取excel中多个不同sheet表格存在的问题
2020/07/14 Python
python3.8.3安装教程及环境配置的详细教程(64-bit)
2020/11/28 Python
HTML5仿手机微信聊天界面
2016/03/18 HTML / CSS
伦敦一家西班牙童装精品店:La Coqueta
2018/02/02 全球购物
焊接专业毕业生求职信
2013/10/01 职场文书
小学后勤管理制度
2014/01/14 职场文书
高中体育教学反思
2014/01/24 职场文书
法制宣传标语集锦
2014/06/25 职场文书
2014国庆节标语口号
2014/09/19 职场文书
继承公证书格式
2015/01/26 职场文书
导游词之山东红叶谷
2019/10/31 职场文书