返回顶部
首页 > 资讯 > 前端开发 > 其他 >js map方法是es6的吗
  • 383
分享到

js map方法是es6的吗

mapES6 2023-05-14 21:05:15 383人浏览 泡泡鱼
摘要

本教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。javascript中的map()方法详解(均采用es6语法)JavaScript map() 方法可以对数组的每个元素调用指定的回调函数,并返回包含结果

js map方法是es6的吗

教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。

javascript中的map()方法详解(均采用es6语法)

JavaScript map() 方法可以对数组的每个元素调用指定的回调函数,并返回包含结果的数组。

array.map(function callbackfn (value, index, array), thisArg);

function callbackfn (value, index, array):一个回调函数,最多可接受三个参数:

  • value:数组元素的值。

  • index:数组元素的数字索引

  • array:包含该元素的数组对象。

map() 的返回值是一个新的数组,新数组中的元素为 “原数组调用函数处理过后的值”。对于数组中的每个元素,map() 方法都会调用 callbackfn 函数一次(采用升序索引顺序),并不会为数组中缺少的元素调用回调函数。

简单使用:遍历整个数组,将大于4的元素乘以2

const array = [2, 3, 4, 4, 5, 6]

console.log("array",array)
const map = array.map(x => {
    if (x == 4) {
        return x * 2
    }
    return x
})

console.log("map",map)

输出的结果为:等于4的元素乘以2

1.png

3. map()函数的参数详解

一般参数是一个回调函数

array.map((item,index,arr)=>{
	//item是操作的当前元素
	//index是操作元素的下表
	//arr是需要被操作的元素
	//具体需要哪些参数 就传入那个
})
 const array = [2, 3, 4, 4, 5, 6]
 console.log("原数组array为",array)
 const map2=array.map((item,index,arr)=>{
            console.log("操作的当前元素",item)
            console.log("当前元素下标",index)
            console.log("被操作的元素",arr)
            //对元素乘以2
            return item*2
 })
 console.log("处理之后先产生的数组map",map2)

输出的结果为:

2.png

总结:map()方法经常拿来遍历数组,但是不改变原数组,但是会返回一个新的数组

注意:有时候会出现这种现象,出现几个undefined

 const array = [2, 3, 4, 4, 5, 6]
 console.log("原数组array为",array)
 const map = array.map(x => {
            if (x == 4) {
                return x * 2
            }
  })

3.png

其实,map()方法是对每一项数组进行遍历,遍历一次,返回一个值,给新数组加上一个元素,这是就是满足x=4的元素,只有两个,所以其他项就返回了undefined。

【推荐学习:javascript视频教程】

以上就是js map方法是es6的吗的详细内容,更多请关注编程网其它相关文章!

--结束END--

本文标题: js map方法是es6的吗

本文链接: https://lsjlt.com/news/206521.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • js map方法是es6的吗
    本教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。JavaScript中的map()方法详解(均采用es6语法)JavaScript map() 方法可以对数组的每个元素调用指定的回调函数,并返回包含结果...
    99+
    2023-05-14
    map ES6
  • js map方法是不是es6的
    本文小编为大家详细介绍“js map方法是不是es6的”,内容详细,步骤清晰,细节处理妥当,希望这篇“js map方法是不是es6的”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。map()方法是es6的。在es6...
    99+
    2023-07-04
  • es6的map是有序吗
    本篇内容主要讲解“es6的map是有序吗”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“es6的map是有序吗”吧!map是有序的。ES6中的map类型是一种储存着许多键值对的有序列表,其中的键名...
    99+
    2023-07-04
  • map是不是es6中的方法
    这篇文章主要讲解了“map是不是es6中的方法”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“map是不是es6中的方法”吧! m...
    99+
    2024-04-02
  • es6 map是引用类型吗
    本教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。map是引用类型。es6 map在ES6之前,在JavaScript中实现‘键’=>‘值’,也就是我们常说的键值对,是用Object来完成的。但这种...
    99+
    2023-05-14
    ES6 map
  • js中filter是不是es6的方法
    这篇“js中filter是不是es6的方法”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“j...
    99+
    2024-04-02
  • es6中map对象的遍历方法是什么
    这篇“es6中map对象的遍历方法是什么”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“es...
    99+
    2024-04-02
  • es6中map()方法有什么用
    这篇文章将为大家详细讲解有关es6中map()方法有什么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。 在es6中,map()方法用于对数组...
    99+
    2024-04-02
  • es6 map成员是不是唯一的
    今天小编给大家分享一下es6 map成员是不是唯一的的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。es6 map成员是唯一的...
    99+
    2023-07-04
  • es6 map成员是唯一的么
    本教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。Map和Set都是ES6新增的数据结构Map 类似于对象,key值不限于字符串,成员值唯一。Set 类似于数组,成员值唯一。Map 基本概念ES6 提供了...
    99+
    2022-11-22
    javascript ES6
  • promise是es6的吗
    本教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。ECMAScript 6 增加了对 Promises/A+ 规范的完善支持,即 Promise 类型。一经推出,Promise 就大受欢迎,成为了主导性的...
    99+
    2022-11-22
    ES6 promise
  • es6中map指的是什么意思
    这篇文章将为大家详细讲解有关es6中map指的是什么意思,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。 在es6中,map是一种数据结构,是“...
    99+
    2024-04-02
  • filter是不是es6的方法
    这篇“filter是不是es6的方法”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“filt...
    99+
    2024-04-02
  • js的Map函数使用方法详解
    Map是ES2015引入的Global Object,Map对象中保存了键值对,且任何对象(包括原始值)都可以作为键或者值。 1. 构造函数 Map必须作为构造函数来使用, new ...
    99+
    2024-04-02
  • es6有遍历对象的方法吗
    今天小编给大家分享一下es6有遍历对象的方法吗的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。有,遍历方法:1、“for......
    99+
    2023-07-04
  • es6中map和object的区别是什么
    本教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。Map和Object的概念Object在ECMAScript中,Object是一个特殊的对象。它本身是一个顶级对象,同时还是一个构造函数,可以通过它(如:...
    99+
    2022-11-22
    ES6
  • eval是不是es6中的方法
    本文小编为大家详细介绍“eval是不是es6中的方法”,内容详细,步骤清晰,细节处理妥当,希望这篇“eval是不是es6中的方法”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。 ...
    99+
    2024-04-02
  • 解决JS问题的ES6方法有哪些
    本篇内容介绍了“解决JS问题的ES6方法有哪些”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!1、如何隐藏所...
    99+
    2024-04-02
  • assign是不是es6方法
    这篇文章将为大家详细讲解有关assign是不是es6方法,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。 assign是es6方法。assign...
    99+
    2024-04-02
  • JS中sort方法的升序是a-b吗
    本篇内容主要讲解“JS中sort方法的升序是a-b吗”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“JS中sort方法的升序是a-b吗”吧!简单使用 sort 方法的时候,是按位排序的,比如:&n...
    99+
    2023-06-29
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作