Compare commits

..

2 Commits

Author SHA1 Message Date
duanmugoudan
122711be79
Merge 4f7eafe24f into 10c2db509d 2024-08-26 11:52:13 +08:00
qianguyihao
10c2db509d add(数组): filter 函数的两个例子对比 2024-08-18 23:01:15 +08:00

View File

@ -1476,7 +1476,9 @@ console.log(arr2);
## filter() ## filter()
语法: ### 语法
```js ```js
const newArr = arr.filter((currentItem, currentIndex, currentArray) => { const newArr = arr.filter((currentItem, currentIndex, currentArray) => {
@ -1488,6 +1490,8 @@ const newArr = arr.filter((currentItem, currentIndex, currentArray) => {
作用:对数组进行过滤。 作用:对数组进行过滤。
### 举例
**举例 1**:找出数组 arr1 中大于 4 的元素,返回一个新的数组。代码如下: **举例 1**:找出数组 arr1 中大于 4 的元素,返回一个新的数组。代码如下:
```javascript ```javascript
@ -1521,12 +1525,12 @@ console.log(JSON.stringify(arr2)); // 打印结果:[6,5,6]
```javascript ```javascript
const arr1 = [ const arr1 = [
{ name: '许嵩', type: '一线' }, { name: '许嵩', type: '一线' },
{ name: '周杰伦', type: '退居二线' }, { name: '周杰伦', type: '退居二线' },
{ name: '邓紫棋', type: '一线' }, { name: '邓紫棋', type: '一线' },
]; ];
const arr2 = arr1.filter((item) => item.type == '一线'); // 筛选出一线歌手 const arr2 = arr1.filter(item => item.type == '一线'); // 筛选出一线歌手
console.log(JSON.stringify(arr2)); console.log(JSON.stringify(arr2));
``` ```
@ -1540,6 +1544,65 @@ console.log(JSON.stringify(arr2));
]; ];
``` ```
### 两端代码对比
仔细看看下面这两段代码,有什么区别。数组 arr2的打印结果是不一样的。
第一段代码:
```js
const arr1 = [
{
name: 'a',
num: 1,
},
{
name: 'b',
num: 2,
},
];
const arr2 = [];
const arr3 = dataList.filter(item => {
return item.num === 1;
arr2.push(item);
});
console.log(arr2);
```
第二段代码:
```js
const arr1 = [
{
name: 'a',
num: 1,
},
{
name: 'b',
num: 2,
},
];
const arr2 = [];
const arr3 = dataList.filter(item => {
if (item.num === 1) return item;
arr2.push(item);
});
console.log('smyhvae arr2:', arr2);
```
分析:
- 第一段代码的打印结果是 空数组 `[]`。因为`return` 语句位于回调函数的第一行,所以一旦执行就直接返回,导致后面的 `arr2.push(item);` 永远不会被执行,因此 `arr2` 始终为空。
- 第二段代码的打印结果是` [{ name: 'b', num: 2 }]`。由于 `return` 语句位于 `if` 语句内部,只有在特定条件下(`item.num === 1`)才会终止回调函数,否则 `arr2.push(item);` 仍然会被执行,因此 `arr2` 中会有值。
## reduce() ## reduce()
### reduce() 语法 ### reduce() 语法