数组上循环

for

  1. for(let i = 0; i < list.length; i++) {...}

retrun 跟 break 的区别

在单层循环中两者效果一致,都会跳出循环,区别在于 return 必须放在函数中,而break不用。
在多层循环中 return 是直接终止跳出循环,而break这是终止最里面一层的循环。
注:无视if层级, 以上也规则for 、for…in 、for…of都适用

forEach

  1. array.forEach(function(item, index, arr){...}, thisValue)

item: 当前项的值
index:当前项的索引
arr: 当前循环的数组
thisValue: 第二个参数,可以用来绑定第一个参数function中的this指向,前提是第一参的function不能是箭头函数
特点:

  • 如果当前值时引用类型,对其进行操作是会改变原数组的,如果是基本类型就不会,没有返回值
  • 无法使用break,continue跳出循环,使用return时效果和for循环使用continue一致
  • 不能用于遍历对象,仅适用于数组的遍历
  • 可以遍历出symbol

    for of

    1. for(variable of iterable) {....}

    variable: 每个迭代的属性分配给该变量(给的是值)
    iterable: 一个具有可枚举属性并且可迭代的对象(该对象须具有迭代器)
    特点:

  • for of方法只会遍历当前对象的属性,不会遍历其原型链上的属性

  • for of 方法只适用于遍历【数组|类数组|字符串|Map|Set】等拥有迭代器对象的集合
  • for of不支持遍历普通对象,因为普通对象没有迭代器,如果要遍历普通对象可以使用for in
  • 可以使用break,continue,return来中断跳出循环

    map

    1. array.map(function(item. index, arrr){...}, thisValue)

    特点:

  • 不会改变原数组,返回值为一个与循环数组数量相等的新数组

  • 当item值是一个对象是所谓的不会改变仅是对第一层的key进行操作不会改原数组数据,如果对第二次以上的数据进行操作是会修改原数组数据的
  • 不能用于遍历对象,仅适用于数组的遍历
  • 循环无法被中断,使用return会将返回的值放入新生成的数组,并进入下一个循环

    filter

    1. array.filter(function(item, index, arr){...}, thisValue)

    特点:

  • 不会改变原数组,返回值为一个通过条件过滤后的数组,

  • 当item为引用类型只是对齐进行浅拷贝
  • 不能用于遍历对象,仅适用于数组的遍历
  • 循环无法被中断,使用return 返回的值为true则当前循环对应的值放入新数组,否则被过滤掉

    some

    1. array.some(function(item, index, arr){...}, thisValue)

    方法会对数组的每一项进行遍历,只要有一项返回值为true则返回true,且剩下的项不在进行遍历
    特点:

  • 不会改变原数组,返回值为一个布尔值

  • 不能用于遍历对象,仅适用于数组的遍历
  • 当循环中有一个返回值为true时则循环被中断

    every

    1. array.every(function(item, index, arr) {...}, thisValue)

    方法会对数组的每一项进行遍历,只要有一项的返回值为false则返回false,且剩下的项不在进行遍历
    特点:

  • 不会改变原数组,返回值为一个布尔值

  • 不能用于遍历对象,仅适用于数组的遍历
  • 当循环中有一个返回值为false时则循环被中断

    reduce

    1. array.reduce(function(total, item, index, arr) {...}, initValue)

    方法会对数组的每一项进行遍历,并最后将计算的结果返回
    total:计算的累加值
    item: 当前循环对应的数组的值
    index: 当前循环对应的索引值
    arr: 进行循环的数组
    initValue: 初始值
    特点:

  • 不会改变原数组(如果item是引用类型同时还对item中的key进行操作的话是会影响原数组数据的),返回值为在第一参计算后的结果

  • 如果不提供第二参初始值则在进行循环时会跳过第一项从第二项开始循环,且将第一项作为初始值
  • 如果不提供第二参初始值且要计算的数组为空时则会报错
  • 在每次循环需要对计算后的结果进行return

    reduceRight

    功能与reduce一致不过他是反过来遍历的

    find

    1. array.find(function(item, index, arr) {...}, thisValue)

    方法会按顺序遍历数组,根据第一参的函数条件返回符合要求第一个元素,并且终止循环不在向下遍历,如果找不到则返回undefined

    findIndex

    1. array.findIndex(function(item, index, arr) {...}, thisValue)

    方法会按顺序遍历数组,根据第一参的函数条件返回符合要求第一个元素的索引值,并且终止循环不在向下遍历,如果找不到则返回index

    keys()、values()、entries()

    1. array.keys()
    2. array.values()
    3. array.entries()

    这三个方法都没有参数
    keys:返回数组的index组迭代器
    values:返回数组的value组迭代器
    entries:返回一个二维数组值数组的第一项是索引第二项是对应的值(迭代器)

    对象上的循环

    for in

    1. for(let key in obj) {...}

    主要用于循环对象可枚举的key属性
    特点:

  • 如果key类型是Symbol则会自动跳过

  • 不仅会循环出可当前对象的可枚举非Symbol的key也会循环出原型链上可枚举的key

    Object.keys、Object.values、Object.entries

    1. Object.keys(obj)
    2. Object.values(obj)
    3. Object.entries(obj)

    这三个方法会返回对象自身的可枚举属性(不含Symbol和继承的属性)组成的数组,key的顺序和正常遍历对象的key顺序一致
    特点:

  • 获得的数组项对应的key都是对象本身的可枚举且key值不为Symbol,且不是通过继承获得的

  • 通过keys转化出来的key数组值都是字符串,如果本身是数字key也会转成字符串

注:

  1. for…in 跟Object.keys同样是将对象中的key拎出来,但Object.keys是不会去那对象原型链上的key的,而for…in是会将自身及原型上的可枚举key都拿出来
  2. 数组中的symbol元素可以通过循环方法都可以遍历出来,普通对象中的以symbol为键的需要getOwnPropertySymbol 或是 Reflect.ownKeys 才可以遍历出来

    Object.getOwnPropertyNames

    与Object.keys类似,返回对象自身的可枚举以及不可枚举的属性(不包含Symbol,不包含继承的属性和方法)
    特点:
  • 返回的key值数组都值都是字符串形式

    Object.getOwnPropertySymbols

    方法返回对象自身的Symbol key属性(包含可枚举以及不可枚举的Symbol key)不包含字符串,数字的属性
    特点:

  • 返回的数组中只有Symbol组成的key,无论这个key是否可枚举

  • Symbol本身默认是可枚举的

    Reflect.ownKeys

    方法会返回对象自身所有key,相当于Object.getOwnPropertyNames(obj).cancat(Object.getOwnPropertySymbols(obj))
    特点: ```
  • 无论是symbol key 或是可枚举不可枚举都会一起返回
    1. <a name="76789770"></a>
    2. ### for await of
    3. 支持异步的迭代器, 需要放到async修饰的方法中
    4. ```javascript
    5. async function getData() {
    6. const asyncList = [Gen(1), Gen(2), Gen(3)]
    7. for await (let func of asyncList) {
    8. console.log(func) // 异步resolve的结果
    9. }
    10. }