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 相关文章推荐
script的async属性以非阻塞的模式加载脚本
Jan 15 Javascript
jQuery对html元素取值与赋值的方法
Nov 20 Javascript
JavaScript数据结构和算法之图和图算法
Feb 11 Javascript
KnockoutJs快速入门教程
May 16 Javascript
jQuery设置和获取select、checkbox、radio的选中值方法
Jan 01 Javascript
JavaScript中数组Array.sort()排序方法详解
Mar 01 Javascript
借助node实战JSONP跨域实例
Mar 30 Javascript
基于vue监听滚动事件实现锚点链接平滑滚动的方法
Jan 17 Javascript
vuejs前后端数据交互之从后端请求数据的实例
Aug 11 Javascript
详解如何构建Promise队列实现异步函数顺序执行
Oct 23 Javascript
vue props 单项数据流实例分享
Feb 16 Javascript
vue自定义组件实现双向绑定
Jan 13 Vue.js
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数据库连接时容易出错的特殊符号问题
2010/09/01 PHP
PHP生成验证码时“图像因其本身有错无法显示”的解决方法
2013/08/07 PHP
PHP中使用CURL模拟登录并获取数据实例
2014/07/01 PHP
php生成gif动画的方法
2015/11/05 PHP
在WordPress中使用wp-cron插件来设置定时任务
2015/12/10 PHP
WordPress中用于检索模版的相关PHP函数使用解析
2015/12/15 PHP
php实现mysql连接池效果实现代码
2018/01/25 PHP
php设计模式之备忘模式分析【星际争霸游戏案例】
2020/03/24 PHP
jquery(live)中File input的change方法只起一次作用的解决办法
2011/10/21 Javascript
JSF中confirm弹出框的用法示例介绍
2014/01/07 Javascript
$(document).ready(function() {})不执行初始化脚本
2014/06/19 Javascript
node.js中的fs.rmdirSync方法使用说明
2014/12/16 Javascript
javascript实现类似超链接的效果
2014/12/26 Javascript
JS实现兼容性好,带缓冲的动感网页右键菜单效果
2015/09/18 Javascript
jquery+CSS3实现3D拖拽相册效果
2016/07/18 Javascript
JS原型链 详解及示例代码
2016/09/06 Javascript
js判断文件格式及大小的简单实例(必看)
2016/10/11 Javascript
JQuery中解决重复动画的方法
2016/10/17 Javascript
Vue cli构建及项目打包以及出现的问题解决
2018/08/27 Javascript
javascript操作元素的常见方法小结
2019/11/13 Javascript
JavaScript forEach中return失效问题解决方案
2020/06/01 Javascript
解决vue里a标签值解析变量,跳转页面,前面加默认域名端口的问题
2020/07/22 Javascript
详解Django之admin组件的使用和源码剖析
2018/05/04 Python
Python寻找两个有序数组的中位数实例详解
2018/12/05 Python
django框架事务处理小结【ORM 事务及raw sql,customize sql 事务处理】
2019/06/27 Python
Html5移动端弹幕动画实现示例代码
2018/08/27 HTML / CSS
英国天然保健品网站:Simply Supplements
2017/03/22 全球购物
Space NK英国站:英国热门美妆网站
2017/12/11 全球购物
大学生求职简历的自我评价
2013/10/21 职场文书
美容院营销方案
2014/03/05 职场文书
跳高加油稿
2015/07/21 职场文书
学前班教学反思
2016/02/24 职场文书
初一语文教学反思
2016/03/03 职场文书
六年级作文之自救
2019/12/19 职场文书
javascript遍历对象的五种方式实例代码
2021/10/24 Javascript
mysql拆分字符串作为查询条件的示例代码
2022/07/07 MySQL