diff --git a/04-JavaScript基础/25-数组简介.md b/04-JavaScript基础/25-数组简介.md index f4c35f1..325658b 100644 --- a/04-JavaScript基础/25-数组简介.md +++ b/04-JavaScript基础/25-数组简介.md @@ -12,21 +12,27 @@ 数组的存储性能比普通对象要好。在实际开发中我们经常使用数组来存储一些数据,使用频率非常高。 -## 数组的基本操作 +接下来,我们讲一讲数组的基本操作。 数组中的元素可以是任意的数据类型,也可以是对象,也可以是函数,也可以是数组。 数组的元素中,如果存放的是数组,我们就称这种数组为二维数组。 -### 创建数组对象 +## 创建数组对象 -**方式一**:字面量定义。举例: +### 方式一:使用数组字面量创建数组 + +举例: ```javascript -var arr = [1,2,3]; +var arr1 = []; // 创建一个空的数组 + +var arr2 = [1,2,3]; // 创建带初始值的数组 ``` -**方式二**:对象定义(数组的构造函数)。 +方式一最简单,也用得最多。 + +### 方式二:使用构造函数创建数组 语法: @@ -34,10 +40,9 @@ var arr = [1,2,3]; var arr = new Array(参数); ``` -如果**参数为空**,则表示创建一个空数组;参数位置是**一个数值**时,表示数组长度;参数位置是**多个数值**时,表示数组中的元素。 - -上面的两种方式,我来举个例子: +如果**参数为空**,则表示创建一个空数组;如果参数是**一个数值**时,表示数组的长度;参数位置是**多个数值**时,表示数组中的元素。 +来举个例子: ```javascript // 方式一 @@ -56,7 +61,6 @@ var arr = new Array(参数); console.log("arr4 = " + JSON.stringify(arr4)); ``` - 打印结果: ```javascript @@ -70,6 +74,24 @@ arr4 = [15,16,17] 从上方打印结果的第一行里,可以看出,数组的类型其实也是属于**对象**。 +### 数组中的元素的类型 + +数组中可以存放**任意类型**的数据,例如字符串、数字、布尔值、对象等。 + +比如: + +```javascript +var arr = ['qianguyihao', 28, true, {name: 'qianguyihao'}]; +``` + +## 数组的基本操作 + +### 数组的索引 + +**索引** (下标) :用来访问数组元素的序号,代表的是数组中的元素在数组中的位置(下标从 0 开始算起)。 + +数组可以通过索引来访问、设置、修改对应的数组元素。我们继续看看。 + ### 向数组中添加元素 语法: @@ -81,13 +103,22 @@ arr4 = [15,16,17] 代码举例: ```javascript - var arr1 = []; +var arr = []; - // 向数组中添加元素 - arr[0] = 10; - arr[1] = 33; - arr[2] = 22; - arr[3] = 44; +// 向数组中添加元素 +arr[0] = 10; +arr[1] = 20; +arr[2] = 30; +arr[3] = 40; +arr[5] = 50; + +console.log(JSON.stringify(arr)); +``` + +打印结果: + +``` +[10,20,30,40,null,50] ``` ### 获取数组中的元素 @@ -98,8 +129,6 @@ arr4 = [15,16,17] 数组[索引] ``` -数组的索引代表的是数组中的元素在数组中的位置,从0开始。 - 如果读取不存在的索引(比如元素没那么多),系统不会报错,而是返回undefined。 代码举例: @@ -113,7 +142,7 @@ arr4 = [15,16,17] ### 获取数组的长度 -可以使用`length`属性来获取数组的长度(元素的个数)。 +可以使用`length`属性来获取数组的长度(即“元素的个数”)。 语法: @@ -164,13 +193,71 @@ arr4 = [15,16,17] [21,22,23,null,null] ``` +### 遍历数组 +**遍历**: 就是把数组中的每个元素从头到尾都访问一次。 + +最简单的做法是通过 for 循环,遍历数组中的每一项。举例: + +```javascript + var arr = [10, 20, 30, 40, 50]; + + for (var i = 0; i < arr.length; i++) { + console.log(arr[i]); // 打印出数组中的每一项 + } +``` + +下一篇文章,会学习数组的各种方法,到时候,会有更多的做法去遍历数组。 + +## 案例 + +### 例1:翻转数组 + +代码实现: + +```javascript + var arr = [10, 20, 30, 40, 50]; // 原始数组 + var newArr = []; // 翻转后的数组 + for (var i = 0; i < arr.length; i++) { + newArr[i] = arr[arr.length - i - 1]; + } + console.log(JSON.stringify(newArr)); +``` + +打印结果: + +``` + [50,40,30,20,10] +``` + +### 例2:冒泡排序 + +代码实现: + +```javascript + var arr = [20, 10, 50, 30, 40]; + for (var i = 0; i < arr.length - 1; i++) { + for (var j = 0; j < arr.length - i - 1; j++) { + if (arr[j] > arr[j + 1]) { + var temp = arr[j]; + arr[j] = arr[j + 1]; + arr[j + 1] = temp; + } + } + } + console.log(JSON.stringify(arr)); +``` + +打印结果: + +``` + [10,20,30,40,50] +``` ## 我的公众号 -想学习**代码之外的技能**?不妨关注我的微信公众号:**千古壹号**(id:`qianguyihao`)。 +想学习**代码之外的技能**?不妨关注我的微信公众号:**千古壹号**(id:`qianguyihao`)。 扫一扫,你将发现另一个全新的世界,而这将是一场美丽的意外: -![](http://img.smyhvae.com/20190101.png) - +![](http://img.smyhvae.com/20200101.png)