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实现从数组中选出和等于固定值的n个数
Sep 03 Javascript
Javascript 拖拽的一些简单的应用(逐行分析代码,让你轻松了拖拽的原理)
Jan 23 Javascript
jQuery选择器源码解读(四):tokenize方法的Expr.preFilter
Mar 31 Javascript
浅析JavaScript动画
Jun 10 Javascript
简介JavaScript中的setTime()方法的使用
Jun 11 Javascript
JavaScript获取当前运行脚本文件所在目录的方法
Feb 03 Javascript
第十章之巨幕页头缩略图与警告框组件
Apr 25 Javascript
Bootstrap进度条学习使用
Feb 09 Javascript
React组件中的this的具体使用
Feb 28 Javascript
jQuery实现点击自身以外区域关闭弹出层功能完整示例【改进版】
Jul 31 jQuery
聊聊Vue 中 title 的动态修改问题
Jun 11 Javascript
vue实现Excel文件的上传与下载功能的两种方式
Jun 28 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
Trying to clone an uncloneable object of class Imagic的解决方法
2012/01/11 PHP
thinkphp关于简单的权限判定方法
2017/04/03 PHP
ThinkPHP框架实现定时执行任务的两种方法分析
2018/09/04 PHP
php用wangeditor3实现图片上传功能
2019/08/22 PHP
jQuery Autocomplete自动完成插件
2010/07/17 Javascript
基于jquery的动态创建表格的插件
2011/04/05 Javascript
js随机生成网页背景颜色的方法
2015/02/26 Javascript
javascript中call和apply的用法示例分析
2015/04/02 Javascript
jQuery实现带延迟效果的滑动菜单代码
2015/09/02 Javascript
js+html5实现的自由落体运动效果代码
2016/01/28 Javascript
Vue概念及常见命令介绍(1)
2016/12/08 Javascript
JS实现给对象动态添加属性的方法
2017/01/05 Javascript
jQuery Ajax实现跨域请求
2017/01/21 Javascript
JS中cookie的使用及缺点讲解
2017/05/13 Javascript
浅谈在不使用ssr的情况下解决Vue单页面SEO问题(2)
2018/11/08 Javascript
Node.js事件的正确使用方法
2019/04/05 Javascript
jquery.pager.js实现分页效果
2019/07/29 jQuery
JavaScript实现跟随鼠标移动的盒子
2021/01/28 Javascript
Python计算回文数的方法
2015/03/11 Python
python实现排序算法解析
2018/09/08 Python
opencv python统计及绘制直方图的方法
2019/01/21 Python
Python3.4解释器用法简单示例
2019/03/22 Python
Spring实战之使用util:命名空间简化配置操作示例
2019/12/09 Python
如何利用pygame实现简单的五子棋游戏
2019/12/29 Python
python爬虫开发之Beautiful Soup模块从安装到详细使用方法与实例
2020/03/09 Python
Python基于os.environ从windows获取环境变量
2020/06/09 Python
HTML5 本地存储实现购物车功能
2017/09/07 HTML / CSS
教师绩效工资方案
2014/02/01 职场文书
销售人员职业生涯规划范文
2014/03/01 职场文书
公共场所标语
2014/06/30 职场文书
升国旗演讲稿
2014/09/05 职场文书
2014年城管个人工作总结
2014/12/08 职场文书
python 实现两个变量值进行交换的n种操作
2021/06/02 Python
golang特有程序结构入门教程
2021/06/02 Python
django中websocket的具体使用
2022/01/22 Python
HTML CSS 一个标签实现带动画的抖音LOGO
2022/04/26 HTML / CSS