JS中数组Array的用法示例介绍


Posted in Javascript onFebruary 20, 2014

new Array()
new Array(len)
new Array([item0,[item1,[item2,...]]]
使用数组对象的方法:
var objArray=new Array();
objArray.concact([item1[,item2[,....]]]-------------------将参数列表连接到objArray的后面形成一个新的数组并返回,原有数组不受影响。如:var arr=["a","b","c"];
arr.concact("d","e");
将返回包括从"a"到"e"字母元素的数组。而arr本身不受影响。
objArray.join(separator)-----------------以separator指定的字符作为分割符,将数组转换为字符串,当seperator 为逗号时,其作用和toString()相同。
objArray.pop()---------通俗的讲,就是弹出数组的最后一个元素。结合下面的push方法,使得将数组作为栈来使用成为可能。pop方法返回数组最后一个元素的值,并将length属性减1,即返回后立即丢失最后一个元素。
objArray.push([value1[,value2[,....]]])-------------将参数添加到数组的结尾。如:[1,2,3, 4].push("a","b")将得到[1,2,3,4,"a","b"]
objArray.reverse()将数组中的元素反转排列。如:[1,2,3].reverse()将得到[3,2,1],这个操作是在原有数组上经行操作,同时也返回数组本身
objArray.shift()-----------移去数组的第一个元素,并返回这个元素的值。这个方法的性质和pop方法很类似,pop方法是移去最后一个元素。
objArray.slice(start,end)----------- 返回数组对象的一个子集,索引从start开始(包括 start),到end结束(不包括end),原有数组不受影响。如:[1,2,3,4,5,6].slice(1,4)将得到[2,3,4]。当 start或者end为负数时,则使用他们加上length后地值。如:[1,2,3,4,5,6].slice(-4,-1)将得到[3,4,5]。如果end小于等于start,将返回空数组。
objArray.sort(comparefn)------- 根据comparefn定义的大小比较函数,对一个数组进行排序。函数comparefn必须接受两个参数element1,element2,如果需要需要element1排在element2之前,应该返回一个负数;如果需要element1排在element2之后,应该返回一个正数,如果两个数平等对待(即保持原有顺序)则返回0。当省略comparefn时,则元素按照字典顺序排列。如:对定义的比较函数cmp: function cmp(e1,e2){return e1-e2;}则[3,4,2,7].sort(cmp)将得到[2,3,4,7].
objArray.splice(start,deleteCount[,item1,item2[,...]]]) 这是一个复杂的函数,用于完成数组元素的删除 取代和插入操作。其中,start参数表示要进行操作的索引位置,deleteCount指从start开始要删除的元素的元素个数(包括了start位置),如果deleteCount省略,则表示从start开始要删除数组的剩余部分。[,item1[,item2[,...]]]则表示可选的插入到start之前的元素列表。如:
var arr=[0,1,2,3,4,5,6];
arr.splice(1,1);
document.write(arr);//显示“0,2,3,4,5,6”
arr=[0,1,2,3,4,5,6];
arr.splice(0,0,"a","b");
document.write(arr);//显示“a,b,0,1,2,3,4,5,6"
arr=[0,1,2,3,4,5,6];
arr.splice(3,2,"c","d");
document.write(arr);//显示"0,1,2,c,d,5,6"
objArray.unshift(item1[,item2[,...]]])------------------- 将参数列表插入到数组的开头。其性质和push方法类型,但push方法是将元素添加到数组的结尾。如: [1,2,3,4].unshift("a","b")将得到["a","b",1,2,3,4]。

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 相关文章推荐
Web前端设计模式  制作漂亮的弹出层
Oct 29 Javascript
一个不错的仿携程自定义数据下拉选择select
Sep 01 Javascript
20条学习javascript的编程规范的建议
Nov 28 Javascript
JavaScript自定义等待wait函数实例分析
Mar 23 Javascript
jQuery easyui的validatebox校验规则扩展及easyui校验框validatebox用法
Jan 18 Javascript
Angular路由简单学习
Dec 26 Javascript
自定义vue全局组件use使用、vuex的使用详解
Jun 14 Javascript
js使用ajax传值给后台,后台返回字符串处理方法
Aug 08 Javascript
vue 实现小程序或商品秒杀倒计时
Apr 14 Javascript
微信小程序日历弹窗选择器代码实例
May 09 Javascript
使用konva和vue-konva库实现拖拽滑块验证功能
Apr 27 Javascript
Javascript中的解构赋值语法详解
Apr 02 Javascript
javascript的回调函数应用示例
Feb 20 #Javascript
JS的get和set使用示例
Feb 20 #Javascript
jQuery避免$符和其他JS库冲突的方法对比
Feb 20 #Javascript
JS 删除字符串最后一个字符的实现代码
Feb 20 #Javascript
js确认删除对话框效果的示例代码
Feb 20 #Javascript
多种方法实现load加载完成后把图片一次性显示出来
Feb 19 #Javascript
jquery无刷新验证邮箱地址实现实例
Feb 19 #Javascript
You might like
3种方法轻松处理php开发中emoji表情的问题
2016/07/18 PHP
PHP 实现文件压缩解压操作的方法
2019/06/14 PHP
PHP使用反向Ajax技术实现在线客服系统详解
2019/07/01 PHP
js实现的跟随鼠标移动的时钟效果(中英文日期显示)
2011/01/17 Javascript
用jquery中插件dialog实现弹框效果实例代码
2013/11/15 Javascript
jquery的attr方法禁用表单元素禁用输入内容
2014/06/23 Javascript
如何在node的express中使用socket.io
2014/12/15 Javascript
JavaScript+html5 canvas绘制的小人效果
2016/01/27 Javascript
ES6新特性之解构、参数、模块和记号用法示例
2017/04/01 Javascript
vue 将页面公用的头部组件化的方法
2017/12/18 Javascript
Vue 实现登录界面验证码功能
2020/01/03 Javascript
vscode调试node.js的实现方法
2020/03/22 Javascript
js根据后缀判断文件文件类型的代码
2020/05/09 Javascript
jQuery实现视频展示效果
2020/05/30 jQuery
antd配置config-overrides.js文件的操作
2020/10/31 Javascript
详解Vue2的diff算法
2021/01/06 Vue.js
python实现得到一个给定类的虚函数
2014/09/28 Python
详细介绍Ruby中的正则表达式
2015/04/10 Python
Python实时获取cmd的输出
2015/12/13 Python
浅谈Python处理PDF的方法
2017/11/10 Python
python3利用Dlib19.7实现人脸68个特征点标定
2018/02/26 Python
Python微信操控itchat的方法
2019/05/31 Python
Python使用百度api做人脸对比的方法
2019/08/28 Python
python实现计算器功能
2019/10/31 Python
Django如何使用redis作为缓存
2020/05/21 Python
Pycharm的Available Packages为空的解决方法
2020/09/18 Python
Python利用socket模块开发简单的端口扫描工具的实现
2021/01/27 Python
iframe在移动端的缩放的示例代码
2018/10/12 HTML / CSS
Pop In A Box英国:Funko POP搪胶公仔
2019/05/27 全球购物
大学毕业通用个人的求职信
2013/12/08 职场文书
高中生评语大全
2014/04/25 职场文书
2014年学生会工作总结范文
2014/11/07 职场文书
党支部意见范文
2015/06/02 职场文书
世界文化遗产导游词
2019/08/07 职场文书
python脚本框架webpy的url映射详解
2021/11/20 Python
Redis超详细讲解高可用主从复制基础与哨兵模式方案
2022/04/07 Redis