资讯专栏INFORMATION COLUMN

JavaScript 中遍历方法小结

flyer_dev / 378人阅读

摘要:遍历方法小结常用的遍历方法遍历对数组的每个元素执行一次提供的函数创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果遍历大家都熟悉,所以重点讲一下与的区别相同点回调函数参数相同,都自带三个属性均不会修改原数组第二参数的

遍历方法小结 常用的遍历方法

for 遍历

forEach(对数组的每个元素执行一次提供的函数)

map(创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果)

for 遍历大家都熟悉,所以重点讲一下forEachmap 的区别

相同点:

回调函数参数相同,都自带三个属性:item / index / array

均不会修改原数组

第二参数this的指向均指向window(可是使用箭头函数进行修改)

只能遍历数组

都不能使用循环跳出语句 break & continue

不同点:

forEach

返回值为undefined

map

返回值为一个新的数组

可以链式调用

  // 链式调用
  var str = "abcde";
  // 使用call在字符类型中使用map方法
  Array.prototype.map.call(str, function(x) {   
    return x;
  }).reverse().join("");
  // edcba

其他遍历方法

filter (创建一个新数组, 其包含通过所提供函数实现的测试的所有元素)

find (返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined)

every (测试数组的所有元素是否都通过了指定函数的测试)

some (测试是否至少有一个元素通过由提供的函数实现的测试)

【Attention】 
filter 将遍历所有的元素
find & some & every 属于「条件中断」遍历(即当元素满足某一条件是返回boolean)
四个方法都不会对原数组进行修改
ES5 中的for...in 遍历

常用于对象key值的遍历

ES6 引入的遍历方法

for...of 遍历

[ 前置知识:for...of 可对具有iterator接口的数据结构进行遍历 ]

原生具有iterator接口的数据结构如下:

Array

Set

Map

String

TypedArray

NodeList 对象

函数的arguments 对象

keys( ) / values( ) / entries( )

常用来遍历对象、数组、set、map结构

【番外】

改变原数组的方法
pop、push、reverse、shift、sort、splice、unshift

不会改变原数组的方法
concat、join、slice、toString、toLocaleString、indexOf、lastIndexOf

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/102685.html

相关文章

  • JavaScript常用的设计模式

    摘要:本文已同步到中常见的设计模式如果感觉写的还可以,就给个小星星吧,欢迎和收藏。本文中关于各种设计模式定义都是引用书中的,部分引用自百度百科已标出。下面把我整理出的常用设计模式按类型做个表格整理。 本文已同步到Github JavaScript中常见的设计模式,如果感觉写的还可以,就给个小星星吧,欢迎star和收藏。 最近拜读了曾探大神的《JavaScript设计模式与开发实践》,真是醍醐...

    NSFish 评论0 收藏0
  • 高性能JavaScript(文档)

    摘要:最近在全力整理高性能的文档,并重新学习一遍,放在这里方便大家查看并找到自己需要的知识点。 最近在全力整理《高性能JavaScript》的文档,并重新学习一遍,放在这里方便大家查看并找到自己需要的知识点。 前端开发文档 高性能JavaScript 第1章:加载和执行 脚本位置 阻止脚本 无阻塞的脚本 延迟的脚本 动态脚本元素 XMLHTTPRequest脚本注入 推荐的无阻塞模式...

    RayKr 评论0 收藏0
  • 高性能javascript小结

    摘要:高性能小结文章转载于我的博客最近看完了动物丛书的高性能,觉得那本书的小结部分写得非常不错,简洁轻快易懂概括性很强。由于局部变量存在于作用域链的起始位置,因此访问局部变量比访问跨作用域变量更快。 高性能javascript小结 文章转载于我的CSDN博客:http://blog.csdn.net/hello_world_20/article/details/46793317 最近看完了动...

    wujl596 评论0 收藏0
  • JavaScript标准库系列——Object对象和Array对象(一)

    摘要:目录导语对象对象小结导语本系列文章将重点讲解提供的原生库标准库,只要在支持语言的平台,标准库中的提供的对象的属性和方法都能使用对象对象的理解讲的标准库,首先要从对象谈起,因为之后的所有对象都可以看做是对象构造出来的因此,对象可以看做是一个构 目录 导语 1. Object对象 2. Array对象 3. 小结 导语 本系列文章将重点讲解JavaScript提供的原生库——标准库,只要...

    Scholer 评论0 收藏0
  • 【读书笔记】《高性能JavaScript

    摘要:性能访问字面量和局部变量的速度是最快的,访问数组和对象成员相对较慢变量标识符解析过程搜索执行环境的作用域链,查找同名标识符。建议将全局变量存储到局部变量,加快读写速度。优化建议将常用的跨作用域变量存储到局部变量,然后直接访问局部变量。 缺陷 这本书是2010年出版的,这本书谈性能是有时效性的,现在马上就2018年了,这几年前端发展的速度是飞快的,书里面还有一些内容考虑IE6、7、8的东...

    chengjianhua 评论0 收藏0

发表评论

0条评论

flyer_dev

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<