JavaScript基础快速入门教程（七）：数组创建、遍历数组、数据结构和算法和实例

一、JavaScript数组的概念和创建、使用数组

JavaScript数组是什么？数组是一堆数据的组合或集合，它是一种数据容器，可以容纳很多的数据。JavaScript的数组和C++或Java中的数组不同，JavaScript的数组可以容纳不同数据类型的数据，例如同一个数组可以添加字符串类型和数值类型的数据。JavaScript中的数组对象是Array和Object一样，也是常用的引用类型，是所有编程语言都有数组，开发中也常用，所以很有必要掌握数组以及相关的操作。

JavaScript如何创建数组？和Object对象的创建一样，JavaScript创建数组同样有两种方式：使用new操作符和数组字面量的形式创建数组。数组可以按顺序存储多种不同类型的数据，顺序序号从0开始，称为数组的索引，我们可以通过数组的索引结合[]访问和修改数组中的数据元素，例如array[0]表示访问数组array的第一个数据元素，数组元素的个数称为数组的长度，例子如下：

/**
 * 创建数组
 * 方式一：使用Array和new操作符
 */
var data = new Array(); // 空构造函数创建数组
// var data = new Array(3); 初始化数组容量为3
// var data = new Array(12, "Tomcat", true) 直接使用数据创建一个数组
data[0] = 12;
data[1] = "Tomcat";
data[2] = true;

// 方式二：使用字面量的方式创建数组
var days = ["Sunday", "Monday", "Tuesday"];
console.log(days);
console.log("数组第一个元素：" + days[0]);
days[3] = "Wednesday";
console.log(days);

输出结果：

要注意的是给数组赋值的时候，如果没有按索引连续赋值，JavaScript并不会报错，例如array[0] = 1，array[99] = 99，这时中间没赋值的都被填充为空undefined，但是此时length会显示为100，length是表示数组长度的属性，实际上数组中只有两个数组，这样的数组称为稀疏数组，在开发中应该尽量避免稀疏数组的出现，必须的时候需要对数组的元素进行undefined过滤，下面是稀疏数组的实例。

二、遍历数组

上面提到数组的length属性，这个属性表示数组元素的个数，数组元素的顺序序号称为索引，索引从0开始，遍历数组指的是循环访问数组的所有元素，需要用到数组的length属性和使用索引访问。

JavaScript如何遍历数组？JavaScript遍历数组的方式有两种：for循环和for in遍历数组，其中for
in接收的是数组的索引，而不是数组的元素，使用for in遍历对象接收到的是对象的属性名，而不是变量的属性值。

另外还要注意的是，Array也是继承Object的，使用for in循环会把Object属性都遍历出来，这时候可以使用hasOwnProperty()函数过滤掉，或者不用for in，尽量使用for循环遍历数组。

JavaScript遍历数组的实例：

// 遍历数组
var songs = ["Under Mount Fuji", "Naked", "Shall we talk", "Comes and Goes"];

// 使用for循环遍历数组
for (var i = 0; i < songs.length; i++) {
    console.log(songs[i]);
}

// 使用for in遍历数组
for (var index in songs) {
    if (songs.hasOwnProperty(index)) { // 过滤掉继承而来的属性
        var song = songs[index];
        console.log(song);
    }
}

三、数组的数据结构和算法

数组是一种数据结构，数据容器，连续存储在内存中，对数据结构最基本的操作算法有：增加数据、删除数据、修改数据、查找数据和数据排序，上面我们看到的使用[]和索引也可以访问和修改数组中的数据，数组数据结构常用的操作函数有：

pop()：从数组尾部弹出一个元素，并返回弹出的元素。
push()：从数组尾部压入一个元素，并返回数组长度。
shift()：从数组头部弹出一个元素，并返回弹出的元素。
unshift()：从数组头部压入一个元素，并返回数组的长度。
sort()：将数组的元素转为字符串并进行排序。
reverse()：对原数组进行逆向排序。

Pop和push是操作栈数据结构，栈结构先进后出，shift和unshift是操作队列数据结构，队列的特点是先进先出，这两种数据结构可以结合使用，使用实例如下：

// 数组的数据结构操作函数
var movie = ["Time", "Django", "Inception"];

var inception = movie.pop(); // 弹出movie[2]
console.log("movie length: " + movie.length + ", pop " + inception);
var length = movie.push("Interstellar");
console.log(movie); // 此时movie[2] = "Interstellar"
var time = movie.shift();
console.log("movie lenght: " + movie.length + ", shift " + time);
length = movie.unshift("Pulp Fiction"); // 此时movie[0] = "Pulp Fiction"
console.log(movie);
console.log(movie.length); // => 3
console.log(movie.sort()); // 顺序排序
console.log(movie.reverse()); // 逆序排序

数组相关的函数还有concat()数组连接函数和join()元素连接方式，concat()函数用于向原数组批量追加新的元素，返回一个新的数组，但是不会影响原数组，join()函数用于将数组所有元素连接为一个字符串，默认使用逗号分隔，实例如下：

// 数组的concat()和join()函数
var array = [4, 5, 6];
var new_array = array.concat(7, 8, 9);
console.log(new_array); // => 4, 5, 6, 7, 8, 9
var array_str = array.join();
console.log(array_str); // => 4, 5, 6
array_str = array.join("");
console.log(array_str); // => 456

另外数组的函数还有slice()函数和splice()函数，slice()函数用于截取数组的某一部分，slice()函数接受两个参数，第一个参数是起始索引，第二个参数是结束索引，意思是从第一个索引的位置，截取到结束索引的位置，第二个参数默认为数组结束索引，返回新的数组，但不影响原数组。

Splice()函数用于删除或添加原数组的元素，结果影响原数组，该方法接受多个参数，第一个参数表示要删除元素的索引位置，第二个参数表示删除元素的个数，第三个参数开始都是添加都数组的元素，仅传入一个参数表示从开始位置删除到末尾，返回的是删除的元素的数组。

使用实例如下：

// 数组的slice()和splice()函数
var weather = ["sunny", "cloudy", "rainy", "cold"];
var new_weather = weather.slice(2);
console.log(new_weather.toString()); // "rainy", "cold"
new_weather = weather.slice(1, 3);
console.log(new_weather.toString()); // "cloundy", "rainy"

// 从某位置开始删除元素，并从该位置开始插入元素
var numbers = [1, 2, 3, 4, 5];
console.log(numbers.splice(1, 2, 12, 13, 14)); // => 2, 3
console.log(numbers.toString()); // => 1,12,13,14,4,5

一、JavaScript数组的概念和创建、使用数组

二、遍历数组

三、数组的数据结构和算法

猜你喜欢