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 相关文章推荐
IE不支持getElementsByClassName最终完美解决方案
Dec 17 Javascript
javascript获取元素CSS样式代码示例
Nov 28 Javascript
基于jquery实现的文字向上跑动类似跑马灯的效果
Jun 17 Javascript
Express实现前端后端通信上传图片之存储数据库(mysql)傻瓜式教程(一)
Dec 10 Javascript
js检查是否关闭浏览器的方法
Aug 02 Javascript
解决vue2.x中数据渲染以及vuex缓存的问题
Jul 13 Javascript
JS SetInterval 代码实现页面轮询
Aug 11 Javascript
vue组件(全局,局部,动态加载组件)
Sep 02 Javascript
webpack4 入门最简单的例子介绍
Sep 05 Javascript
Koa代理Http请求的示例代码
Oct 10 Javascript
layui清空,重置表单数据的实例
Sep 12 Javascript
element-ui点击查看大图的方法示例
Dec 14 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学习笔记 面向对象中[接口]与[多态性]的应用
2011/06/16 PHP
thinkPHP学习笔记之安装配置篇
2015/03/05 PHP
PHP中preg_match函数正则匹配的字符串长度问题
2015/05/27 PHP
Yii2框架实现注册和登录教程
2016/09/30 PHP
PHP中仿制 ecshop验证码实例
2017/01/06 PHP
js 时间函数应用加、减、比较、格式转换的示例代码
2013/08/23 Javascript
利用JQuery制作符合Web标准的QQ弹出消息
2014/01/14 Javascript
javascript ajax的5种状态介绍
2014/08/18 Javascript
JS中自定义定时器让它在某一时刻执行
2014/09/02 Javascript
触屏中的JavaScript事件分析
2015/02/06 Javascript
jquery append 动态添加的元素事件on 不起作用的解决方案
2015/07/30 Javascript
判断数组是否包含某个元素的js函数实现方法
2016/05/19 Javascript
jQuery过滤特殊字符及JS字符串转为数字
2016/05/26 Javascript
AngularJS 所有版本下载地址
2016/09/14 Javascript
浅谈js使用in和hasOwnProperty获取对象属性的区别
2017/04/27 Javascript
浅谈js基础数据类型和引用类型,深浅拷贝问题,以及内存分配问题
2017/09/02 Javascript
详解webpack4升级指南以及从webpack3.x迁移
2018/06/12 Javascript
浅谈Node新版本13.2.0正式支持ES Modules特性
2019/11/25 Javascript
python实现根据窗口标题调用窗口的方法
2015/03/13 Python
Python如何实现MySQL实例初始化详解
2017/11/06 Python
详解Django 中是否使用时区的区别
2018/06/14 Python
tensorflow使用神经网络实现mnist分类
2018/09/08 Python
PyQt5重写QComboBox的鼠标点击事件方法
2019/06/25 Python
matplotlib绘制多个子图(subplot)的方法
2019/12/03 Python
Python通过socketserver处理多个链接
2020/03/18 Python
html5的canvas元素使用方法介绍(画矩形、画折线、圆形)
2014/04/14 HTML / CSS
美国最大最全的亚洲购物网站:美国亚米网(Yamibuy)
2020/05/05 全球购物
体育教育毕业生自荐信
2014/06/29 职场文书
优秀团员事迹材料1500字
2014/08/31 职场文书
干部作风建设个人剖析材料
2014/10/11 职场文书
2015年社会实践个人总结
2015/03/06 职场文书
对公司的意见和建议
2015/06/04 职场文书
签证扫盲贴,41个常见签证知识,需要的拿走
2019/08/09 职场文书
原生JS中应该禁止出现的写法
2021/05/05 Javascript
Python借助with语句实现代码段只执行有限次
2022/03/23 Python
python可视化分析绘制带趋势线的散点图和边缘直方图
2022/06/25 Python