javascript 数据结构和算法读书笔记 > 第二章 数组

这章主要讲解了数组的工作原理和其适用场景。

定义：

　　一个存储元素的线性集合，元素可以通过索引来任意存取，索引通常是数字，用来计算元素之间存储位置的偏移量。

javascript数组的特殊之处：

　　javascript中数组是一种特殊的对象，用来表示偏移量的索引是该对象的属性，索引可能是整数，但是这些整数会被转化为字符串。

这是因为javascript中对象的属性必须死字符串类型。

1. 数组的基本操作

 a) 创建数组

　　声明空的数组：

// 1. 使用new关键字
var arr1 = new Array();
// 2. 使用中括号（推荐）
var arr2 = [];

初始化：

// new 的方式一个参数
var arr1 = new Array(5);
console.info(arr1.length); --> 5
// 多个参数
var arr2 = new Array(1,2,3,4,5);
console.info(arr2.length); --> 5
//  [] 方式
var arr3 = [1,2,3,4,5];
console.info(arr3.length); --> 5

可以调用Array.isArray方法，判断是否为数组

var num = 3;
var arr = ['a', 12, true, null];
console.info(Array.isArray(num)); -> false
console.info(Array.isArray(arr)); -> true

 b) 读写数组

　　利用循环写数组：

var arr = [];
for(var i=0;i<10;i++){
    arr[i] = i;
}

　　利用循环读取：

var arr = [1,2,3,4,5];
for(var i=0;i<arr.length;i++){
      console.info(arr[i]);
}

 c) 由字符串生成数组

字符串对象调用 split 方法也可以生成数组

split方法就是根据某一个特定字符将字符串拆分为多条数据

var str = "you are a great javascripter".
var arr = str.split(' ');
for(var i=0;i<arr.length;i++){
  console.info(arr[i]);
}
=》 you
=》 are
=》 a
=》 great
=》 greate
=》 javascripter

 d) 对数组的整体性操作

从一个数组对另一个数组复制

var a = [5, 11];
var b = a;
console.info(b[0]); =>5
a[0] = 1;
console.info(b[0]); =>1

我们可以看到，在首次赋值时，数组b确实是拥有和a一样的值，但是将原有的a数组中的数据进行改变后，b数组中也随之改变，

说明了我们赋值给b的知识a数组的引用。这种赋值方式也叫做浅拷贝。

为了达成深拷贝，必须每个值依依复制：

function copyArr(org, dest){
    for(var i=0; i<org.length; i++){
         dest[i] = org[i];
    }
}

var a = [5, 11];
var b = copyArr(a, b);
console.info(b); =>5,11
a[0] = 1;
console.info(b); =>1,11

2.存取函数

　　a) 查找元素

　　indexOf()是javascript中最常用的查找函数，参数为你要查找的内容，返回为该内容所在的下标位置，没有时返回-1,若是有多个相同元素则返回第一次出现的位置。

var arr = ['David', 'Jason', 'Kerry', 'Jimmy','Kerry'];
var index = arr.indexOf('Jimmy');
console.info(index); => 3
index = arr.indexOf('Owen');
console.info(index); => -1;index = arr.indexOf('Kerry');console.info(index); => 2 

　如果想获取最后一次出现的位置使用lastIndexOf()方法即可。

　　b) 数组的字符串表示

　有两个方法可以讲数组转为字符串 join(str)和toString()

var arr = ['a', 'b', 'c'];
var str1 = arr.join();
console.info(str1); => "a,b,c";
var str2 = arr.toString();
console.info(str2); => "a,b,c";

　　与其他语言类似直接打印一个非String类型变量的时候，会自动调用其toString()方法。

　　c) 由已有数组创建的新数组

　　javascript中有两个方法去通过原有数组创建新数组。

　　ArrayObject.concat(ArrayObject) 用于合并数组

var arr1 = [1, 2, 3, 4, 5];
var arr2 = [6, 7, 8, 9, 10];
var arr = arr1.concat(arr2);
> arr1
[1, 2, 3, 4, 5]
> arr2
< [6, 7, 8, 9, 10]
> arr
< [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

可以看到被操作数组arr1和arr2没有被改变，concat方法的返回值为二者合并后的结果。

　　ArrayObject.splice(index, length) 用于截取数组

var arr1 = [1, 2, 3, 4, 5];
var arr2 = [6, 7, 8, 9, 10];
var arr = arr1.concat(arr2);
var _arr = arr.splice(1,2);

> arr
< [1, 4, 5, 6, 7, 8, 9, 10]
> _arr
< [2, 3]

该方法会修改原有数组中的内容。

3.可变函数

　　a) 添加

　　在数组的末尾添加:

方法一：　

var arr = [1, 2, 3, 4, 5];
arr.push(6);
> arr
< [1,2,3,4,5,6]

方法二：

var arr = [1, 2, 3, 4, 5];
arr[arr.length] = 6;

> arr
< [1,2,3,4,5,6]

方法一比方法二更加直观些。

　　在数组开头增加元素：

方法一：

var arr = [1, 2, 3, 4, 5];
var len = arr.length;
for (var i = len; i >= 1; i--) {
     arr[i] = arr[i-1]; // 将原有的数据向后移动一位
}
arr[0] = 0; // 第一个元素为要添加的元素

> arr
< [0,1,2,3,4,5]

方法二：

var arr = [1, 2, 3, 4, 5];
var newnum = 0;
arr.unshift(newnum);

> arr
< [0,1,2,3,4,5]

arr.unshift(6, 7, 8);

> arr
< [6, 7, 8, 0, 1, 2, 3, 4, 5]

　　b) 删除

　　将数组最后一个元素删除：

var arr = [1, 2, 3, 4, 5];
var num = arr.pop();  // newnum用来保存删除的元素

> arr < [1, 2, 3, 4] > num < 5

　　讲述组第一个元素删除：

方法一：

var arr = [1, 2, 3, 4, 5];
var len = arr.length;
for(var i=0; i<len-1;i++){
    arr[i] = arr[i+1];
}
arr.length = len - 1;

> arr
< [2, 3, 4, 5]

方法二：

var arr = [1, 2, 3, 4, 5];
var newnum = arr.shift(); // newnum用来保存删除的元素

> arr
< [2, 3, 4, 5]
> newnum
< 1

方法二更为高效和直观些。

　　c) 在确定位置添加和删除

使用之前提到过的splice方法即可：

var arr = [1, 2, 3, 4, 5];
//  末尾添加
arr.splice(arr.length, 0, 6); // = > [1, 2, 3, 4, 5, 6]
//    开头添加
arr.splice(0, 0, 0); //= > [0, 1, 2, 3, 4, 5, 6]
// 从第二为开始删除3个元素
arr.splice(2, 3); // = > [0, 1, 5, 6]
//    从第二位起，添加元素2, 3, 4
arr.splice(2, 0, 2, 3, 4); // = > [0, 1, 2, 3, 4, 5, 6]

　　d) 为数组排序

翻转：

var arr = [1, 2, 3, 4, 5];
//  对数组进行翻转
console.info(arr.reverse()); // = > [5, 4, 3, 2, 1]
//  arr 数组直接被修改
console.info(arr); // = > [5, 4, 3, 2, 1]

排序：

　　对于字符串使用 sort 方法效果不错：

var arr = ['Bonnee', 'Demon', 'Stefan', 'Elena', 'Jeremy'];
arr.sort();
console.info(arr); // = >  ["Bonnee", "Demon", "Elena", "Jeremy", "Stefan"]

可以看到对于字符串使用sort方法，会根据首字母的顺序进行排列。

　　但是对于数字排序如果我们直接使用sort方法就会出现奇怪的东西了：

var arr = [5, 30, 2, 400, 1];
arr.sort();
console.info(arr); // = > [1, 2, 30, 400, 5]

其实sort方法中我们还缺少了一个参数，作为比较的方法判断函数。如果不加这个函数时，sort方法会将数组中的元素进行字典排序，不会进行大小排序。

var arr = [5, 30, 2, 400, 1];
//    正序排列
arr.sort(function(x, y){
    return x - y;
});
console.info(arr); // = > [1, 2, 5, 30, 400]
//    倒序排列
arr.sort(function(x, y){
    return y - x;
});
console.info(arr); // = > [400, 30, 5, 2, 1]

4.迭代器方法

　　a) 不生成新数组的迭代器方法

　　forEach方法(不能写成 foreach ), 用于对数组中每个元素都进行相同操作

var arr = [1, 2, 3, 4, 5, 6];
var square = function(x){
    console.info(x, x*x);
};
arr.forEach(square);

---------------------------------
1 1
2 4
3 9
4 16
5 25
6 36
---------------------------------

every方法，用于对每个元素进进行统一判断，最后返回boolean值。如果有一个值为false就返回false，所有为true才会返回true

如判读一组数是否都为偶数：

var arr = [1, 2, 3, 4, 5, 6];
var isEven = function(x){
    return x%2 === 0;
};
var rs = arr.every(isEven);
if(rs){
    console.info("all the number in the array are even.");
}else{
    console.info("not all the number in the array are even.");
}

-----------------------------------------------
not all the number in the array are even.
-----------------------------------------------

some 方法，如果一个值返回true，则会返回true，所有为false才会为false

如判断一组数中是否有偶数：

var arr = [1, 2, 3, 4, 5, 6];
var isEven = function(x){
    return x%2 === 0;
};
var rs = arr.some(isEven);
if(rs){
    console.info("some number in the array are even.");
}else{
    console.info("all the number in the array are not even.");
}

------------------------------------------
 number in the array
------------------------------------------

reduce方法，一般用于累加：

var arr = [1, 2, 3, 4, 5, 6];
var add = function(runningNum, currentNum){
    return  runningNum + currentNum;
};
var rs = arr.reduce(add); // = > 21

reduceRight方法，从右到左进行累加

var strArr = [' Paper',' are','You'];
var joinStr = function(runningStr, currentStr){
    return runningStr + currentStr;
};
var rsStr = strArr.reduceRight(joinStr); // = 》 "You are Paper"

　　b) 生成新数组的迭代器方法

所谓生成新数组就是对数组中的元素依次改变，最后返回一个由改变的元素组成的新的数组对象

map方法　

var strArr = [' Paper', ' are', ' You'];

var delSpace = function(x){
    return x.replace(/\s/g, '');
};
var rsArr = strArr.map(delSpace); // = > ["Paper", "are", "You"]

filter方法

和其名称一样，filter会根据你传入的函数，过滤掉为false的元素

如过滤掉无用元素：

var strArr = ['a','', null, 'c', undefined];
var rsArr = strArr.filter(function(x){
    return x;
}); // => ["a", "c"]

5.二维和多维数组

　　a) 创建二维数组

创建二维数组首先要创建一个一维数组，然后其中每个元素都为一个一维数组就行了：

var arr = [];
var len = 5;
for (var i = 5 - 1; i >= 0; i--) {
    arr[i] = [];
};

> arr
< [Array[0]length: 0__proto__: Array[0], Array[0]length: 0__proto__: Array[0], Array[0]length: 0__proto__: Array[0], Array[0]length: 0__proto__: Array[0], Array[0]length: 0__proto__: Array[0]]

其实我们也可以再Array上直接添加方法：

Array.matrix = function(row, col, init){
    var arr = [];
    for(var i=0; i<row; i++){
        var temp = [];
        for(var j=0;j<col; j++){
            temp[j] = init;
        }
        arr[i] = temp;
    }
    return arr;
};

var arr = Array.matrix(3, 4, 1);

console.info(arr[2][3]); // = > 1

或者直接初始化：

var arr = [[43,23],[52,1],[2,4]];

　　b) 处理二维数组的元素

按行处理：

arr 用以保存 3 名学生 3 门课的成绩，求每个学生的平均成绩：arr 用以保存 3 名学生 3 门课的成绩

var arr = [[98,77,89],[77,66, 59],[92,82,89]];
for(var i=0; i<arr.length; i++){
    var total = 0,
        average = 0.0;
    var currentStu = arr[i];
    for(var j=0; j<currentStu.length; j++){
        total += currentStu[j];
    }
    average = total/currentStu.length;
    console.info("Student " + parseInt(i) + ": " + average.toFixed(2));
}

--------------------------------
Student 1: 88.00
Student 2: 67.33
Student 3: 87.67
--------------------------------

按列处理：

arr 用以保存 3 名学生 3 门课的成绩，求每门课的平均成绩：

var grades = [[89, 77, 78] , [76, 82, 81] , [91, 94, 89], [71, 83, 74]] ;
var total = 0;
var average = 0.0;
var courseNum = 3;
var stuNum = grades.length;
//    已知有三门课程
for (var col = 0; col < courseNum; ++col) {
    for (var row = 0; row < stuNum; ++row) {
        total += grades[row][col] ;
    }
    average = total / stuNum;
    console.info("Course " + parseInt(col+1) + " average: " + average. toFixed(2));
    total = 0;
    average = 0.0;
}

-------------------------------------------
Course 1 average: 81.75
Course 2 average: 84.00
Course 3 average: 80.50
-------------------------------------------

　　c) 参差不齐的数组

和之前一样，没有变化：

var arr = [[98,77,89],[77,66,59, 82, 78],[92,82,89,33]];
for(var i=0; i<arr.length; i++){
    var total = 0,
        average = 0.0;
    var currentStu = arr[i];
    for(var j=0; j<currentStu.length; j++){
        total += currentStu[j];
    }
    average = total/currentStu.length;
    console.info("Student " + parseInt(i) + ": " + average.toFixed(2));
}

---------------------------------------
Student 0: 88.00
Student 1: 72.40
Student 2: 74.00
---------------------------------------

6.对象数组

和普通类型的数组没有什么区别，都可以使用以上提到过的方法。

7.对象中的数组

以上面提到过的学生成绩和求该学生的平均成为为例：

var StuGrade = function(){
    var total = 0;
    this.grades = [];
    this.add = function(grade){
        this.grades.push(grade);
        total += grade;
    };
    this.average = function(){
        return total / this.grades.length;
    };
};

var stu1 = new StuGrade();
stu1.add(80);
stu1.add(73);
stu1.add(88);
stu1.add(92);
console.info(stu1.grades); // = > [80, 73, 88, 92]
console.info(stu1.average()); // = > 83.25

第二章知识思维导图：