实例讲解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 相关文章推荐
写了一个layout,拖动条连贯,内容区可为iframe
Aug 19 Javascript
javascript中的delete使用详解
Apr 11 Javascript
JavaScript事件委托技术实例分析
Feb 06 Javascript
JS+CSS实现精美的二级导航效果代码
Sep 17 Javascript
JavaScript获取各大浏览器信息图示
Nov 20 Javascript
通过Ajax使用FormData对象无刷新上传文件方法
Dec 08 Javascript
js中数组插入、删除元素操作的方法
Feb 15 Javascript
单行 JS 实现移动端金钱格式的输入规则
May 22 Javascript
JavaScript中Require调用js的实例分享
Oct 27 Javascript
Node.js上传文件功能之服务端如何获取文件上传进度
Feb 05 Javascript
解决vue页面DOM操作不生效的问题
Mar 17 Javascript
一个Vue视频媒体多段裁剪组件的实现示例
Aug 09 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
实战mysql导出中文乱码及phpmyadmin导入中文乱码的解决方法
2010/06/11 PHP
浅析PHP 中move_uploaded_file 上传中文文件名失败
2019/04/17 PHP
一段利用WSH修改和查看IP配置的代码
2008/05/11 Javascript
Jquery实战_读书笔记1—选择jQuery
2010/01/22 Javascript
jQuery源码分析-03构造jQuery对象-工具函数
2011/11/14 Javascript
javascript创建和存储cookie示例
2014/01/07 Javascript
jquery的live使用注意事项
2014/02/18 Javascript
js限制文本框只能输入数字方法小结
2014/06/16 Javascript
Express.JS使用详解
2014/07/17 Javascript
jquery实现简单实用的打分程序实例
2015/07/23 Javascript
js实现将选中内容分享到新浪或腾讯微博
2015/12/16 Javascript
node模块机制与异步处理详解
2016/03/13 Javascript
JS函数的定义与调用方法推荐
2016/05/12 Javascript
前端构建工具之gulp的配置与搭建详解
2017/06/12 Javascript
vue2.0全局组件之pdf详解
2017/06/26 Javascript
vue自定义指令实现仅支持输入数字和浮点型的示例
2019/10/30 Javascript
vue 实现用户登录方式的切换功能
2020/04/14 Javascript
javascript全局自定义鼠标右键菜单
2020/12/08 Javascript
Python ORM框架SQLAlchemy学习笔记之映射类使用实例和Session会话介绍
2014/06/10 Python
python实现在图片上画特定大小角度矩形框
2018/10/24 Python
python字典改变value值方法总结
2019/06/21 Python
Python测试线程应用程序过程解析
2019/12/31 Python
pycharm如何使用anaconda中的各种包(操作步骤)
2020/07/31 Python
python压包的概念及实例详解
2021/02/17 Python
迪梵英国官方网站:Darphin英国
2017/12/06 全球购物
澳大利亚小众服装品牌:Maurie & Eve
2018/03/27 全球购物
中国领先的汽车保养服务平台:途虎养车
2019/10/18 全球购物
娇韵诗香港官网:Clarins香港
2020/08/13 全球购物
银行员工职业规划范文
2014/01/21 职场文书
企业申诉管理制度
2014/01/30 职场文书
幼儿园英语教学反思
2014/01/30 职场文书
中秋节礼品促销方案
2014/02/02 职场文书
给校长的一封建议书
2014/03/12 职场文书
大学竞选班长演讲稿
2014/04/24 职场文书
学雷锋标兵事迹材料
2014/08/18 职场文书
2016年端午节红领巾广播稿
2015/12/18 职场文书