【第33期】| 20组 | arrify 转数组

本文参加了由公众号@若川视野 发起的每周源码共读活动，点击了解详情一起参与。

本期要阅读的源码：arrify。

export default function arrify(value) {
  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];
  }
  return [value];
}

源码分析

将传入的数据转化为数组

• 判断value为null或undefined，返回空数组
• 判断value为数组，返回value
• 判断value为string，返回长度为一，首项为value的数组
• 判断value是否具有[Symbol.iterator]方法，该方法为对象定义了默认的迭代器，该迭代器可以被for...of循环使用。Array、String拥有默认的迭代器，所以在此判断前进行判断。
• 其它则返回长度为一，首项为value的数组，例如Object。

知识点

Symbol.iterator

包含Symbol.iterator属性的对象为可迭代对象，Symbol.iterator是一个特殊的内置符号，它的值是一个返回迭代器的方法。我们可以根据它创建自定义的迭代器：

var myIterable = {}
myIterable[Symbol.iterator] = function* () {
    yield 1;
    yield 2;
    yield 3;
};
[...myIterable] // [1, 2, 3]

使用场景：for...of，Array.from(),扩展运算符等。

收获

了解到了Symbol.iterator的场景，当以后需要使用遍历对象数据的时候，可以通过创建自定义迭代器来使用for...of完成（使用forEach无法终止）。