• 利用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生成时序图和类图(案例超详解)
    Nginx (6):nginx防盗链配置
    HTTP如何自动跳转到HTTPS,免费SSL证书如何获取
    automake工具基本使用
    阻塞队列-生产者消费者模型
    SpringCloud初探
    python爬虫自学首次大捷
    基于Redis实现消息队列的实践
    el-switch接口实现
  • 原文地址:https://blog.csdn.net/qq_41163341/article/details/125497733