<!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>