日期:2014-05-16  浏览次数:20493 次

JavaScript中的Array的创建方式和Array与Map的应用
一直以来对JavaScript中创建数组有几种方式,每种创建方式的区别,JavaScript中map的创建方式及其使用认识的不是很清楚,还好利用周末自己看了点资料并写了几个小例子,以此来加深自己对JS中的Array和Map的认识,以后在项目中遇到就可以完全知晓了。

直接点,上代码!代码比较简单,并且代码中加有注释,希望能够帮助加深理解。

说明:array.html中是Array创建及使用的例子,array-map.html中是map与array间关系及其间转化的例子

array.html文件:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>Array 测试</title>
		<script language="JavaScript1.2">
			//1.定义一个初始容量为0的数组(数组中没有任何元素)
			document.write("-------------------------------"+'<br/>');
			var myarray = new Array();
			document.write("new Array()方式初始的数组的初始容量为:"+myarray.length+"<br/>");
			myarray[0]="new Array() 1";
			myarray[1]="new Array() 2";
			myarray.push("new Array() 3","new Array() 4");
			for(var i=0;i<myarray.length;i++){
				document.write(myarray[i]+'<br/>');
			}
			document.write("-------------------------------"+'<br/>');
		///////////////////////////////////////////////////////////////////////
		//2.定义数组时,指定初始化数组的大小(数组中没有任何元素)
		//此处定义的arry1数组的大小是3,但我们可以向其添加
		//任意多的元素(此例中,arry1数组的元素个数是8)
		var arry1 = new Array(3);//定义一个初始容量为3的数组
		document.write("new Array(3)方式初始的数组的初始容量为:"+arry1.length+"<br/>");
		arry1[0]="array1";		
		arry1[1]="array2";		
		arry1[2]="array3";
		arry1[3]="array4";
		arry1[4]="array5";
		//向arry1数组的末尾添加一个元素,并返回数组arry1的新的长度
		arry1.push("array6");
		//可以通过push向arry1数组中一次添加多个数组元素
		arry1.push("array7","array8");
		for(var x in arry1){
			document.write(arry1[x]+'<br/>');
		}	
		document.write("arry1.length="+arry1.length+"<br/>");
		//3.定义数组时,并为数组赋初值(数组大小等于初始值的个数)
		document.write("-----------------------------");
		var arraytest = new Array("arraytest1","arraytest2","arraytest3");
		document.write("new Array(arraytest1,arraytest2,arraytest3)方式初始的数组的初始容量为:"+arraytest.length+"<br/>");
		arraytest[3]="arraytest4";
		//向arry1数组的末尾添加一个元素,并返回数组arry1的新的长度
		arraytest.push("arraytest5");
		//可以通过push向arry1数组中一次添加多个数组元素
		arraytest.push("arraytest6","arraytest7");
		for(var x in arraytest){
			document.write(arraytest[x]+'<br/>');
		}
		document.write("------------不使用new 关键字创建数组-----------------"+"<br/>");
		//4.不使用new 关键字定义数组的方式
		var x=[];
		document.write("var x=[];方式创建的数组的初始容量为:"+x.length+"<br/>");
		x.push("中国人","美国人","日本人");
		for(var key in x){
			document.write(x[key]+'<br/>');
		}
		var y=[45,67,89,890];
		document.write("var y=[45,67,89,890];方式创建的数组的初始容量为:"+y.length+"<br/>");
		for(var key in y){
			document.write(y[key]+'<br/>');
		}
		//总结:无论通过哪种方式创建的数组,你可以添加任意多的值,就像你可以定义你需要的任意多的变量一样。
		//注意:如果你需要在数组内指定数值或者逻辑值,那么变量类型应该是数值变量或者布尔变量,而不是字符变量。
			document.write("-------------数组中的元素是数值-------------"+'<br/>');
			var arrayInts= new Array(1,2,3,4,5,6,7);
			for(var x in arraytest){
			document.write(arrayInts[x]+'<br/>');
		}
			document.write("-------------数组中的元素是逻辑值-------------"+'<br/>');
			var arrayBooleans= new Array(true,false,true,false);
			for(var x in arrayBooleans){
			document.write(arrayBooleans[x]+'<br/>');
		}
			
		
		</script>
	</head>
	<body>
	</body>
</html>


array-map.html文件:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>Array作Map使用方式</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <script language="JavaScript1.2">
    	//map1
    	var map1={};
		map1['张三']="028-77777";
		map1['李四']="0532-000000";
		map1['王五']="0816-909090";
		document.write("map1['李四']="+map1['李四']+"<br/>");
		//清空map1中的所有键和值
		map1={};
		document.write("map1['李四']="+map1['李四']+"<br/>");
		//map2
		document.write("-------------