JavaScript数组详解-优快云博客

本文链接：https://blog.youkuaiyun.com/diligentkong/article/details/76471906

数组存储一系列同一种数据类型的值。但在JavaScript里，也可以在数组中保存不同类型的值。（最好别这么做，大多数语言没这个能力）

1.创建和初始化数组

var arr = new Array();
var arr = new Array(7);
var arr = new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday");

使用new关键字，能简单地声明并初始化一个数组，还可以构建一个指定长度的数组，也可以直接将数组元素作为参数传递给它的构造器。
使用new创建数组并不是最好的方式，我们可以使用字面量的形式即可。
如下：

var arr =[];
var arr =["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];

可以用数组的length属性，查看数组的长度

console.log(arr.length);//7

可用for循环遍历数组，打印输出所有的元素

for (var i =0;i<arr.length;i++) {
        console.log(arr[i]);
     }

当你想访问数组中特定位置的元素，可以向中括号传递数值。如：arr[2];

2.添加和删除元素

在JavaScript中，数组是一个可以修改的对象。如果添加元素，它就会动态增长。在C和Java等其他语言里，我们要决定数组的大小，想添加元素就要创建一个全新的数组，不能简单地往其中添加所需的元素。
比如有个数组var num = [1,2,3,4,5,6,7];
1. push() JavaScript中的push()方法，能把元素添加到数组的末尾，还可以添加任意个元素。

num.push(8);
num.push(9,10);

如果输入num的话，就会看到1-10的值。

2. pop()方法：要想删除数组中最后的元素，可以用pop()方法

num.pop();

输入num的话，会看到1-9的值。

通过push()和pop()方法，就能用数组来模拟栈。这个稍后讲解栈的知识.

3.****unshift()方法，可以直接把数值插入数组的首位。

num.unshift(0);
num.unshift(-2,-1);

输出结果为 [-2, -1, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
4.shift()方法 ：要想移出数组中的第一个元素，

num.shift();

输出结果为[-1, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

通过shift()和unshift()方法，能用数组模拟的基本的队列数据结构，后续会讲解队列的知识。

3.二维数组和多维数组

JavaScript只支持一维数组，并不支持矩阵(二维数组)。但是，可以使用数组套数组的方式，实现矩阵或任一多维数组。

var num =[];
   num[0]=[11,13,15,17,19];
   num[2]=[12,14,16,18,10];

   num[0]=[];
   num[0][0] = 11;
   num[0][1] = 13;
   num[0][2] = 15;
   num[0][3] = 17;
   num[0][4] = 19;

   num[1]=[];
   num[1][0] = 12;
   num[1][1] = 14;
   num[1][2] = 16;
   num[1][3] = 18;
   num[1][4] = 10;
数组中的内容如下：

这里写图片描述

如果想看这个矩阵的输出，可以创建一个通用函数，专门输出其中的值。

function printMatrix(myMatrix){
    for(var i =0;i<myMatrix.length;i++){
        for (var j = 0;j<myMatrix[i].length;j++) {
            console.log(myMatrix[i][j]);
        }
    }
  }
打印输出num矩阵中的元素
printMatrix(num);

以此类推，可以用这种方式来处理多维数组。创建一个3x3的矩阵，每一格里包含矩阵的i行j列z深度之和。

var matrix3x3x3 = [];
  for (var i =0;i<3;i++) {
    matrix3x3x3[i]=[];
    for (var j = 0;j<3;j++) {
        matrix3x3x3[i][j]=[];
        for (var z= 0;z<3<z++) {
            matrix3x3x3[i][j][z]=i+j+z;
        }
    }
  }

数据结构中有几个维度都没有关系，都可以用循环遍历每个维度访问所有格子。3x3x3的矩阵可以用立体图表示：
这里写图片描述

4.JavaScript的数组方法参考

在JavaScript中，数组是可以修改的对象。这意味着创建每个数组都有一些可用的方法。
下面列出数组的一些核心方法。
这里写图片描述

4.1数组合并：concat()

有多个数组，需要合并成一个数组。我们可以迭代各个数组，然后把每个元素加入最终的数组。但JavaScript提供了 concat()方法。concat()方法可以向一个数组传递数组、对象或是元素。数组会按照该方法传入的参数顺序连接指定数组。
如下：

 var num1 = [1,2,3];
  var num2 = [-3,-2,-1];
  var num3 = 0;
  var num = num2.concat(num3,num1);
  console.log(num); //[-3, -2, -1, 0, 1, 2, 3]

4.2 迭代器函数
JavaScript内置了许多数组可用的迭代方法。我的这篇博客有详细介绍，这里不赘述。

http://blog.youkuaiyun.com/diligentkong/article/details/71533866

4.3 搜索排序

若想反序输出数组num = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15];要实现这样的功能，可以用reverse()方法，然后数组内元素就会反序。

num.reverse();//[15, 14, 13, 12, 11, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1]

我们用sort()方法试一下：

num.sort();//[1, 10, 11, 12, 13, 14, 15, 2, 3, 4, 5, 6, 7, 8, 9]

咦？这样看起来不对吧。这是因为sort方法在对数组做排序时，把元素默认成字符串进行相互比较。
因此可以传入自己写的比较函数，因为数组里面都是数组，可以这样写：

num.sort(function(a,b){
    return a- b;
 });

这段代码，对于b>a时，会返回负数，反之则返回正数。如果相等，返回0.
也就是说返回的是负数，就说明a比b小，这样sort就根据返回值的情况给数组做排序。

具体可这样表述：

function compare(a,b){
    if (a < b) {
        return -1;
    }
    if (a > b) {
        return 1;
    }
    return 0;
 }
num.sort(compare);

这是因为JavaScript的sort方法接收compare方法作为参数，然后sort会用它排序数组。

4.3.1 自定义排序
可以对任何对象类型的数组排序，也可以创建compare函数来比较元素。例如，对象Person中有名字和年龄。用年龄来排序。

var Person =[
   {name:'John',age:30},
   {name:'Ana',age:20},
   {name:'Hobby',age:18},
   {name:'Chris',age:25}
];

function comparePerson(a,b){
    if (a.age < b.age) {
        return -1;
    }
    if (a.age > b.age) {
        return 1;
    }
    return 0;
}
console.log(Person.sort(comparePerson));

4.3.2 字符串排序

var names = ['Ana','ana','john','John'];
console.log(names.sort());// ["Ana", "John", "ana", "john"]

为什么会这样？这是因为JavaScript在做字符比较的时候，根据字符对应的ASCII值来比较的例如： A、J、a、j对应的ASCII值分贝是65,75,7,106。虽然在字母表里a最靠前，但是J的ASCII的值比a小，所以排在a前面。
修改，让sort忽略大小写

names.sort(function(a,b){
    if(a.toLowerCase() < b.toLowerCase()){
        return -1;
    }
    if (a.toLowerCase() > b.toLowerCase()) {
        return 1;
    }
    return 0;
 });
["Ana", "ana", "john", "John"]

4.3.3 搜索
两个方法indexOf()返回与参数匹配的第一个元素的索引
lastIndexOf()返回与参数匹配的最后一个元素的索引

console.log(num.indexOf(6));//4
console.log(num.lastIndexOf(6));//9
console.log(num.indexOf(10));//-1

不存在返回-1
4.3.4 输出数组为字符串

1. 把数组所有元素输出为一个字符串，toString()方法

console.log(num.toString());//1,2,3,4,6,7,8,6,9,6

2. 用不同的分隔符（-）把元素隔开。用join()方法

var numString = num.join('-');
console.log(numString); //1-2-3-4-6-7-8-6-9-6

数组的讲解暂告一段落。

JS数据结构之---数组

1.创建和初始化数组

2.添加和删除元素

3.二维数组和多维数组

4.JavaScript的数组方法参考