码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript数组对象的声明与使用

时间:2015-11-11 22:30:44      阅读:286      评论:0      收藏:0      [点我收藏+]

标签:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>数组对象的声明与使用</title>
</head>
<body>
<script type="text/javascript">
	document.write(‘<h2>数组对象的声明</h2>‘);
	var arr1 = new Array();	// 声明一个空的数组对象
	document.write(arr1.length + ‘<br />‘);	// 0

	var arr2 = new Array(5);	// 声明一个有五个单元的数组,但是这五个单元的值都为 undefined
	document.write(arr2.length + ‘<br/>‘);	// 5
	document.write(arr2[1] + ‘<br/>‘);	// undefined

	var arr3 = new Array(10,20,30,40,50);	// 声明有五个单元的数组,这五个单元的值分别为 10,20,30,40,50
	document.write(arr3.length + ‘<br/>‘);	// 5
	document.write(arr3 + ‘<br/>‘);	// 10,20,30,40,50

	// 快速创建数组
	var arr4 = [];	// 声明一个空数组,效果同 arr1
	document.write(arr1.length + ‘<br />‘);	// 0

	var arr5 = [10,20,30,40,50];	// 声明有五个单元的数组,这五个单元的值分别为 10,20,30,40,50 (效果同arr3)
	document.write(arr3.length + ‘<br/>‘);	// 5
	document.write(arr3 + ‘<br/>‘);	// 10,20,30,40,50

	document.write(‘<h2>数组对象的使用</h2>‘);
	// 输出数组
	document.write(arr3 + ‘<br/>‘);	// 直接输出为字符串形式 10,20,30,40,50
	// 使用for循环遍历数组
	for(var i=0;i<arr3.length;i++){
		document.write(arr3[i]+‘,‘);
	}	// 最终结果为:10,20,30,40,50,

	// 使用 for in 遍历,缺点:会输出数组对象的属性
	for(var i in arr3){
		document.write(arr3[i] + ‘,‘);
	}	// 最终结果为:10,20,30,40,50,

	document.write(‘<br/>‘);

	// 使用函数输出
	document.write(arr3.toString() +‘<br/>‘);	// 10,20,30,40,50  document.write(arr3)会自动调用toString()方法
	// 指定分隔符输出,默认是以 , 为分隔符的
	document.write(arr3.join(‘#‘) + ‘<br/>‘);		// 10#20#30#40#50

	// 往数组中添加元素
	arr1[0] = 1;	// 直接添加第 0 个元素
	document.write(arr1.length + ‘<br/>‘);	// 1
	// 注意:
	arr1[10] = 10;
	document.write(arr1.length + ‘<br/>‘);	// 11 数组长度为11的原因是:javascript中数组下标必须为数字且必须从0开始并连续
	document.write(typeof(arr1[5]) + ‘<br/>‘);	// undefined ,自动填充的值的类型为 undefined 类型

	//自动追加为连续的下标
	arr1[arr1.length] = 11;	// 当前数组的长度的值就是下一个数组单元的下标
	document.write(arr1[11] + ‘<br/>‘);	// 11

	// 使用方法往数组最后添加单元
	document.write(arr1.push(‘张三‘) + ‘<br/>‘);	// 返回 13 ,即返回当前数组的长度
	document.write(arr1.length + ‘<br/>‘);	// 13
	// 使用方法往数组开头添加单元
	document.write(arr1.unshift(‘这是添加到开头的单元‘) + ‘<br/>‘);	// 14 ,也是返回当前数组的长度
	document.write(arr1 + ‘<br/>‘);	// 这是添加到开头的单元,1,,,,,,,,,,10,11,张三  中间没有值的是自动填充的

	// 删除数组单元
	// 从数组最后删除一个单元
	document.write(arr1.pop() + ‘<br/>‘);	// 张三 ,这是返回的删除的单元值
	document.write(arr1 + ‘<br/>‘);	// 这是添加到开头的单元,1,,,,,,,,,,10,11
	// 从数组开头删除一个单元
	document.write(arr1.shift() + ‘<br/>‘);	// 这是添加到开头的单元 , 这个也是返回的删除的单元值
	document.write(arr1 + ‘<br/>‘);	// 1,,,,,,,,,,10,11
	// 注:以上两个删除的方法不能删除数组内部的其他值

	// 替换/删除指定元素 Array().splice(index,howmany,item1,.....,itemX)
	arr1.splice(0,1);	// index--0  howmany--1 从第0个元素开始,删除1个元素
	document.write(arr1 + ‘<br/>‘); // ,,,,,,,,,10,11
	arr1.splice(0,9);
	document.write(arr1 + ‘<br/>‘); // 10,11
	// 以上只有两个参数,可以理解为删除操作
	// 以下是替换操作
	arr1.splice(0,1,0);	// index--0 howmany--1 item1--0 从第0个元素开始,替换一个元素,替换的值为0
	document.write(arr1+‘<br/>‘);	// 0,11
	arr1.splice(1,5,1,2,3,4,5);
	document.write(arr1+‘<br/>‘);	// 0,1,2,3,4,5

	// 连接两个数组 Array().concat(arrayX,arrayX,......,arrayX)
	var arr4 = arr1.concat(arr3);
	document.write(arr4 + ‘<br/>‘);	// 0,1,2,3,4,5,10,20,30,40,50

	// 数组排序 sort
	arr4[arr4.length] = 15;
	arr4[arr4.length] = 22;
	document.write(arr4 + ‘<br/>‘);	// 0,1,2,3,4,5,10,20,30,40,50,15,22 这是默认输出的结果
	arr4.sort();
	document.write(arr4 + ‘<br/>‘);	// 0,1,10,15,2,20,22,3,30,4,40,5,50 这是默认排序后的结果,基于ascii排序
	// 以升序排列
	arr4.sort(function(a,b){
		return a-b;
	});
	document.write(arr4 + ‘<br/>‘);	// 0,1,2,3,4,5,10,15,20,22,30,40,50
	// 以降序排列
	arr4.sort(function(a,b){
		return b-a;
	});
	document.write(arr4 + ‘<br/>‘);	// 50,40,30,22,20,15,10,5,4,3,2,1,0

	// 直接反转数组
	document.write(arr4.reverse() + ‘<br/>‘);	// 0,1,2,3,4,5,10,15,20,22,30,40,50

	// 其他说明
	// 可以使用 push 和 pop 模拟栈的结构
	// 可以使用 unshift 和 shift 模拟队列的结构
</script>
</body>
</html>



JavaScript数组对象的声明与使用

标签:

原文地址:http://my.oschina.net/mpf/blog/529109

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!