实例讲解JS中数组Array的操作方法


Posted in Javascript onMay 09, 2014

js数组元素的添加和删除一直比较迷惑,今天终于找到详细说明的资料了,先给个我测试的代码^-^

var arr = new Array();
arr[0] = "aaa";
arr[1] = "bbb";
arr[2] = "ccc";
//alert(arr.length);//3
arr.pop();
//alert(arr.length);//2
//alert(arr[arr.length-1]);//bbb
arr.pop();
//alert(arr[arr.length-1]);//aaa
//alert(arr.length);//1
var arr2 = new Array();
//alert(arr2.length);//0
arr2[0] = "aaa";
arr2[1] = "bbb";
//alert(arr2.length);//2
arr2.pop();
//alert(arr2.length);//1
arr2 = arr2.slice(0,arr2.length-1);
//alert(arr2.length);//0
arr2[0] = "aaa";
arr2[1] = "bbb";
arr2[2] = "ccc";
arr2 = arr2.slice(0,1);
alert(arr2.length);//1
alert(arr2[0]);//aaa
alert(arr2[1]);//undefined
shift:删除原数组第一项,并返回删除元素的值;如果数组为空则返回undefined
var a = [1,2,3,4,5];
var b = a.shift(); //a:[2,3,4,5]   b:1
unshift:将参数添加到原数组开头,并返回数组的长度
var a = [1,2,3,4,5];
var b = a.unshift(-2,-1); //a:[-2,-1,1,2,3,4,5]   b:7
注:在IE6.0下测试返回值总为undefined,FF2.0下测试返回值为7,所以这个方法的返回值不可靠,需要用返回值时可用splice代替本方法来使用。
pop:删除原数组最后一项,并返回删除元素的值;如果数组为空则返回undefined
var a = [1,2,3,4,5];
var b = a.pop(); //a:[1,2,3,4]   b:5//不用返回的话直接调用就可以了
push:将参数添加到原数组末尾,并返回数组的长度
var a = [1,2,3,4,5];
var b = a.push(6,7); //a:[1,2,3,4,5,6,7]   b:7
concat:返回一个新数组,是将参数添加到原数组中构成的
var a = [1,2,3,4,5];
var b = a.concat(6,7); //a:[1,2,3,4,5]   b:[1,2,3,4,5,6,7]
splice(start,deleteCount,val1,val2,...):从start位置开始删除deleteCount项,并从该位置起插入val1,val2,...
在清空数组时,只需传递startIndex。
如果不删除所有元素,再传递deleteCount参数。
splice还具有先删除后添加的功能,即先删除几个元素,然后在删除的位置再添加若干元素,删除与添加的元素的个数没有必须相等,这时侯deleteCount也是要用到的。
var a = [1,2,3,4,5];
var b = a.splice(2,2,7,8,9); //a:[1,2,7,8,9,5]   b:[3,4]
var b = a.splice(0,1); //同shift
a.splice(0,0,-2,-1); var b = a.length;//同unshift
var b = a.splice(a.length-1,1);//同pop
a.splice(a.length,0,6,7); var b = a.length; //同push
reverse:将数组反序
var a = [1,2,3,4,5];
var b = a.reverse(); //a:[5,4,3,2,1]   b:[5,4,3,2,1]
sort(orderfunction):按指定的参数对数组进行排序
var a = [1,2,3,4,5];
var b = a.sort(); //a:[1,2,3,4,5]   b:[1,2,3,4,5]
slice(start,end):返回从原数组中指定开始下标到结束下标之间的项组成的新数组
var a = [1,2,3,4,5];
var b = a.slice(2,5); //a:[1,2,3,4,5]   b:[3,4,5]
join(separator):将数组的元素组起一个字符串,以separator为分隔符,省略的话则用默认用逗号为分隔符
var a = [1,2,3,4,5];
var b = a.join("|"); //a:[1,2,3,4,5]   b:"1|2|3|4|5"
再给个利用数组模拟javaStringBuffer处理字符串的方法:
/**
* 字符串处理函数
*/
function StringBuffer() {
var arr = new Array;
this.append = function(str) {
    arr[arr.length] = str;
};
this.toString = function() {
    return arr.join("");//把append进来的数组ping成一个字符串
};
}
今天在应用中突然发现join是一种把数组转换成字符串的好方法,故封装成对象使用了:
/**
*把数组转换成特定符号分割的字符串
*/
function arrayToString(arr,separator) {
if(!separator) separator = "";//separator为null则默认为空
    return arr.join(separator);
}
/**
* 查找数组包含的字符串
*/
function arrayFindString(arr,string) {
var str = arr.join("");
    return str.indexOf(string);
}
Javascript 相关文章推荐
IE Firefox 使用自定义标签的区别
Oct 15 Javascript
Javascript基础教程之数组 array
Jan 18 Javascript
IE10中flexigrid无法显示数据的解决方法
Jul 26 Javascript
详解JavaScript对象序列化
Jan 19 Javascript
获取JavaScript异步函数的返回值
Dec 21 Javascript
详解使用vue实现tab 切换操作
Jul 03 Javascript
老生常谈Bootstrap媒体对象
Jul 06 Javascript
解决JSON.stringify()自动将中文转译成unicode的问题
Jan 05 Javascript
解决element UI 自定义传参的问题
Aug 22 Javascript
vue-cli 3.x 配置Axios(proxyTable)跨域代理方法
Sep 19 Javascript
微信小程序自定义轮播图
Nov 04 Javascript
最简单的JS实现json转csv的方法
Jan 10 Javascript
一个JavaScript的求爱小特效
May 09 #Javascript
js中的setInterval和setTimeout使用实例
May 09 #Javascript
js获取 type=radio 值的方法
May 09 #Javascript
js实现的点击数量加一可操作数据库
May 09 #Javascript
jQuery照片伸缩效果不影响其他元素的布局
May 09 #Javascript
js四舍五入数学函数round使用实例
May 09 #Javascript
JavaScript实现的购物车效果可以运用在好多地方
May 09 #Javascript
You might like
三国漫画《火凤燎原》宣布动画化PV放出 预计2020年播出
2020/03/08 国漫
Terran热键控制
2020/03/14 星际争霸
使用PHP实现微信摇一摇周边红包
2016/01/04 PHP
PHP数组中头部和尾部添加元素的方法(array_unshift,array_push)
2017/04/10 PHP
javascript URL锚点取值方法
2009/02/25 Javascript
JQuery 实现的页面滚动时浮动窗口控件
2009/07/10 Javascript
javascript与webservice的通信实现代码
2010/12/25 Javascript
高性能Javascript笔记 数据的存储与访问性能优化
2012/08/02 Javascript
js与jquery获取父级元素,子级元素,兄弟元素的实现方法
2014/01/09 Javascript
jquery基础教程之数组使用详解
2014/03/10 Javascript
JS辨别访问浏览器判断是android还是ios系统
2014/08/19 Javascript
JS实现随机乱撞彩色圆球特效的方法
2015/05/05 Javascript
Jquery和angularjs获取check框选中的值的方法汇总
2016/01/17 Javascript
JS+Canvas 实现下雨下雪效果
2016/05/18 Javascript
jQuery插件简单学习实例教程
2016/07/01 Javascript
jquery 实现复选框的全选操作实例代码
2017/01/24 Javascript
js css3实现图片拖拽效果
2017/03/04 Javascript
原生JS实现图片网格式渐显、渐隐效果
2017/06/05 Javascript
解决vue 单文件组件中样式加载问题
2019/04/24 Javascript
vue.js 2.0实现简单分页效果
2019/07/29 Javascript
Python中函数的参数传递与可变长参数介绍
2015/06/30 Python
python开发之字符串string操作方法实例详解
2015/11/12 Python
python pygame模块编写飞机大战
2018/11/20 Python
Django+JS 实现点击头像即可更改头像的方法示例
2018/12/26 Python
Django框架首页和登录页分离操作示例
2019/05/28 Python
Python通过递归获取目录下指定文件代码实例
2019/11/07 Python
python进度条显示之tqmd模块
2020/08/22 Python
python 自定义异常和主动抛出异常(raise)的操作
2020/12/11 Python
后勤人员自我鉴定
2013/10/20 职场文书
安阳殷墟导游词
2015/02/10 职场文书
电气工程师岗位职责
2015/02/12 职场文书
2015年安全月活动总结
2015/03/26 职场文书
2015领导干部廉洁自律工作总结
2015/07/23 职场文书
2016年小学感恩节活动总结
2016/04/01 职场文书
导游词之山东八仙过海景区
2019/11/11 职场文书
SQL Server实现分页方法介绍
2022/03/16 SQL Server