位置: 编程技术 - 正文

理解javascript中Map代替循环(javascript的理解)

编辑:rootadmin

推荐整理分享理解javascript中Map代替循环(javascript的理解),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:javascriptmdn,javascriptmdn,javascriptmdn,javascript深入理解,javascript的理解,javascript的理解,javascriptmdn,javascript什么用,内容如对您有帮助,希望把文章链接给更多的朋友!

本文介绍了map给我们的js编程带来的好处及便利:1.Map能干什么map可以实现for循环的功能:

这里的好处是,我们可以随意在map里面写函数,这样的话代码可读性会大大提高,如下:

2.Map的兼容性ECMAScript 5 标准定义了原生的 map() 方法,所以浏览器兼容性较好。如果你想在 IE 9 之前的版本中使用,就需要引入一个 polyfill 或使用 Underscore、Lodash 之类的库了。3.map和for哪个快当然,使用for会比map快点,但是差别不是很大,如果对性能要求没有到极致的地步,这点性能差别可以忽略。

如今,在程序员学习过程中基本都会发现一个叫 map 的函数。在发现 map 函数之前,你可能都会使用 for 循环来处理需要多次执行某一行为的场景。一般情况下,在这个循环过程中都会伴随一些数据变换。

命令式

例如,你团队的销售人员交给你一个很长的电邮地址列表。这些邮箱地址获取的时候并没有经过很好地校验,以至于有些是大写的,有些是小写的,还有一些是大小写混合的。使用 for 循环进行数据处理的代码如下:

这样的做法是有效的,但却把一个实际上简单常见的操作变得复杂。使用 for 循环的函数牵扯了很多不必要的细节。一些痛点如下:

需要让程序创建一个临时列表来存储复制的邮件地址值。 需要让程序先计算列表的长度,以此为次数访问一遍列表。 需要让程序创建一个计数器用来记录当前访问的位置。 需要告诉程序计数的方向,但顺序在这里并不重要。

这是命令式的编程方法。我们似乎在口述给电脑该怎么做这件事。

困惑

为了使之前的代码更加清晰整洁,我们改用 map 函数。在任何 map 函数的说明文档中,我们都会看到诸如 “array”、“each”、“index”之类的词。这表明,我们可以把 map 当做不那么“隆重”的 for 循环使用,事实上也是可行的。现在来修改一下之前的代码:

这样写不仅能用,而且代码比使用 for 循环更加清楚。除了代码量更少,我们也不用再告诉程序去记录索引和遍历列表的方向了。

理解javascript中Map代替循环(javascript的理解)

然而,这还不够好。这样写还是命令式的编程。我们还是指挥的太多。实际上我们牵涉了很多不必要的细节,似乎都在领着程序的手走每一步。

声明式

我们需要改变我们关于数据变换的思考方式。我们不需要想着:“电脑啊,我需要你取出列表中第一个元素,然后把它转换成小写,再存储到另一个列表中,最后返回这个列表”。相反,我们应该这样想:“电脑,我这有一个混合了大小写的邮件地址列表,而我需要一个全是小写的邮件地址列表,这是一个能够进行小写转换的函数”。

毫无疑问,这种写法更易懂,同时这才是程序的本质:把你的想法告诉其他人,这个人可能是别的程序员或未来的你。上面的代码在说“有效的数据是使用小写转换函数映射后的邮箱列表”。

使用类似这样的高级方式传递想法是函数式编程的核心原则,而我们就在这样做。将单一功能、易于理解的简单部分组合起来,由此构建复杂程序。

这样的写法还有些额外的好处。下表的排序不分先后:

小写转换函数提供了最简化的接口:单值输入,单值输出。 能够改动的地方不多,所以逻辑更易于理解,也易于测试,而且不易出错。 逻辑单一,所以易于复用,并且与其他函数能够组合出更复杂的功能。 沿这样的声明式编程路线走的话,代码量会显著缩小。

虽然给 map 的第一个参数传入匿名函数很常见,还是建议把函数提出来并合理命名。这能够帮你记录下写此函数的意图,这样别的开发者就能通过函数名了解功能而不用再费劲分析代码了。

浏览器支持情况

ECMAScript 5 标准定义了原生的 map() 方法,所以浏览器兼容性较好。如果你想在 IE 9 之前的版本中使用,就需要引入一个 polyfill 或使用 Underscore、Lodash 之类的库了。

性能表现

极大多数情况下,在实际编码中 map 函数和 for 循环之间没有明显的性能差距。for 循环稍快一些,但如果你不是在写图形或物理引擎的话,这点差距没必要去考虑,当然即使如此,除非能够确定这些性能的提升对你有帮助,否则用这种方式去优化意义不大。

总结

将逻辑分成单一功能的方法并应用于数据结构上,这种编程方法会让你的代码更准确、鲁棒和易于理解。我们的理念就是尽可能通用,通用能够帮助代码重用。学习这种思考方法,不仅能帮助你提高 Javascript 水平,也能体现在其他多数编程语言上,例如 Ruby 和 Haskell。

所以,下一次当你要使用 for 循环时,重新考虑一下。记住,你要处理的数据并不一定是普通的数组,你可以去处理对象,取出它的值,再使用函数去映射,最后整理出结果数组。

标签: javascript的理解

本文链接地址:https://www.jiuchutong.com/biancheng/378982.html 转载请保留说明!

上一篇:JS实现随页面滚动显示/隐藏窗口固定位置元素(js实现滚动条)

下一篇:超实用的JavaScript表单代码段(超实用的八个开车技巧)

  • 外国驻华使领馆自用车辆
  • 总公司和子公司可以有业务往来吗
  • 半成品怎么结转到成品
  • 预提车间租入固定资产租金800元
  • 调整账户和被调整账户的关系
  • 代理服务费收取标准
  • 固定资产没收到发票收到实物入账有什么风险
  • 迟延履行利息记什么科目?
  • 老板找人替我工作说明了什么
  • 母公司名称的发票可以计入子公司的开办费处理吗?
  • 企业所得税预缴可以不交吗
  • 一般纳税人当月只有进项没有销项怎么做账
  • 企业应缴的教育费附加税是多少?
  • a公司拟吸收合并b公司除一项无形资产吗
  • 所得税退费怎么操作
  • 物业维修收费合理吗
  • 年终奖个人所得税怎么扣
  • 政府采购 汽车
  • 合伙企业税收优惠政策2023
  • 劳务服务公司可以承包大型工程吗?
  • 收到存款利息收入
  • win7显示更新失败怎么办啊
  • PHP+jQuery+Ajax实现分页效果 jPaginate插件的应用
  • php中字符串函数
  • 预付款指的是
  • 股票印花税和佣金的关系
  • thinkphp5教程
  • 补差价如何做账
  • vue调用同一个组件
  • 出口退税的一般程序
  • mysql5.7分区表
  • 台账如何做到表中分好几个表
  • 侵权赔偿补偿金如何计算
  • 纳税人识别号和公司税号一样吗
  • 购入交易性金融资产的相关税费计入
  • 保税区商品可以开发票吗
  • 所得税汇算清缴调整后要账务处理吗
  • 主营业务收入净额在哪个报表里面
  • 长期股权投资的账务处理
  • 小规模无票收入纳税申报表怎么填
  • 销售货物物流运输丢失取得赔偿款需要缴纳企业所得税吗
  • 教育局给幼儿园的补贴
  • 如何降低未分配利润的方法
  • 现金短缺无法查明计入什么科目
  • 2021劳动报酬收入个人所得税怎么算
  • 固定资产错记到费用了怎么办
  • 税务稽查其他应付款
  • 会计制度和会计准则科目转换
  • 登记三栏式现金日记账和银行存款日记账的依据
  • 哪些会计凭证可以抵扣进项税
  • 在sql中使用where子句指出的是
  • win7系统管理在哪
  • 官方发布预防新冠戴口罩指引
  • windows 7的用户类型
  • win8怎么彻底删除软件
  • flash是什么文件夹
  • windows8 如何关机
  • 十个常用linux脚本命令
  • win7旗舰版系统还原无法启动
  • unity3d ide
  • nodejs的require
  • [置顶] rwmfqg
  • Unity3D游戏开发培训课程大纲
  • 各种常用的js函数有哪些
  • react和nodejs
  • unity uma
  • js面向对象的原理
  • 谷歌邮箱
  • 网页js识别设备的唯一性
  • java中主要使用unicode编码方式
  • javascript的介绍
  • python字符串字符对应个数
  • 江苏国税电子税务局打印控件
  • 国家税务总局山西省电子税务局
  • 税务咨询电话是什么
  • 大连个体营业执照怎么办
  • 山西税务服务热线号码
  • 江苏高速通行费标准
  • 一般纳税人忘记报税一个月罚多少钱
  • 国税发票什么意思
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设