From e793fb7e4b6318e56a6355638a7ed2d417ee7f7d Mon Sep 17 00:00:00 2001 From: qianguyihao Date: Tue, 7 May 2019 15:07:42 +0800 Subject: [PATCH] =?UTF-8?q?update:=E9=81=8D=E5=8E=86=E6=95=B0=E7=BB=84?= =?UTF-8?q?=E7=9A=84=E6=96=B9=E6=B3=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../15-数组的四个基本方法&数组的遍历.md | 109 ++++++++++-------- 1 file changed, 61 insertions(+), 48 deletions(-) diff --git a/03-JavaScript基础/15-数组的四个基本方法&数组的遍历.md b/03-JavaScript基础/15-数组的四个基本方法&数组的遍历.md index ac02000..054d26b 100644 --- a/03-JavaScript基础/15-数组的四个基本方法&数组的遍历.md +++ b/03-JavaScript基础/15-数组的四个基本方法&数组的遍历.md @@ -2,7 +2,7 @@ ## 前言 -数组的四个基本方法如下: +**数组的四个基本方法如下**: | 方法 | 描述 | 备注 | |:-------------|:-------------|:-------------| @@ -11,8 +11,16 @@ | unshift() | 在数组**最前面**插入一个或多个元素,返回结果为**该数组新的长度**| 会改变原数组| | shift() | 删除数组中的**第一个**元素,返回结果为**被删除的元素**| 会改变原数组| +**遍历数组的方法如下**:(这几个方法都不会修改原数组) -遍历数组的方法如下: +| 方法 | 描述 | 备注 | +|:-------------|:-------------|:-------------| +| for循环 | 这个大家都懂| | +| forEach()|和 for循环类似,但需要兼容IE8以上 | | +| filter()| 返回结果是true的项,将组成新的数组| 可以起到过滤的作用| +| map()| 对原数组中的每一项进行加工 | | +| every()| 如果有一项返回false,则停止遍历 | 意思是,要求每一项都返回true,最终的结果才返回true | +| some()| 只要有一项返回true,则停止遍历 | | ## 数组的四个基本方法(数组元素的添加和删除) @@ -113,9 +121,9 @@ ## 数组的遍历 -遍历数组即:获取并操作数组中的每一个元素。 +遍历数组即:获取并操作数组中的每一个元素。在我们的实战开发中,使用得非常频繁。 -数组迭代方法包括:every()、filter()、forEach()、map()、some() +遍历数组的方法包括:every()、filter()、forEach()、map()、some() PS:这几个方法**不会修改原数组**。 @@ -146,6 +154,7 @@ PS:这几个方法**不会修改原数组**。 ![](http://img.smyhvae.com/20180124_2008.png) + ### forEach() 遍历 > `forEach()` 这种遍历方法只支持IE8以上的浏览器。IE8及以下的浏览器均不支持该方法。所以如果需要兼容IE8,则不要使用forEach,改为使用for循环来遍历即可。 @@ -166,14 +175,14 @@ forEach()方法需要一个函数作为参数。这种函数,是由我们创 代码举例: ```javascript - var arr = ["王一", "王二", "王三"]; + var arr = ["王一", "王二", "王三"]; - arr.forEach(function(item, index, obj) { - console.log("item:" + item); - console.log("index:" + index); - console.log("obj:" + obj); - console.log("----------"); - }); + arr.forEach(function(item, index, obj) { + console.log("item:" + item); + console.log("index:" + index); + console.log("obj:" + obj); + console.log("----------"); + }); ``` 打印结果: @@ -195,44 +204,8 @@ obj:王一,王二,王三 ---------- ``` -### map()方法 -解释:对数组中每一项运行回调函数,返回该函数的结果,组成的新数组(返回的是**加工之后**的新数组)。 - -比如说,有一个已知的数组arr1,我要求让arr1中的每个素加10,这里就可以用到map方法。举例: - -```javascript - var arr1 = [1, 3, 6, 2, 5, 6]; - - var arr2 = arr1.map(function (item, index) { - return item + 10; //让arr1中的每个元素加10 - - }) - console.log(arr2); -``` - -打印结果: - -![](http://img.smyhvae.com/20180402_0938.png) - -举例2: - -```javascript - var arr1 = ["千古", "宿敌", "南山忆", "素颜"]; - - var arr2 = arr1.map(function (element, index, array) { - return element + "vae"; //给arr1中所有的元素增加字符串"vae",放到arr2中。 - }); - - console.log(arr1); - console.log(arr2); -``` - -结果: - -![](http://img.smyhvae.com/20180126_1425.png) - -### filter +### filter() 语法: @@ -280,6 +253,46 @@ obj:王一,王二,王三 ![](http://img.smyhvae.com/20180126_1410.png) + +### map()方法 + +解释:对数组中每一项运行回调函数,返回该函数的结果,组成的新数组(返回的是**加工之后**的新数组)。 + +比如说,有一个已知的数组arr1,我要求让arr1中的每个素加10,这里就可以用到map方法。举例: + +```javascript + var arr1 = [1, 3, 6, 2, 5, 6]; + + var arr2 = arr1.map(function (item, index) { + return item + 10; //让arr1中的每个元素加10 + + }) + console.log(arr2); +``` + +打印结果: + +![](http://img.smyhvae.com/20180402_0938.png) + +举例2: + +```javascript + var arr1 = ["千古", "宿敌", "南山忆", "素颜"]; + + var arr2 = arr1.map(function (element, index, array) { + return element + "vae"; //给arr1中所有的元素增加字符串"vae",放到arr2中。 + }); + + console.log(arr1); + console.log(arr2); +``` + +结果: + +![](http://img.smyhvae.com/20180126_1425.png) + + + ### every()方法 解释:对数组中每一项运行回调函数,如果都返回true,every就返回true;如果有一项返回false,则停止遍历,此方法返回false。