• Array.map()

1、   map() 遍历数组

语法:

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

描述:

map 方法会给原数组中的每个元素都按顺序调用一次  callback 函数。callback 每次执行后的返回值(包括 undefined)组合起来形成一个新数组。 callback 函数只会在有值的索引上被调用;那些从来没被赋过值或者使用 delete 删除的索引则不会被调用。

callback 函数会被自动传入三个参数:数组元素,元素索引,原数组本身。

如果 thisArg 参数有值,则每次 callback 函数被调用的时候,this 都会指向 thisArg参数上的这个对象。如果省略了 thisArg 参数,或者赋值为 null 或 undefined,则 this 指向全局对象 。

map 不修改调用它的原数组本身(当然可以在 callback 执行时改变原数组)。

使用 map 方法处理数组时,数组元素的范围是在 callback 方法第一次调用之前就已经确定了。在 map 方法执行的过程中:原数组中新增加的元素将不会被 callback 访问到;若已经存在的元素被改变或删除了,则它们的传递到 callback 的值是 map 方法遍历到它们的那一时刻的值;而被删除的元素将不会被访问到。

示例:

白话理解:

map不会直接改变数组,但是在callback函数中可以有改变原数组的操作,如增加某属性item["newkey"] = '123'、 删除某个index的项等;

在小程序中,需要this.setData({datas: newData}) 改变page的中data的变量,从而改变页面的渲染,所以常用var newData = data.map(() => { .....  return item})

JS基本功 | JavaScript专题之数组 - 方法总结的更多相关文章

  1. js 中 一些重要的数组方法

    今天在学Vue的时候,看到了好多JS的数组方法,但是我不知道,我以为是Vue的方法,结果找了半天资料也没找出来,最后才发现这是JS的数组对象方法,于是就想做一下笔记,加深一下印象. Array 对象方 ...

  2. 二、JavaScript语言--JS基础--JavaScript进阶篇--数组

    1.什么事数组 我们知道变量用来存储数据,一个变量只能存储一个内容.假设你想存储10个人的姓名或者存储20个人的数学成绩,就需要10个或20个变量来存储,如果需要存储更多数据,那就会变的更麻烦.我们用 ...

  3. Javascript中遍历数组方法的性能对比

    Javascript中常见的遍历数组的方法 1.for循环 for(var i = 0; i < arr.length; i++) { // do something. } 2.for循环的改进 ...

  4. javascript中常用数组方法详细讲解

    javascript中数组常用方法总结 1.join()方法: Array.join()方法将数组中所以元素都转化为字符串链接在一起,返回最后生成的字符串.也可以指定可选的字符串在生成的字符串中来分隔 ...

  5. Javascript中的数组方法总结

    1.concat():将两个或多个数组合并成一个数组 arrayObject.concat(arrayX,arrayX,......,arrayX),返回一个新的数据,arrayX可以是数值也可以是数 ...

  6. JavaScript字符串与数组方法整理

    字符串(String)的方法: 代码后面的都是返回值 var str = "atusdgafsvg"; var str1 = "123456789"; var ...

  7. JavaScript 基础(六) 数组方法 闭包

    在一个对象中绑定函数,称为这个对象的方法.在JavaScript 中,对象的定义是这样的: var guagua = { name:'瓜瓜', birth:1990 }; 但是,如果我们给瓜瓜绑定一个 ...

  8. javascript常见的数组方法

    1:Array对象用于在单个变量中存储多个值typeof(arrArr) 'object'var arr1 = [];//创建一个空数组eg:数组是个引用类型var a = [1,2,3];var b ...

  9. javascript之操作数组方法

    掌握如何操作数组,会让你的开发变得更加高效 1.栈和队列方法(以下四个方法都改变原数组) arr.push() //接受任意类型的参数,逐个添加到数组的末尾,并返回数组的长度 改变原数组 arr.po ...

随机推荐

  1. 洛谷P4012 深海机器人问题(费用流)

    题目描述 深海资源考察探险队的潜艇将到达深海的海底进行科学考察. 潜艇内有多个深海机器人.潜艇到达深海海底后,深海机器人将离开潜艇向预定目标移动. 深海机器人在移动中还必须沿途采集海底生物标本.沿途生 ...

  2. jQuery对象与DOM对象的区别

    如何判断一个js对象是否一个DOM对象 我们在写js代码时有时需要判断某个对象是不是DOM对象,然后再进行后续的操作,这里我给出一种兼容各大浏览器,同时又算是比较稳妥的一种方法. 要判断一个对象是否D ...

  3. 将百度百科的机器学习词条中的一段关于机器学习的demo改用Java写了一遍

    这是引用的百度百科中关于机器学习的一段示例,讲述了通过环境影响来进行学习的例子. 下面是代码: import java.io.BufferedReader; import java.io.IOExce ...

  4. Python 之 PyCharm使用

    PyCharm  的官方网站地址是:https://www.jetbrains.com/pycharm/download/ 教育版:https://www.jetbrains.com/pycharm- ...

  5. dedecms 添加自定义图字段,调用时出错

    1:发现问题 按照以往一样高兴的认为网站就绪了,谁知道出现一个小插曲. 使用dedecms 的站长们应该知道,当一个模型的字段的不能够满足我们项目的需求的时候就会自己创建一些字段,哈今天我就遇到了耶, ...

  6. 速学JavaScript!

    什么是JavaScript? JavaScript是一种轻量级的脚本语言,也是一种嵌入式语言,是一种对象模型语言,简称JS:JavaScript的核心语法部分(语言本身)很精简,只包括两个部分: 基本 ...

  7. MySQL---Day2

    -- 转载:http://www.cnblogs.com/yuanchenqi/articles/6357507.html CREATE TABLE employee1( id TINYINT PRI ...

  8. adb屏幕截屏

    import subprocess #执行结果使用管道输出,对于参数是字符串,需要指定shell=Trueprocess = subprocess.Popen('adb shell screencap ...

  9. 为什么在index.jsp里面引入了common.js,在item-add.jsp以及其他一些jsp文件里面就不需要引入common.jsne ?

    那是因为,index.jsp页面的根节点是body,hrml.是一个完整的网页.那我们再看item-add.jsp页面,他节点是div,只是一个html的片段,并不是一个完整的网页,在easyUI中, ...

  10. [学习笔记] CS131 Computer Vision: Foundations and Applications:Lecture 3 线性代数初步

    向量和矩阵 什么是矩阵/向量? Vectors and matrix are just collections of ordered numbers that represent something: ...