javascript学习笔记(五) Array 数组类型介绍


Posted in Javascript onJune 19, 2012

数组的创建
第一种:

var colors = new Array(); 
var colors = new Array(20);//创建包含20项的数组 
var colors = new Array("Greg");//创建包含1项,即字符串"Greg"的数组 
var colors = new Array("red","blue","green"); //创建包含3项

第二种:
var colors = ["red","blue","green"]; 
var colors = [];//创建一个空数组

注意:数组的索引是从0开始的

1. length属性
length属性中保存数组的项数,如:

var colors = ["red","blue","green"]; 
alert(colors.length); //3

length属性不是只读的,可以利用length属性在数组的末尾移除项,或者添加新的项,如:
var colors = ["red","blue","green"]; 
colors.length = 2; 
alert(colors); //red,blue 
colors[colors.length] = "black"; 
alert(colors); //red,blue,black

2.join()方法,连接数组中的项
var colors = ["red","blue","green"]; 
alert(colors.join(",")); //red,blue,green 
alert(colors.join("||")); //red||blue||green

3.数组的栈方法:push()和pop()
push()方法 可以接受任意数量的参数把它们逐个添加的数组的末尾,并返回修改后数组的长度
pop()方法 从数组末尾移除最后一项,减少数组的length值,返回移除的项
var colors = new Arrary(); //创建一个数组 
var count = colors.push("red","green"); //推入两项到数组末尾 
alert(count); //2 
count = colors.push("black"); //推入一项到数组末尾 
alert(count); //3 
var item = colors.pop(); //移除最后一项并返回该值 
alert(item); //"black" 
alert(count); //2

4.数组的队列方法:push()和shift()、unshift()
push()方法同上
shift()方法 移除数组中的第一项并返回该项,数组长度减1
unshift()方法 在数组前端添加任意项,并返回新数组的长度
var colors = new Arrary(); //创建一个数组 
var count = colors.push("red","green"); //推入两项到数组末尾 
alert(count); //2 
count = colors.push("black"); //推入一项到数组末尾 
alert(count); //3 
var item = colors.shift(); //移除第一项并返回该值 
alert(item); //"red" 
alert(colors); //green,black 
count = colors.unshift("blue"); //推入一项到数组前端 
alert(count); //3 
alert(colors); //blue,green,black

5.重排序方法:reverse()和sort()
reverse()方法 反转数组项的顺序
sort()方法 默认按字符串大小升序排列数组项,可以接受一个比较大小的函数作为参数
var values = [1,2,3,4,5]; 
values.reverse(); 
alert(values); //5,4,3,2,1

//升序排序函数 
function compare(value1,value2) { 
if (value1 < value2) { 
return -1; //降序改为1 
} else if (value1 > value2) { 
return 1; //降序改为-1 
} else { 
return 0; 
} 
}

//数组升序排列 
var values = [0,1,5,15,20,10]; 
values.sort(compare); 
alert(values);//0,1,5,10,15,20

//对于数值型可以用这个函数,升序 
function compare(value1,value2) { 
return value2 - value1; 
}

6.数组的一些方法:concat()方法、slice()方法和splice()方法
concat()方法 将参数添加到原数组末尾,返回新的数组,原数组不变
slice()方法 返回数组中的项,一个参数时返回指定位置到数组末尾所有的项,两个参数时返回起始位置和结束位置之间的项(不包括结束位置),原数组不变
splice()方法 向数组中插入,删除,或替换数组中的项,返回删除的项(没有删除时返回空数组),原数组改变
//concat()方法 
var colors = ["red","green","blue"]; 
var colors2 = colors.concat("yellow",["black","brown"]); 
alert(colors); //red,green,blue 
alert(colors2); //red,green,blue,yellow,black,brown

//slice()方法 
var colors = ["red","green","blue","yellow","black"]; 
var colors2 = colors.slice(1); //一个参数时返回指定位置到数组末尾所有的项 
var colors3 = colors.slice(1,4); //两个参数时返回起始位置和结束位置之间的项(不包括结束位置) 
alert(colors2); //green,blue,yellow,black 
alert(colors3); //green,,blue,yellow

//splice()方法 
//插入项,插入时指定3个参数:起始位置、0(要删除的项)、要插入的项 
var colors = ["red","green","blue"]; 
var inserted = colors.splice(1,0,"yellow","orange"); //从位置1开始插入两项 
alert(colors); //red,yellow,orange,green,blue 
alert(inserted); //空数组 //替换项,删除时指定3个参数:起始位置、要删除的项、要插入的任意项 
var colors = ["red","green","blue"]; 
var replaced = colors.splice(1,1,"black","brown"); //删除一项,插入两项 
alert(colors); //red,black,browm,blue 
alert(replaced); //green
Javascript 相关文章推荐
Javascript常考语句107条收集
Mar 09 Javascript
script标签的 charset 属性使用说明
Dec 04 Javascript
浏览器的JavaScript引擎的识别方法
Oct 20 Javascript
js取消单选按钮选中并判断对象是否为空
Nov 14 Javascript
jQuery实现鼠标经过图片预览大图效果
Apr 10 Javascript
jquery使用jxl插件导出excel示例
Apr 14 Javascript
JavaScript输出当前时间Unix时间戳的方法
Apr 06 Javascript
JQuery radio(单选按钮)操作方法汇总
Apr 15 Javascript
基于Vuejs框架实现翻页组件
Jun 29 Javascript
bootstrap paginator分页插件的两种使用方式实例详解
Nov 14 Javascript
vue 实现的树形菜的实例代码
Mar 19 Javascript
vue 1.0 结合animate.css定义动画效果
Jul 11 Javascript
javascript学习笔记(四) Number 数字类型
Jun 19 #Javascript
javascript学习笔记(三) String 字符串类型介绍
Jun 19 #Javascript
javascript学习笔记(二) js一些基本概念
Jun 18 #Javascript
javascript学习笔记(一) 在html中使用javascript
Jun 18 #Javascript
到处都是jQuery选择器的年代 不了解它们的性能,行吗
Jun 18 #Javascript
jquery图片延迟加载 前端开发技能必备系列
Jun 18 #Javascript
jquery不会自动回收xmlHttpRequest对象 导致了内存溢出
Jun 18 #Javascript
You might like
PHP默认安装产生系统漏洞
2006/10/09 PHP
PHP静态类
2006/11/25 PHP
PHP无限分类代码,支持数组格式化、直接输出菜单两种方式
2011/05/18 PHP
php和mysql中uft-8中文编码乱码的几种解决办法
2012/04/19 PHP
深入解析PHP中逗号与点号的区别
2013/08/05 PHP
thinkphp模板输出技巧汇总
2014/11/24 PHP
TP5框架实现的数据库备份功能示例
2020/04/05 PHP
javascript textarea光标定位方法(兼容IE和FF)
2011/03/12 Javascript
40个新鲜出炉的jQuery 插件和免费教程[上]
2012/07/24 Javascript
生成二维码方法汇总
2014/12/26 Javascript
js获取会话框prompt的返回值的方法
2015/01/10 Javascript
jQuery自定义图片缩放拖拽插件imageQ实现方法(附demo源码下载)
2016/05/27 Javascript
Vuejs第一篇之入门教程详解(单向绑定、双向绑定、列表渲染、响应函数)
2016/09/09 Javascript
Vue自定义指令拖拽功能示例
2017/02/17 Javascript
javascript完美实现给定日期返回上月日期的方法
2017/06/15 Javascript
vuex 使用文档小结篇
2018/01/11 Javascript
vue cli升级webapck4总结
2018/04/04 Javascript
小程序视频列表中视频的播放与停止的示例代码
2018/07/20 Javascript
Django模板继承 extend标签实例代码详解
2019/05/16 Javascript
vue-devtools的安装和使用步骤详解
2019/10/17 Javascript
如何实现echarts markline标签名显示自己想要的
2020/07/20 Javascript
vue elementui tree 任意级别拖拽功能代码
2020/08/31 Javascript
Python 实现使用dict 创建二维数据、DataFrame
2018/04/13 Python
简单了解Python3里的一些新特性
2019/07/13 Python
python使用原始套接字发送二层包(链路层帧)的方法
2019/07/22 Python
python如何通过pyqt5实现进度条
2020/01/20 Python
纯CSS和jQuery实现的在页面顶部显示的进度条效果2例(仿手机浏览器进度条效果)
2014/04/16 HTML / CSS
美国领先的礼品卡网站:GiftCards.com
2016/11/02 全球购物
Sahajan美国:阿育吠陀护肤品牌
2021/01/09 全球购物
酒店中秋节活动方案
2014/01/31 职场文书
工作过失检讨书
2014/02/23 职场文书
借款协议书
2014/04/12 职场文书
学雷锋标语
2014/06/25 职场文书
初中生300字旷课检讨书
2014/11/19 职场文书
80后创业总结的9条职场用人思想,记得收藏
2019/08/13 职场文书
Redis入门基础常用操作命令整理
2022/06/01 Redis