map
map 方法是对数组进行遍历操作的常用方法之一。
map 方法会对原数组中的每个元素执行回调函数，并将回调函数的返回值组成一个新数组返回。因此，我们可以通过 map 在不改变原数组的情况下对数组进行一些处理，例如映射、过滤、抽取等操作。
以下是 map 方法的语法和示例：
- 将数字字符串数组转换为数字数组
const arr = ['1', '2', '3']
const numArr = arr.map(Number) // [1, 2, 3]
- 对象数组通过属性返回新的数组
const users = [
{ name: 'John', age: 20 },
{ name: 'Alice', age: 25 },
{ name: 'Bob', age: 30 },
]
const names = users.map(user => user.name) // ['John', 'Alice', 'Bob']
const ages = users.map(user => user.age) // [20, 25, 30]
- 将二维数组扁平化为一维数组
const arr = [[1, 2], [3, 4], [5, 6]]
const flatArr = arr.map(item => item[0]) // [1, 3, 5]
- 对数组中的空格进行裁剪
const arr = [' apple', 'ba na na ', ' cherry ']
const trimmedArr = arr.map(item => item.trim()) // ['apple', 'ba na na', 'cherry']
- 将数组元素转换为对象
const arr = ['apple', 'banana', 'cherry']
const objArr = arr.map((item, index) => ({ id: index, value: item }))
// [{ id: 0, value: 'apple' }, { id: 1, value: 'banana' }, { id: 2, value: 'cherry' }]
还有以下几点需要注意：
map方法返回的是一个新数组，不会修改原数组。如果需要修改原数组，可以使用其他方法，例如forEach、splice等。- 回调函数中的参数
currentValue表示当前遍历的元素，index表示当前遍历的元素在数组中的下标，arr表示正在被遍历的数组。 - 如果传递了
thisValue参数，则该参数将作为回调函数中的this指向。 - 在回调函数中要注意不要改变外部的状态，因为
map并不会保证回调函数执行的顺序。 map可以处理稀疏数组，但是在遇到undefined元素时，回调函数仍然会被调用，所以需要注意回调函数中对undefined的处理。
Object.values()
Object.values(): 返回对象自身所有可枚举属性的键值组成的数组。
const obj = { name: 'Tom', age: 18 }
const values = Object.values(obj) // ['Tom', 18]
Object.entries()
Object.entries(): 返回对象自身所有可枚举属性的一个由 [key, value] 组成的数组。
const obj = { name: 'Tom', age: 18 }
const entries = Object.entries(obj) // [['name', 'Tom'], ['age', 18]]
