# 数组的创建、读写和长度
数组的出现就是为了批量处理数据。
# 数组的创建
创建数组有两种方法,一是使用数组字面量,简单来说就是在 []
之中列出数组的所有元素:
var numberArray = [1,2,3,4,5];// 数字数组 | |
var stringArray = ["java","script","edu","coder"];// 字符串数组 | |
var mixArray = [1,2,"java",true,6.6];// 混合数组 |
如上,各元素之间用,隔开。JavaScript 中数组的元素可以是不同的数据类型,如上面的第三个数组。
创建数组的第二种方法是新建一个 Array
对象的实例,如:
var myArray = new Array();// 创建一个初始为空的数组 | |
var lengthMixArray = new Array(6);// 创建一个长为 6 的数组 |
这种情况下可以设置数组的长度(即数组中元素的个数),也可以不设置。
# 数组元素的读取和写入
数组元素的读取和写入在形式上相似,都是用赋值符号连接的两个表达式。
读取时,存放读入值的变量在左边,数组元素在右边:
var readArray = [1,3,"js",true,2.22]; | |
var read = readArray[0];// 读取第一个元素到变量 read 中 |
写入时,数组元素在左边,待写值在右边:
var writeArray = [1,3,"js",true,2.22]; | |
writeArray[0] = 2;// 在第一个元素的位置写入 2 | |
console.log(writeArray[0]);// 原来的 1 已经被覆盖,输出 2 |
# 数组长度
数组长度指数组中元素的个数,等于最大索引值加 1,数组的 length
属性即数组的长度。
var arrayLength = [1,"js",true]; | |
console.log(arrayLength.length);// 输出 3 |
数组的长度也可以写入,当写入的值小于数组的实际长度时,数组会被删除一部分。大于实际长度时,数组会在尾部添加一些空的区域。
arrayLength.length = 2; | |
console.log(arrayLength);// 输出 [1,"js"] |
# 示例
var array1 = [1,2,3,"js",4,true,"hello"]; | |
var array2 = [true,true,"java",2.1]; | |
function mainJs(a) { | |
// 请在此处编写代码 | |
/********** Begin **********/ | |
a = parseInt(a); | |
if(array1.length == a) { | |
return array1[array1.length-1]; | |
} | |
else { | |
return array2[array2.length-1]; | |
} | |
/********** End **********/ | |
} |
# 数组元素的增减
# 数组元素的增加
在 JavaScript 中,为数组增加元素可以在数组头部(索引最小处)或者尾部进行,可以使用数组的方法或者直接使用运算符。
# 在尾部添加元素
最直观的方法是直接给当前尾部元素的后一个位置赋值。
var numberArray = [12,23,34,45]; | |
numberArray[numberArray.length] = 56; | |
console.log(numberArray);// 输出 [12,23,34,45,56] |
第二种方法是使用 push()
函数往数组的末尾添加一个或多个元素,参数是要添加的元素,返回数组长度。
// 利用 push () 方法在数组尾部添加元素 | |
var numberArray = [12,23,34,45]; | |
var newLength = numberArray.push(56); | |
console.log(newLength);// 输出 5 | |
console.log(numberArray);// 输出 [12,23,34,45,56] |
# 在头部添加元素
unshift()
方法在数组的头部添加元素,并返回数组新的长度,其余元素自动向索引大的方向移动。
var sArray = ["ja","va","script"]; | |
var newLength = sArray.unshift("he","llo"); | |
console.log(newLength)// 输出 5 | |
console.log(sArray);// 输出 ["he","llo","ja","va","script"]; |
# 数组元素的删除
删除也能在数组头部(索引值小)或者尾部进行。
# 在尾部删除元素
直接修改数组长度为更小的值。
var array = [1,2,true,"hello"]; | |
array.length = 3;// 索引最大的元素被删除 | |
console.log(array);// 输出 [1,2,true] |
第二种方法是使用 delete
运算符。 delete
运算符后接要删除的元素,但是删除后,会有一个空占位符,所以数据的长度保持不变。如:
var dArray = [11,22,33,44,55]; | |
delete dArray[4];// 删除索引最大的元素 | |
console.log(dArray);// 输出 [11,22,33,44] | |
console.log(dArray.length); // 长度为 5 |
第三种方法是使用 pop()
,一次删除一个,并返回被删除的元素。
// 利用 pop () 方法在数组尾部删除元素 | |
var numberArray = [3,4,5,6,7]; | |
var deletedNumber = numberArray.pop(); | |
console.log(deletedNumber);// 输出被删除的元素 7 | |
console.log(numberArray);// 删除后的数组为 [3,4,5,6] |
# 在头部删除元素
有 unshift()
,自然有 shift()
, shift()
的作用是删除数组头部一个元素并返回该元素,然后所有元素往索引值小的方向移动一位。
初学者很容易混淆这两个方法,建议记住 shift
单词的意思是:删除,去掉。
var dArray = [11,22,33,44,55]; | |
console.log(dArray.shift());// 输出 11,11 被从数组中删除 | |
console.log(dArray);// 输出 [22,33,44,55] |
# 示例
var testArray = [12,"java","js","c","c++",24,36,"python","c#","css"]; | |
function mainJs(a,b) { | |
a = parseInt(a); | |
b = parseInt(b); | |
// 请在此处编写代码 | |
/********** Begin **********/ | |
for(var i = 0;i < a;i++) { | |
var rearMember = testArray.pop(); | |
testArray.unshift(rearMember); | |
} | |
return testArray[b]; | |
/********** End **********/ | |
} |
# 数组的遍历和多维数组
# 数组的遍历
数组的遍历指按顺序访问你数组的每一个元素。有两种方法:
- 使用 for 循环
// 依次在浏览器的控制台输出 one,two,three,four | |
var stringArray = ["one","two","three","four"]; | |
for(var i=0, sLength=stringArray.length; i < sLength; i++) { | |
console.log(stringArray[i]); | |
} |
- 使用
forEach()
方法forEach()
方法的参数是一个无名字的函数,函数有三个参数,第一个参数是当前的数组元素,第二个参数是当前的索引,第三个参数是数组对象的索引。与 for 循环的区别是无法用 break 中断循环。
var numArr = [10,11,12,13,14]; | |
numArr.forEach(function(mem,i,arr) { | |
mem *= 10; | |
arr[i] = mem; | |
}); | |
console.log(numArr);// 输出 [100,110,120,130,140] |
# 多维数组的实现
多维数组实际上就是数组的数组,指数组的每一个元素也是一个数组,这里仅讨论二维数组。
JavaScript 中二维数组的列的长度不唯一,第一列可以有 4 个元素,第二列可以有 5 个元素,等等。
- 二维数组的创建 创建已知的二维数组:
var multiArr = [[1,2,3,4],[5,6,7],[8,9]]; |
创建仅知道长度的二维数组
// 创建一个 4 行 6 列的二维数组 | |
var muArr = new Array(4); | |
for(var i = 0;i <4;i++) { | |
muArr[i] = new Array(6); | |
} |
- 二维数组的读写 二维数组的读写用
数组名[][]
的方式,第一个中括号内为行数,从 0 计数,第二个中括号内为列数,也从 0 计数。 以上面的数组 multiArr 为例:
var multiArr = [[1,2,3,4],[5,6,7],[8,9]]; | |
console.log(multiArr[1][1]);// 读元素,输出 6 | |
multiArr[0][0] = 0;// 写元素 |
# 示例
var arr = [1,2,3,4,5,6,7,8,9,0,10,11,12,13,14,15,16,17,18,19,20,21,23,22]; | |
function mainJs(a,b) { | |
a = parseInt(a); | |
b = parseInt(b); | |
// 请在此处编写代码 | |
/********** Begin **********/ | |
// 新建二维数组,行长为 a,列长为 b | |
var multiArr = new Array(a); | |
for(var i = 0;i < a;i++) { | |
multiArr[i] = new Array(b); | |
} | |
// 依次将原数组的元素放置在二维数组的相应位置上 | |
var count = 0; | |
for(var i = 0;i < a;i++) {// 先行 | |
for(var j = 0;j < b;j++) {// 后列 | |
multiArr[i][j] = arr[count++]; | |
} | |
} | |
// 返回二维数组 | |
return multiArr; | |
/********** End **********/ | |
} |
# 数组的常用方法
# 查找元素的位置
根据值查找元素的位置,有两个方法: indexOf()
和 lastIndexOf()
,前者从索引小处往大搜索,后者相反。都返回第一次遇到该元素时的索引。
两者都有两个参数,第一个参数为要查找的元素,第二个参数可选,为搜索的起点索引。如:
var search = ["a","b","a","b","c","d","a","a","b","a"]; | |
console.log(search.indexOf("a"));// 输出 0 | |
console.log(search.lastIndexOf("a"));// 输出 9 | |
console.log(search.indexOf("a",2));// 输出 2,从索引为 2 处开始搜索 |
第二个参数可以是负数,-1 表示倒数第一个元素,-2 表示倒数第二个元素,依次类推。如:
var search = ["a","b","a","b"]; | |
console.log(search.indexOf("a",-3));// 输出 2 | |
console.log(search.lastIndexOf("a",-3));// 输出 0 |
# 数组的合并
concat()
实现数组合并,其形式是数组 a.concat(数组b)
,合并之后返回新数组,新数组为数组 a 后面连接数组 b,但是数组 a 和 b 不变。
var a = [1,2,3]; | |
var b = [4,5,6]; | |
var c = a.concat(b);// 合并后返回新数组 | |
console.log(c);// 输出 [1,2,3,4,5,6] |
# 数组倒置
reverse()
实现数组倒置,无参数,返回倒置后的数组,同时调用该方法的数组也会被倒置。称为就地逆置。
var a = [1,2,3,4]; | |
var b = a.reverse(); | |
console.log(a);// 输出 [4,3,2,1] | |
console.log(b);// 输出 [4,3,2,1] |
# 元素合并
join()
将数组的所有元素连接起来组成字符串,参数为元素之间的分隔符,默认逗号
var sArray = ["June","July","August"]; | |
console.log(sArray.join());// 输出 June,July,August | |
console.log(sArray.join("+"));// 输出 June+July+August |
# 元素排序
sort()
实现数据元素排序,不带该参数表示元素按照 ASCII 表从小到大排序(参考 JavaScript 学习手册三)。如:
var stringArray = ["a","ab","b","aa"]; | |
stringArray.sort(); | |
console.log(stringArray);// 输出 ["a","aa","ab","b"] |
需要注意的是数字的排序,例子如下:
var arr = [1,2,10,5,12]; | |
arr.sort(); | |
console.log(arr);// 输出 [1,10,12,2,5]; |
带参数的格式如下:
arr.sort(function(a,b){ | |
return a-b; // 升序排列 | |
}) |
或者:
arr.sort(function(a,b){ | |
return b-a; // 降序排列 | |
}) |
说明:
- arr 是要排序的数组;
- a,b 是两个参数,返回 a-b,升序排列,返回 b-a,降序排列。
对于数字的排序, sort()
带参数和不带参数是不一样的,例子如下:
var arr = [1,2,10,5,12]; | |
arr.sort(); | |
console.log(arr);// 输出 [1,10,12,2,5] | |
arr.sort(function(a,b){ | |
return a-b; | |
}); | |
console.log(arr);// 输出 [1,2,5,10,12] |
# 提取子数组
slice()
返回切割出的子数组,不修改原来的数组。
它有两个整数参数 a 和 b,a 表示切割的起点,该点属于子数组;b 可选,表示切割的终点,该点不属于子数组。
a 和 b 都可以为负数,如 - 1 表示倒数第一个位置,依次类推。
var arr = ["a","b","c","d","e"]; | |
console.log(arr.slice(0,3));//["a","b","c"] | |
console.log(arr.slice(0,-2));//["a","b","c"] | |
console.log(arr.slice(4));//["e"] | |
console.log(arr.slice(-4));//["b","c","d","e"] |
# 示例
function mainJs(myArray) { | |
myArray = myArray.split(","); | |
// 请在此处编写代码 | |
/********** Begin **********/ | |
// 新建用来存储字符串 a 位置的数组 | |
var indexsArrayOfStringa = new Array(); | |
// 新建用来存储字符串 b 位置的数组 | |
var indexsArrayOfStringb = new Array(); | |
// 求出参数字符串的长度 | |
var myArrayLength = myArray.length; | |
var index = 0; | |
// 遍历获得字符串 a 的所有位置 | |
while(index < myArrayLength) { | |
index = myArray.indexOf("a",index); | |
if(index == -1) break; | |
indexsArrayOfStringa.push(index++); | |
} | |
index = 0; | |
// 遍历获得字符串 b 的所有位置 | |
// 这两个函数千万不要合在一起写!!! | |
while(index < myArrayLength) { | |
index = myArray.indexOf("b",index); | |
if(index == -1) break; | |
indexsArrayOfStringb.push(index++); | |
} | |
// 返回两个数组的和数组 | |
return indexsArrayOfStringa.concat(indexsArrayOfStringb); | |
/********** End **********/ | |
} |
# 数组的应用 —— 内排序
# 冒泡排序
// 冒泡排序 | |
var arr = [9,5,8,0,2,6]; | |
var aLength = arr.length; | |
var temp; | |
var flag = 0;// 元素交换的标志位 | |
for(var i = 1;i < aLength;i++) {// 共进行 n-1 次冒泡 | |
flag = 0; | |
for(var j = 0;j < aLength-i;j++) {// 一次冒泡 | |
if(arr[j]>arr[j+1]) {// 交换元素 | |
temp = arr[j]; | |
arr[j] = arr[j+1]; | |
arr[j+1] = temp; | |
flag = 1; | |
} | |
} | |
if(flag == 0) break;// 本次冒泡没有元素交换 | |
} | |
console.log(arr); |
# 选择排序
// 选择排序 | |
var arr = [6,12,3,34,1,56,77,0,2,43]; | |
var aLength = arr.length; | |
var temp; | |
var max = arr[0]; | |
var maxIndex = 0; | |
for(var i = 0;i < aLength-1;i++) {// 共进行 n-1 次选择 | |
for(var j = 1;j < aLength-i;j++) {// 一次选择 | |
if(arr[j] > max) { | |
max = arr[j]; | |
maxIndex = j; | |
} | |
} | |
// 将本次选出的最大元素移动到最终的位置上 | |
temp = arr[aLength-i-1]; | |
arr[aLength-i-1] = arr[maxIndex]; | |
arr[maxIndex] = temp; | |
var max = arr[0]; | |
var maxIndex = 0; | |
} | |
console.log(arr); |
# 示例
function mainJs(a) { | |
var arr = a.split(","); | |
for(var i = 0;i < arr.length;i++) { | |
arr[i] = parseInt(arr[i]); | |
} | |
// 请在此处编写代码 | |
/********** Begin **********/ | |
var aLength = arr.length;// 待排序数组的长度 | |
var temp; | |
var max = arr[0]; | |
var maxIndex = 0; | |
var indexArr = new Array();// 记录最大元素位置的数组 | |
// 进行选择排序 | |
for(var i = 0;i < aLength-1;i++) { | |
for(var j = 1;j < aLength-i;j++) { | |
if(arr[j] > max) {// 更新最大元素及其索引 | |
max = arr[j]; | |
maxIndex = j; | |
} | |
} | |
// 记录最大元素所在的位置 | |
indexArr.push(maxIndex); | |
// 移动最大元素到索引最大处 | |
temp = arr[aLength-i-1]; | |
arr[aLength-i-1] = arr[maxIndex]; | |
arr[maxIndex] = temp; | |
// 将最大元素及位置归零 | |
var max = arr[0]; | |
var maxIndex = 0; | |
} | |
return indexArr; | |
/*********end*********/ | |
} |