# 数组的创建、读写和长度

数组的出现就是为了批量处理数据。

# 数组的创建

创建数组有两种方法,一是使用数组字面量,简单来说就是在 [] 之中列出数组的所有元素:

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"]

# 示例

1663779144403

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]

# 示例

1663779604855

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;// 写元素

# 示例

1663804690137

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"]

# 示例

1663805526226

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 = [958026];
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);

# 示例

1663805672579

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*********/
}