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 相关文章推荐
js 单引号 传递方法
Jun 22 Javascript
JavaScript包装对象使用介绍
Aug 29 Javascript
JavaScript更改字符串的大小写
May 07 Javascript
jQuery构造函数init参数分析
May 13 Javascript
JavaScript tab选项卡插件实例代码
Feb 23 Javascript
js实现带农历和八字等信息的日历特效
May 16 Javascript
js中获取jsp表单中radio类型的值简单实例
Aug 15 Javascript
vue-router路由简单案例介绍
Feb 21 Javascript
微信小程序 检查接口状态实例详解
Jun 23 Javascript
使用vue-cli创建项目的图文教程(新手入门篇)
May 02 Javascript
微信小程序自定义组件封装及父子间组件传值的方法
Aug 28 Javascript
JS闭包原理及其使用场景解析
Dec 03 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高级OOP技术演示
2009/08/27 PHP
php strcmp使用说明
2010/04/22 PHP
php中static静态变量的使用方法详解
2010/06/04 PHP
解析thinkphp import 文件内容变量失效的问题
2013/06/20 PHP
开源php中文分词系统SCWS安装和使用实例
2014/04/11 PHP
编写PHP脚本使WordPress的主题支持Widget侧边栏
2015/12/14 PHP
PHP MYSQL简易交互式站点开发
2016/12/27 PHP
php+laravel依赖注入知识点总结
2019/11/04 PHP
javascript实现的鼠标链接提示效果生成器代码
2007/06/28 Javascript
尝试在让script的type属性等于text/html
2013/01/15 Javascript
jquery获取焦点和失去焦点事件代码
2013/04/21 Javascript
页面载入结束自动调用js函数示例
2013/09/23 Javascript
jQuery鼠标事件总结
2016/10/13 Javascript
JS用斜率判断鼠标进入DIV四个方向的方法
2016/11/07 Javascript
微信小程序中实现一对多发消息详解及实例代码
2017/02/14 Javascript
JavaScrpt的面向对象全面解析
2017/05/09 Javascript
利用node.js制作命令行工具方法教程(一)
2017/06/22 Javascript
微信小程序开发教程之增加mixin扩展
2017/08/09 Javascript
webpack4 入门最简单的例子介绍
2018/09/05 Javascript
vue实现条件判断动态绑定样式的方法
2018/09/29 Javascript
node.js中express模块创建服务器和http模块客户端发请求
2019/03/06 Javascript
vueScroll实现移动端下拉刷新、上拉加载
2019/03/22 Javascript
使用webpack搭建vue项目及注意事项
2019/06/10 Javascript
vue 实现把路由单独分离出来
2020/08/13 Javascript
Python中的yield浅析
2014/06/16 Python
详解Python3中的Sequence type的使用
2015/08/01 Python
Python产生Gnuplot绘图数据的方法
2018/11/09 Python
Python稀疏矩阵及参数保存代码实现
2020/04/18 Python
Python常用类型转换实现代码实例
2020/07/28 Python
详解Scrapy Redis入门实战
2020/11/18 Python
Yankee Candle官网:美国最畅销蜡烛品牌之一
2020/01/05 全球购物
计算机大学生职业生涯规划书范文
2014/02/19 职场文书
2014年医院党建工作总结
2014/12/20 职场文书
运动会三级跳加油稿
2015/07/21 职场文书
2015国庆节66周年标语
2015/07/30 职场文书
使用python绘制分组对比柱状图
2022/04/21 Python