JavaScript 中有关数组对象的方法(详解)


Posted in Javascript onAugust 15, 2016

JS 处理数组多种方法

js 中的数据类型分为两大类:原始类型和对象类型。

原始类型包括:数值、字符串、布尔值、null、undefined

对象类型包括:对象即是属性的集合,当然这里又两个特殊的对象----函数(js中的一等对象)、数组(键值的有序集合)。

数组元素的添加

arrayObj.push([item1 [item2 [. . . [itemN ]]]]);

将一个或多个新元素添加到数组结尾,并返回数组新长度

arrayObj.unshift([item1 [item2 [. . . [itemN ]]]]);

将一个或多个新元素添加到数组开始,数组中的元素自动后移,返回数组新长度

arrayObj.splice(insertPos,0,[item1[, item2[, . . . [,itemN]]]]);

将一个或多个新元素插入到数组的指定位置,插入位置的元素自动后移,返回""

数组元素的删除

arrayObj.pop();

移除最后一个元素并返回该元素值

arrayObj.shift();

移除最前一个元素并返回该元素值,数组中元素自动前移

arrayObj.splice(deletePos,deleteCount);

删除从指定位置deletePos开始的指定数量deleteCount的元素,数组形式返回所移除的元素

截取与合并

arrayObj.slice(start, [end]);

以数组的形式返回数组的一部分,注意不包括 end 对应的元素,如果省略 end 将复制 start 之后的所有元素

arrayObj.concat([item1[, item2[, . . . [,itemN]]]]);

将多个数组(也可以是字符串,或者是数组和字符串的混合)连接为一个数组,返回连接好的新的数组

数组的拷贝

arrayObj.slice(0);

返回数组的拷贝数组,注意是一个新的数组,不是指向

arrayObj.concat();

返回数组的拷贝数组,注意是一个新的数组,不是指向

数组元素的排序

arrayObj.reverse();

反转元素(最前的排到最后、最后的排到最前),返回数组地址

arrayObj.sort();

对数组元素排序,返回数组地址

数组元素的插入

arrayObj.splice(insertPos,0, [item1[, item2[, . . . [,itemN]]]]);

从 insertPos 位置插入指定的item元素,0代表删除0个元素,返回空数组

数组元素的替换

arrayObj.splice(insertPos,replaceCount, [item1[, item2[, . . . [,itemN]]]]);

从 insertPos 位置删除 replaceCount 个元素,再从 insertPos 位置添加指定的item元素,数组形式返回被删除的元素

数组元素的位置

arrayObj.indexOf(findThing,start);

从要查找的起点(可选) start 开始向后找要查找的项 findThing ,找的准则是全等,找到则返回该值的位置,找不到则返回-1

arrayObj.lastIndexOf(findThing,number)

从要查找的起点(可选) start 开始向前找要查找的项 findThing ,找的准则是全等,找到则返回该值的位置,找不到则返回-1

数组元素的迭代

arrayObj.every()

对数组中的每一项运行给定的函数,如果该函数对每一项都返回 true ,则返回 true

arrayObj.filter()

对数组中的每一项运行给定的函数,返回该函数会返回 true 的项组成的数组

arrayObj.forEach()

对数组中的每一项运行给定的函数,这个方法没有返回值

arrayObj.map()

对数组中的每一项运行给定的函数,返回每次函数调用的结果组成的数组

arrayObj.some()

对数组中的每一项运行给定的函数,如果该函数对任一项返回 true ,则返回 true

数组元素的归并

arrayObj.reduce(prev, cur, index, array)

从数组的第一项开始,逐个便利到最后,四个参数分别为前一个值,当前值,项的索引和数组对象,函数返回的任何值会作为第一个参数自动传给下一项

000

arrayObj.reduceRight()

从数组的最后开始,逐个便利到第一项,四个参数分别为前一个值,当前值,项的索引和数组对象,函数返回的任何值会作为第一个参数自动传给下一项

数组元素的字符串化

arrayObj.join(separator);

返回字符串,这个字符串将数组的每一个元素值连接在一起,中间用 separator 隔开。

toLocaleString 、toString 、valueOf:可以看作是join的特殊用法,不常用

toSource() 返回该对象的源代码

toString() 把数组转换为字符串,并返回结果

toLocaleString() 把数组转换为本地数组,并返回结果

valueOf() 返回数组对象的原始值

ES5 新增

Array.prototype.indexOf

indexOf()方法返回在该数组中第一个找到的元素位置,如果它不存在则返回-1。

Array.prototype.lastIndexOf

Array.prototype.every

Array.prototype.some

Array.prototype.forEach

forEach为每个元素执行对应的方法

Array.prototype.map

map()对数组的每个元素进行一定操作(映射)后,会返回一个新的数组

map()是处理服务器返回数据时是一个非常实用的函数

Array.prototype.filter

该filter()方法创建一个新的匹配过滤条件的数组。

Array.prototype.reduce

reduce()可以实现一个累加器的功能,将数组的每个值(从左到右)将其降低到一个值

场景: 统计一个数组中有多少个不重复的单词

Array.prototype.reduceRight

以上这篇JavaScript 中有关数组对象的方法(详解)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
一个可拖拽列宽表格实例演示
Nov 26 Javascript
JavaScript 判断浏览器是否支持SVG的代码
Mar 21 Javascript
js中的前绑定和后绑定详解
Aug 01 Javascript
javascript实现的右下角弹窗实例
Apr 24 Javascript
JavaScript字符串删除重复字符的方法
Dec 25 Javascript
将 vue 生成的 js 上传到七牛的实例
Jul 28 Javascript
ionic3 懒加载
Aug 16 Javascript
JavaScript学习笔记之惰性函数示例详解
Aug 27 Javascript
使用Electron构建React+Webpack桌面应用的方法
Dec 15 Javascript
Javascript柯里化实现原理及作用解析
Oct 22 Javascript
react中props 的使用及进行限制的方法
Apr 28 Javascript
GitHub上77.9K的Axios项目有哪些值得借鉴的地方详析
Jun 15 Javascript
onmouseover事件和onmouseout事件全面理解
Aug 15 #Javascript
浅谈toLowerCase和toLocaleLowerCase的区别
Aug 15 #Javascript
又一款js时钟!transform实现时钟效果
Aug 15 #Javascript
最丑的时钟效果!js canvas时钟制作方法
Aug 15 #Javascript
深入分析javascript中console命令
Aug 14 #Javascript
Vue.js 表单校验插件
Aug 14 #Javascript
Vue.js学习笔记之 helloworld
Aug 14 #Javascript
You might like
php pcntl_fork和pcntl_fork 的用法
2009/04/13 PHP
php表单提交问题的解决方法
2011/04/12 PHP
php中的strpos使用示例
2014/02/27 PHP
在Laravel5中正确设置文件权限的方法
2019/05/22 PHP
Laravel如何同时连接多个数据库详解
2019/08/13 PHP
一文看懂PHP进程管理器php-fpm
2020/06/01 PHP
PHP程序守护进程化实现方法详解
2020/07/16 PHP
JavaScript 基础问答三
2008/12/03 Javascript
菜鸟javascript基础整理1
2010/12/06 Javascript
jquery的ajax请求全面了解
2013/03/20 Javascript
利用JS实现浏览器的title闪烁
2013/07/08 Javascript
js中如何把字符串转化为对象、数组示例代码
2013/07/17 Javascript
jQuery内部原理和实现方式浅析
2015/02/03 Javascript
深入理解JavaScript系列(22):S.O.L.I.D五大原则之依赖倒置原则DIP详解
2015/03/05 Javascript
window.onload使用指南
2015/09/13 Javascript
jQuery EasyUI API 中文帮助文档和扩展实例
2016/08/01 Javascript
javascript学习之json入门
2016/12/22 Javascript
解决nodejs中使用http请求返回值为html时乱码的问题
2017/02/18 NodeJs
详解Angular-Cli中引用第三方库
2017/05/21 Javascript
js实现文字列表无缝滚动效果
2017/06/23 Javascript
JavaScript解析任意形式的json树型结构展示
2017/07/23 Javascript
Node.js自定义实现文件路由功能
2017/09/22 Javascript
mescroll.js上拉加载下拉刷新组件使用详解
2017/11/13 Javascript
详解redis在nodejs中的应用
2018/05/02 NodeJs
详解如何用typescript开发koa2的二三事
2018/11/13 Javascript
何时/使用 Vue3 render 函数的教程详解
2020/07/25 Javascript
js实现简易ATM功能
2020/10/27 Javascript
[20:30]职业巡回赛回顾
2018/08/09 DOTA
200 行python 代码实现 2048 游戏
2018/01/12 Python
python使用pygame模块实现坦克大战游戏
2020/03/25 Python
Django {{ MEDIA_URL }}无法显示图片的解决方式
2020/04/07 Python
基于Python-turtle库绘制路飞的草帽骷髅旗、美国队长的盾牌、高达的源码
2021/02/18 Python
html5绘制时钟动画
2014/12/15 HTML / CSS
浅析HTML5:'data-'属性的作用
2018/01/23 HTML / CSS
学生党员一帮一活动总结
2014/07/08 职场文书
英语读书笔记
2015/07/02 职场文书