• 利用map的特性对数组进行操作


    map() 方法创建一个新数组,这个新数组由原数组中的每个元素都调用一次提供的函数后的返回值组成。

    语法

    var new_array = arr.map(function callback(currentValue[, index[, array]]) {
    // Return element for new_array
    }[, thisArg])

    参数

    callback 生成新数组元素的函数,使用三个参数:
    currentValue callback 数组中正在处理的当前元素。
    index可选 callback 数组中正在处理的当前元素的索引。
    array可选 map 方法调用的数组。 thisArg可选 执行
    callback 函数时值被用作this。

    返回值

    一个由原数组每个元素执行回调函数的结果组成的新数组。

    使用 map 重新格式化数组中的对象

    let data = [
        {
            id: 3,
            name: 'zhangsan',
            age: '14'
        }, {
            id: 2,
            name: 'lisi',
            age: '15'
        }
    ]
    let retrunData = data.map(item => {
        return {
            id: item.id,
            age: item.age
        }
    })
    console.log(retrunData, 'retrunData');
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18

    使用一个包含一个参数的函数来 mapping(构建) 一个数字数组

    var numbers = [1, 4, 9];
    var doubles = numbers.map(function(num) {
      return num * 2;
    });
    
    // doubles 数组的值为: [2, 8, 18]
    // numbers 数组未被修改: [1, 4, 9]
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7

    map调用string中方法

    var map = Array.prototype.map
    var a = map.call("Hello World", function(x) {
      return x.charCodeAt(0);
    })
    // a 的值为 [72, 101, 108, 108, 111, 32, 87, 111, 114, 108, 100]
    
    • 1
    • 2
    • 3
    • 4
    • 5
            // map调用string的方法
            var map = Array.prototype.map
            var str = map.call('hello wrold', function (x) {
                return x.toLocaleUpperCase()
            })
            console.log(str,'toLocaleUpperCase');
            // ["H", "E", "L", "L", "O", " ", "W", "R", "O", "L", "D"],"toLocaleUpperCase"
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
  • 相关阅读:
    IDEA 集成Maven
    2022最新JUC+多线程面试题
    翻越相机标定的奥林匹斯
    [李宏毅深度学习作业] 作业1:ML2021Spring-hw1 COVID-19 Cases Prediction【以时间线为记录】
    pandas drop 方法
    Java 7 生命周期结束
    Revit导入Cad图元丢失不正确解决和链接CAD功能
    AtCoder Beginner Contest 263 G.Erasing Prime Pairs(二分图最大匹配-网络流)
    【iOS】UI学习(三)
    【MySQL】复合查询
  • 原文地址:https://blog.csdn.net/qq_41163341/article/details/125497733