JavaScript中的数组操作介绍


Posted in Javascript onDecember 30, 2014

JavaScript中的数组对象自带了一些方法,可以通过使用这些方法来对数组进行操作。

 

join()

 

可以使用join()方法将数组中的成员合并到一个字符串中:

var o = [1,2,3];

console.log(o.join());//1,2,3

console.log(o.join(" "));//1 2 3

var emptyArray = new Array(10);

console.log(emptyArray.join("-"));//----------

从上面的例子中可以看到,如果join()方法不带参数,那么JavaScript会用逗号作为分隔符将所有的成员合并到一个字符串中;如果join()方法接受参数,那么这个参数会作为分隔符来使用。

reverse()

可以使用reverse()方法将数组中的成员顺序进行颠倒:

//reverse()

o.reverse();

console.log(o);//[3,2,1]

可以看到,调用reverse()语句后,数组自身将发生改变。

执行reverse()语句的返回结果为发生改变后的数组对象。

sort()

可以使用sort()方法对数组中的成员进行排序(默认以字母顺序排列)。与reverse()语句一样,sort()语句会对数组自身进行修改并返回修改后的数组对象:

var a = ["Phone", "Mobile",,,"Canon"];

a.sort();

console.log(a);//["Canon", "Mobile", "Phone", undefined, undefined]

var b = [33,44,111];

console.log(b.sort());//[111, 33, 44]

console.log(b.sort(function(a,b){return a-b}));//[33, 44, 111]

可以看到,sort()语句还接受一个function作为参数来实现自定义排序。

concat()

可以使用concat()方法对数组进行拼接:

var c = [1,2,3];

console.log(c.concat(4));//[1, 2, 3, 4]

console.log(c.concat(5,6));//[1, 2, 3, 5, 6]

console.log(c.concat([7,8]));//[1, 2, 3, 7, 8]

console.log(c.concat([9,10], [11,12]));//[1, 2, 3, 9, 10, 11, 12]

console.log(c.concat([42,43,[44,45]]));//[1, 2, 3, 42, 43, [44, 45]]

console.log(c);//[1, 2, 3]

可以看到,与reverse()和sort()不同,concat()语句仅仅只是返回拼接后的结果而已,对数组自身不会产生任何修改。

slice()

可以使用slice()语句来获取数组中的子数组(sub-array):

var d = [1,2,3,4,5,6];

console.log(d.slice(0,3));//[1,2,3]

console.log(d.slice(3,1));//[]

与concat()一样,slice()语句仅仅只是返回操作后的结果而已,对数组自身不会产生任何修改。对于slice()语句中的两个参数,JavaScript遵循“前包括后不包括”的原则:第一个参数所指定的数组成员会出现在子数组中,而第二个参数所指定的数组成员则不会出现。

splice()

可以使用splice()语句来对数组进行插入和敲除操作。其第一个参数指定插入或敲除的位置(位置成员),第二个参数指定敲除成员的数目(从位置成员开始敲除),从第三个参数开始,所有的参数都会被插入到数组中(从位置成员之前进行插入)。splice()语句返回的结果为被敲除的数组成员所组成的数组。与concat()和slice()不同,splice()会对数组自身产生修改。

var e = [1,2,3,4,5,6,7];

console.log(e.splice(1,2));//[2,3]

console.log(e);//[1,4,5,6,7]

console.log(e.length);//5

e.splice(1,0,2,3,[4,5]);

console.log(e);//[1, 2, 3, [4, 5], 4, 5, 6, 7]
Javascript 相关文章推荐
js 幻灯片的实现
Dec 06 Javascript
基于jquery实现后台左侧菜单点击上下滑动显示
Apr 11 Javascript
js类定义函数时用prototype与不用的区别示例介绍
Jun 10 Javascript
Javascript中封装window.open解决不兼容问题
Sep 28 Javascript
JavaScript实现弹出子窗口并传值给父窗口
Dec 18 Javascript
vue中渐进过渡效果实现
Oct 27 Javascript
javaScript中封装的各种写法示例(推荐)
Jul 03 Javascript
Vue 菜单栏点击切换单个class(高亮)的方法
Aug 22 Javascript
vue项目中使用tinymce编辑器的步骤详解
Sep 11 Javascript
深入理解Puppeteer的入门教程和实践
Mar 05 Javascript
iview实现图片上传功能
Jun 29 Javascript
JavaScript undefined及null区别实例解析
Jul 21 Javascript
jQuery中:first选择器用法实例
Dec 30 #Javascript
JavaScript中的类数组对象介绍
Dec 30 #Javascript
JavaScript中的方法调用详细介绍
Dec 30 #Javascript
JavaScript中的闭包(Closure)详细介绍
Dec 30 #Javascript
JavaScript中的类(Class)详细介绍
Dec 30 #Javascript
JavaScript实现防止网页被嵌入Frame框架的代码分享
Dec 29 #Javascript
jQuery实现ichat在线客服插件
Dec 29 #Javascript
You might like
PHP伪造referer实例代码
2008/09/20 PHP
使用新浪微博API的OAuth认证发布微博实例
2015/03/27 PHP
PHP里的单例类写法实例
2015/06/25 PHP
建议大家看下JavaScript重要知识更新
2007/07/08 Javascript
网上应用的一个不错common.js脚本
2007/08/08 Javascript
javascript中的循环语句for语句深入理解
2014/04/04 Javascript
js单词形式的运算符
2014/05/06 Javascript
跟我学Nodejs(二)--- Node.js事件模块
2014/05/21 NodeJs
jQuery中的编程范式详解
2014/12/15 Javascript
JQuery的ON()方法支持的所有事件罗列
2015/02/28 Javascript
JS实现自动固定顶部的悬浮菜单栏效果
2015/09/16 Javascript
JS上传图片预览插件制作(兼容到IE6)
2016/08/07 Javascript
浅谈js之字面量、对象字面量的访问、关键字in的用法
2016/11/20 Javascript
原生js实现弹出层效果
2017/01/20 Javascript
vue项目中实现的微信分享功能示例
2019/01/21 Javascript
在vue项目中引入vue-beauty操作方法
2019/02/11 Javascript
javascript面向对象创建对象的方式小结
2019/07/29 Javascript
解决layer弹出层msg的文字不显示的问题
2019/09/11 Javascript
vue实现图书管理系统
2020/12/29 Vue.js
[00:10]神之谴戒
2019/03/06 DOTA
python fabric使用笔记
2015/05/09 Python
Python中urllib+urllib2+cookielib模块编写爬虫实战
2016/01/20 Python
使用Python设计一个代码统计工具
2018/04/04 Python
一篇文章彻底搞懂Python中可迭代(Iterable)、迭代器(Iterator)与生成器(Generator)的概念
2019/05/13 Python
Python 依赖库太多了该如何管理
2019/11/08 Python
python实现高斯(Gauss)迭代法的例子
2019/11/20 Python
浅析HTML5 Landmark
2020/09/11 HTML / CSS
SheIn俄罗斯:时尚女装网上商店
2017/02/28 全球购物
英国在线发型和美容产品商店:Beauty Cutie
2019/04/27 全球购物
Servlet都有哪些方法?主要作用是什么?
2014/03/04 面试题
失业者真诚求职信范文
2013/12/25 职场文书
党员对照检查材料整改措施思想汇报
2014/09/26 职场文书
员工2014年度工作总结
2014/12/09 职场文书
2014年稽查工作总结
2014/12/20 职场文书
工艺技术员岗位职责
2015/02/04 职场文书
开学典礼致辞
2015/07/29 职场文书