update: 数组遍历的异常流场景考虑

04-JavaScript基础/19-数组的常见方法.md

@@ -966,7 +966,8 @@ const itemResult = arr.find((currentItem, currentIndex, currentArray) => {
 
 备注：一旦找到符合条件的第一个元素，将不再继续往下遍历。
 
-举例：
+
+举例1：
 
 ```javascript
 let arr = [2, 3, 2, 5, 7, 6];
@@ -979,6 +980,13 @@ let result = arr.find((item, index) => {
 console.log(result); //打印结果：5
 ```
 
+重要提醒：如果改变了 itemResult 内部的值，则 arr 里的对应元素，它的值也会被改变。举例如下。
+
+举例2：todo
+
+
+
+
 ### findIndex()
 
 **语法**：
@@ -1275,6 +1283,36 @@ console.log(JSON.stringify(objArr2)); // 打印结果：[{"name":"小明","age":
 
 -   [forEach 会改变原数组值吗](https://lhajh.github.io/js/2018/05/26/Does-forEach-change-the-original-array-value.html)
 
+### 空数组调用 forEach() 方法时，会不会报错？
+
+例1：
+
+```js
+const arr1 = undefined;
+
+arr.forEach(item => {
+  console.log(item);
+  item.name = 'qianguyihao';
+});
+```
+
+上面的代码中，数组 arr1 并不存在，所以会报错`Uncaught TypeError: Cannot read properties of undefined (reading 'forEach')`
+
+例2：
+
+```js
+const arr2 = [];
+
+arr2.forEach(item => {
+  console.log(item);
+  item.name = "qianguyihao";
+});
+```
+
+上面的代码中，arr2是空数组，但是在遍历时并不会报错，因为 forEach 是数组的内置方法。arr2作为空数组，是属于特殊的数组，数组在调用内置方法时不会报错。在上面的例2中，forEach 对空数组不会执行回调函数（也就意味着，console.log 那行不会执行），因为没有元素需要遍历。
+
+如果把 forEach() 换成 map()方法，也是一样的道理。
+
 ## for of
 
 ES6语法推出了 for of，可用于循环遍历数组。
@@ -1344,10 +1382,15 @@ const arr1 = [
     { name: '许嵩', age: '32' },
 ];
 
-// 将数组 arr1 中的 name 属性，存储到 数组 arr2 中
+// 举例2.1、将数组 arr1 中的 name 属性，存储到 数组 arr2 中
 const arr2 = arr1.map(item => item.name);
 
-// 将数组 arr1 中的 name、age这两个属性，改一下“键”的名字，存储到 arr3中
+// 上面的代码是简写的方式。完整写法是下面这样：（这两种写法是等价的）
+const _arr2 = arr1.map(item => {
+  return item.name;
+});
+
+// 举例2.2、将数组 arr1 中的 name、age这两个属性，改一下“键”的名字，存储到 arr3中
 const arr3 = arr1.map(item => ({
     myName: item.name,
     myAge: item.age,
@@ -1405,6 +1448,31 @@ map 的应用场景，主要就是以上两种。
 总结：map方法如果是修改整个item的值，则不会改变原数组。但如果是修改 item 里面的某个属性，那就会改变原数组。
 
 
+### map()在遍历时，如果不写 return 会怎么样
+
+举例：
+
+```js
+const arr1 = [{ name: 'hehe1' }, { name: 'hehe2' }];
+
+const arr2 = arr1.map(item => {
+  item.name = 'haha';
+});
+
+console.log(arr1);
+console.log(arr2);
+```
+
+代码执行完成后：
+
+- arr1 的结果：[{ name: 'haha' }, { name: 'haha' }]
+
+- arr2 的结果：[undefined, undefined]
+
+由此可见，如果 map() 方法中没有 return 语句也是合法的，它会默认返回 `undefined`。
+
+所以，针对对象数组，**如果你只是想修改对象中的某个属性值，而不想创建新数组的话，建议使用 forEach() 方法，而不是 map() 方法**。map() 方法的初衷是创建一个新数组。
+
 
 ## filter()