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中用字面量创建对象介绍
Dec 31 Javascript
js获取鼠标点击的对象,点击另一个按钮删除该对象的实现代码
May 13 Javascript
浅谈javascript中的 “ &amp;&amp; ” 和 “ || ”
Feb 02 Javascript
Vue.js基础学习之class与样式绑定
Mar 20 Javascript
Vue.js实战之使用Vuex + axios发送请求详解
Apr 04 Javascript
jQuery Validate 校验多个相同name的方法
May 18 jQuery
jQuery Ajax 实现分页 kkpager插件实例代码
Aug 10 jQuery
AngularJS中控制器函数的定义与使用方法示例
Oct 10 Javascript
浅谈JavaScript的innerWidth与innerHeight
Oct 12 Javascript
完美解决手机浏览器顶部下拉出现网页源或刷新的问题
Nov 30 Javascript
JS实现简易留言板(节点操作)
Mar 16 Javascript
解决vue props传Array/Object类型值,子组件报错的情况
Nov 07 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/12/23 PHP
php 将字符串按大写字母分隔成字符串数组
2010/04/30 PHP
PHP同时连接多个mysql数据库示例代码
2014/03/17 PHP
PHP函数func_num_args用法实例分析
2015/12/07 PHP
Laravel实现构造函数自动依赖注入的方法
2016/03/16 PHP
详解PHP函数 strip_tags 处理字符串缺陷bug
2017/06/11 PHP
node.js中的fs.lchmodSync方法使用说明
2014/12/16 Javascript
jQuery中:disabled选择器用法实例
2015/01/04 Javascript
JavaScript实现单击下拉框选择直接跳转页面的方法
2015/07/02 Javascript
BootStrap3学习笔记(一)之网格系统
2016/05/20 Javascript
使用递归遍历对象获得value值的实现方法
2016/06/14 Javascript
每个程序员都需要学习 JavaScript 的7个理由小结
2016/09/03 Javascript
JavaScript 判断一个对象{}是否为空对象的简单方法
2016/10/09 Javascript
判断数组的最佳方法(推荐)
2016/10/11 Javascript
html判断当前页面是否在iframe中的实例
2016/11/30 Javascript
基于vue.js实现图片轮播效果
2016/12/01 Javascript
获取当前月(季度/年)的最后一天(set相关操作及应用)
2016/12/27 Javascript
JavaScript门道之标准库
2018/05/26 Javascript
jquery 动态遍历select 赋值的实例
2018/09/12 jQuery
vue将毫秒数转化为正常日期格式的实例
2018/09/16 Javascript
JS使用数组实现的队列功能示例
2019/03/04 Javascript
Vue数组响应式操作及高阶函数使用代码详解
2020/08/01 Javascript
Python中使用md5sum检查目录中相同文件代码分享
2015/02/02 Python
Python解析命令行读取参数--argparse模块使用方法
2018/01/23 Python
python使用 zip 同时迭代多个序列示例
2019/07/06 Python
Python中的 sort 和 sorted的用法与区别
2019/08/10 Python
django商品分类及商品数据建模实例详解
2020/01/03 Python
15个Pythonic的代码示例(值得收藏)
2020/10/29 Python
亚洲在线旅行门户网站:Expedia.com.hk(智游网)
2020/04/14 全球购物
Java编程面试题
2016/04/04 面试题
广告学专业推荐信范文
2013/11/23 职场文书
致百米运动员广播稿
2014/01/29 职场文书
《最后的姿势》教学反思
2014/02/27 职场文书
2015年春节标语口号
2014/12/09 职场文书
科学家研发出新型速效酶,可在 24 小时内降解塑料制品
2022/04/29 数码科技
Android studio 简单计算器的编写
2022/05/20 Java/Android