js Array操作的最简短最容易理解方法


Posted in Javascript onDecember 09, 2013

Array 的方法
1 Array.join(): 把所有元素用符号连结成string返回, 如果元素不是基本类型, 先调用toString.
它对应string.split();
arr = [1,2,true,3,4,5];
(arr.join('-') == '1-2-true-3-4-5';

2 Array.reverse(): 逆序排列数组
arr = [1,2,true,3,4,5];
arr.reverse();// arr == [5,4,3,true,2,1];

3 Array.sort(): 排序,可以传递一个排序函数作参数
arr.sort(function(a,b){
    return a-b;
});

4 Array.concat(): 拼接函数,
在末尾拼接上新元素,返回拼接后的array,但是不改变原array;参数可以是一个元素,多个元素,一个数组,
如果是一个元素,或多个元素,直接把这些元素加到末尾,如果是一个数组,则把数组各个元素拿出来拼接到尾部。
a = [1,2,3];
a.concat(4,5)// return [1,2,3,4,5]
a.concat([4,5])// return [1,2,3,4,5]
a.concat([4,5],[6,7]);//return [1,2,3,4,5,6,7]
a.concat([4,[5,6]])//return [1,2,3,4,[5,6]]//注意

5 Array.slice(startPos, endPos): 取子字符串函数(原array保持不变)
从startPos开始到endPos结束但不包括endPos上的元素
如果没有endPos,则取到尾
如果pos为负, 则倒着数
a = [1,2,3,4,5];
a.slice(0,3)// return [1,2,3]
a.slice(3)//return [4,5]
a.slice(1,-1)//return [2,3,4]//从第一个开始取,取到倒数第1个,但不包括倒数第1个
a.slice(1,-2);//return [2,3]//从第一个开始取,取到倒数第2个,但不包括倒数第2个

6 Array.splice(startPos, length, [added1, added2...]) 随机存取函数
可以随机删除一个(些)元素,也可以加上一些元素,
如果只有两个参数,则从array中删除从startPos开始总共length个元素
如果有两个以上参数,则从array中删除从startPos开始总共length个元素,再从刚才删除的位置添加上后面的元素
如果被添加的元素是一个数组则把这个数组作为一个元素(与concat差别)
a = [1,2,3,4,5];
a.splice(1,2)//return [2,3]; a==[1,4,5]
a.splice(1,2,6,7,8)//return [2,3]; a==[1,6,7,8,4,5]
a.splice(1,2,[6,7,8]);//return [2,3]; a==[1,[6,7,8],4,5]

7 Array.push() 和 Array.pop();
都是操作最后一个元素,push是添加,pop是删除最后一个元素并返回该元素

8 Array.unshift() 和 Array.shift()
都是操作第一个元素,unshift是添加,shift是删除第一个元素并返回该元素

合计起来
这些方法会改变原array:reverse, sort, splice, push, pop, unshift, shift
这些方法不会改变原array:join, concat, splice

Javascript 相关文章推荐
让FireFox支持innerText的实现代码
Dec 01 Javascript
JS代码优化技巧之通俗版(减少js体积)
Dec 23 Javascript
点击隐藏页面左栏或右栏实现js代码
Apr 01 Javascript
深入浅出理解javaScript原型链
May 09 Javascript
jQuery鼠标事件总结
Oct 13 Javascript
javascript轮播图算法
Oct 21 Javascript
Bootstrap3下拉菜单的实现
Feb 22 Javascript
详解Vue 普通对象数据更新与 file 对象数据更新
Apr 26 Javascript
JS获取鼠标坐标并且根据鼠标位置不同弹出不同内容
Jun 12 Javascript
Vue中定义全局变量与常量的各种方式详解
Aug 23 Javascript
深入理解移动前端开发之viewport
Oct 19 Javascript
Vue.js中使用Vuex实现组件数据共享案例
Jul 31 Javascript
javascript放大镜效果的简单实现
Dec 09 #Javascript
javascript贪吃蛇完整版(源码)
Dec 09 #Javascript
关于js内存泄露的一个好例子
Dec 09 #Javascript
JS连连看源码完美注释版(推荐)
Dec 09 #Javascript
解析Javascript中难以理解的11个问题
Dec 09 #Javascript
深入理解Javascript作用域与变量提升
Dec 09 #Javascript
Javascript全局变量var与不var的区别深入解析
Dec 09 #Javascript
You might like
PHP第一季视频教程(李炎恢+php100 不断更新)
2011/05/29 PHP
php利用iframe实现无刷新文件上传功能的代码
2011/09/29 PHP
PHP两种去掉数组重复值的方法比较
2014/06/19 PHP
php cookie工作原理与实例详解
2016/07/18 PHP
PHP基于curl后台远程登录正方教务系统的方法
2016/10/14 PHP
php使用Jpgraph创建柱状图展示年度收支表效果示例
2017/02/15 PHP
Laravel框架生命周期与原理分析
2018/06/12 PHP
PHP基于curl模拟post提交json数据示例
2018/06/22 PHP
一个加载js文件的小脚本
2007/06/28 Javascript
window.onload 加载完毕的问题及解决方案(上)
2009/07/09 Javascript
jquery动画4.升级版遮罩效果的图片走廊--带自动运行效果
2012/08/24 Javascript
求数组最大最小值方法适用于任何数组
2013/08/16 Javascript
jQuery模拟点击A标记示例参考
2014/04/17 Javascript
浅谈JavaScript实现面向对象中的类
2014/12/09 Javascript
javascript手风琴下拉菜单实现代码
2015/11/12 Javascript
AngularJS中的指令全面解析(必看)
2016/05/20 Javascript
jQuery中show与hide方法用法示例
2016/09/16 Javascript
详解Vue路由开启keep-alive时的注意点
2017/06/20 Javascript
react 父组件与子组件之间的值传递的方法
2017/09/14 Javascript
JS高级技巧(简洁版)
2018/07/29 Javascript
微信小程序实现登录注册功能
2020/12/29 Javascript
vue中使用echarts的示例
2021/01/03 Vue.js
Python自动发邮件脚本
2017/03/31 Python
在Python中使用defaultdict初始化字典以及应用方法
2018/10/31 Python
pycharm 解除默认unittest模式的方法
2018/11/30 Python
python进阶之自定义可迭代的类
2019/08/20 Python
如何用Python 实现全连接神经网络(Multi-layer Perceptron)
2020/10/15 Python
如何利用CSS3制作3D效果文字具体实现样式
2013/05/02 HTML / CSS
英国安全产品购物网站:The Safe Shop
2017/03/20 全球购物
德国运动营养和健身网上商店:Myprotein.de
2018/07/18 全球购物
请用用Java代码写一个堆栈
2012/01/26 面试题
大学生学期自我鉴定
2014/03/19 职场文书
助人为乐好少年事迹材料
2014/08/18 职场文书
环卫处个人工作总结
2015/03/04 职场文书
2016应届毕业生就业指导课心得体会
2016/01/15 职场文书
Python基础详解之邮件处理
2021/04/28 Python