js中关于Map函数的基本使用

最新推荐文章于 2025-03-10 10:41:51 发布

最好的期待，未来可期

最新推荐文章于 2025-03-10 10:41:51 发布

阅读量746

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/qq_37823919/article/details/133105769

版权

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
/*
join方法用于把数组中的所有元素放入一个字符串
元素是通过指定的分隔符进行分隔的，如果用join来分割数组的话，这个变量就会变成字符串类型，就算之前是数组也会变成字符串类型，
js中的map（）方法定义在Array中，它返回一个新的数组，数组中的元素为原始数组调用函数处理后的值，map（）函数不会对空数组进行检查，
不会改变原始数组，形成的是一个新的数组
 */
let arr = ['张三','李四','王五']
let obj = {}
// 将数组转化为对象
for(let key in arr) {
  obj[key] = arr[key]
}
console.log(obj)  // {"0": "张三","1": "李四","2": "王五"}
let newObj = Object.keys(obj).map(val => ({
  label: obj[val],
  value: obj[val]
}))
console.log(newObj)  // [{"label": "张三","value": "张三"},{"label": "李四","value": "李四"},{"label": "王五","value": "王五"}]
//map() 方法定义在JavaScript的Array中，它返回一个新的数组，数组中的元素为原始数组调用函数处理后的值。
// 值得注意的是：1、map()函数不会对空数组进行检测；2、map()函数不会改变原始数组，它形成的是 一个新的数组
/* array.map(function(currentValue, index, arr), thisIndex)—
参数说明：
function(currentValue, index, arr)：必须。为一个函数，数组中的每个元素都会执行这个函数。其中函数参数：
currentValue：必须。表述当前元素的的值(item)
index：可选。当前元素的索引也就是第几个数组元素。
arr：可选。当前元素属于的数组对象
thisValue：可选。对象作为该执行回调时使用，传递给函数，用作"this"的值
 */
const arr1=[
  {"id": 10,"title":'web开发',"price":99},
  {"id": 11,"title":'Java开发',"price":80}
]
const newArr = arr1.map(item => {
  return {title: item.title,price: item.price}
})
console.log(newArr)
/*[{"title": "web开发","price": 99},{"title": "Java开发","price": 80}]*/
const m = new Map([
    ['Michael',95],
    ['bob',75]
])
console.log(m.get('Michael'))  // 95
const obj1 = [
  {name: 'apple',color: 'red'},
  {name: 'banana',color: 'pink'}
]
const colors = obj1.map(item => {
  return item.color
})
console.log(colors)  // ["red","pink"]
// 从接口中获取到的数据
const res = [
  {title: '河南','sex': 1,age: 40},
  {title: '郑州','sex': 0,age: 20}
]
const newRes = res.map(item => {
  return {title: item.title,sex: item.sex === 1?'男':item.sex === 0? '女':'保密',age: item.age}
})
console.log(newRes)  // [{"title": "河南","sex": "男","age": 40},{"title": "郑州","sex": "女","age": 20}]
const arr3 = [1,2,3,4,5,6,6,7,10]
const r = arr3.filter(item => {
  return item%2 !== 0
})
console.log(r) // arr3 = [1,2,3,4,5,6,6,7,10]   r=[1,3,5,7]
const arr4 = ['a','b','c','a']
const arr4_1 = arr4.filter(function(element,index,self){
  return self.indexOf(element) === index
})
console.log(arr4,arr4_1)  // ["a","b","c","a"]    ["a","b","c"]
const arr5 = [0,1,3]
let sum = 0
arr5.forEach(function(value, index, array){
  sum += value
})
console.log(sum) // 4
</script>
</body>
</html>