良许Linux教程网 干货合集 解析arrify 转数组实现示例源码

解析arrify 转数组实现示例源码

这篇文章主要为大家介绍了arrify 转数组实现示例源码解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪

学习目标

分析 arrify 函数的源码

通过测试用例调试源码

学习 Symbol.iterator 的使用场景

其它的可迭代对象

拉取源码

进入到 arrify 仓库下,使用 CodeSpace 克隆一份项目。

项目目录如图:

解析arrify 转数组实现示例源码解析arrify 转数组实现示例源码
解析arrify 转数组实现示例源码解析arrify 转数组实现示例源码

忽略掉一些配置文件,各个文件的功能如下:

index.js是整个项目的入口,负责对外导出arrify函数

index.d.ts是arrify函数的TS类型描述文件

test.js是测试用例

分析源码

arrify函数可以接受一个值,并返回一个包含该值的数组,根据传入不同类型的值返回不同的结果。

export default function arrify(value) {
        // 如果传入的值是 null 或 undefined,函数会返回一个空数组。
    if (value === null || value === undefined) {
        return [];
    }
        // 如果传入的值本身就是一个数组,函数会直接返回这个数组
    if (Array.isArray(value)) {
        return value;
    }
        // 如果传入的值是一个字符串,函数会返回一个包含该字符串的数组。
    if (typeof value === 'string') {
        return [value];
    }
        // 如果传入的值是一个可迭代对象,函数会返回一个包含该对象所有元素的数组。
    if (typeof value[Symbol.iterator] === 'function') {
        return [...value];
    }
        // 如果传入的值既不是 null/undefined,也不是一个数组/字符串/可迭代对象,函数会返回一个包含该值的数组。
    return [value];
}

Symbol.iterator 的使用场景

Symbol.iterator 是 JavaScript 中的一个内置 Symbol,它用于定义一个对象的默认迭代器。当一个对象被用于 for…of 循环或者解构赋值时,会自动调用它的 Symbol.iterator 方法。

举个例子,假设你有一个数组,你可以使用 Symbol.iterator 方法来定义如何遍历这个数组:

const numbers = [1, 2, 3];
numbers[Symbol.iterator] = function() {
  let i = 0;
  return {
    next: function() {
      return {
        value: numbers[i] + 1,
        done: i++ === numbers.length
      };
    }
  };
};
for (const num of numbers) {
  console.log(num);
}

上面的代码定义了一个数组 numbers,并为它定义了一个 Symbol.iterator 方法,这个方法返回一个迭代器对象,这个对象的 next 方法返回数组的下一个元素。然后我们使用 for…of 循环来遍历这个数组,循环会自动调用 numbers 的 Symbol.iterator 方法来获取每个元素+1后的值。

上面代码执行的执行结果:

解析arrify 转数组实现示例源码解析arrify 转数组实现示例源码
解析arrify 转数组实现示例源码解析arrify 转数组实现示例源码

可见我们更改了 array 的默认迭代器。

具有默认的迭代器函数的对象

这些对象能够被 for…of 循环遍历

数组

字符串

Map(Map)

Set(Set)

总之,一个数据结构如果具有Symbol.iterator属性,这个对象就可以被for…of遍历它的成员。我们理解iteration的原理可以更好使用js提供的数据结构,必要时还可以改造不可迭代的数据结构。

以上就是良许教程网为各位朋友分享的Linu系统相关内容。想要了解更多Linux相关知识记得关注公众号“良许Linux”,或扫描下方二维码进行关注,更多干货等着你 !

137e00002230ad9f26e78-265x300
本文由 良许Linux教程网 发布,可自由转载、引用,但需署名作者且注明文章出处。如转载至微信公众号,请在文末添加作者公众号二维码。
良许

作者: 良许

良许,世界500强企业Linux开发工程师,公众号【良许Linux】的作者,全网拥有超30W粉丝。个人标签:创业者,CSDN学院讲师,副业达人,流量玩家,摄影爱好者。
上一篇
下一篇

发表评论

联系我们

联系我们

公众号:良许Linux

在线咨询: QQ交谈

邮箱: yychuyu@163.com

关注微信
微信扫一扫关注我们

微信扫一扫关注我们

关注微博
返回顶部