- 本文参加了由公众号@若川视野 发起的每周源码共读活动， 点击了解详情一起参与。
- 这是源码共读的第# 第33期，链接：juejin.cn/post/710021…
源码功能
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];
}
思维导图
package.json
package的配置项：
- script：定义包的脚本，使用npm run + “定义脚本“，可以运行当前项目
- bin:添加可执行全局脚本，可以自定义全局命令名称，全局下载包后，在命令行中使用自定义脚本运行项目
- type： 包的模块化规范，不设置是默认commonjs规范
- main：包的入口文件，browser和node环境都可以使用
- module: 包的入口文件，定义npm包的ESM规范文件，browser和node环境都可以使用，
- browser：定义npm包在browser环境的入口
- 同时使用main、module、browser配置，构建工具构建后，模块加载顺序browser+mjs> module >browser+cjs >main
- exports: 定义npm包的导出，可以全部导出，按引入方式导出，按环境类型引入，exports优先级高，高于main、file、browser、module优先级
- peerDependencies:理解为npm包安装的前置依赖条件，配置为npm包核心依赖包，可以解决核心依赖包重复安装问题。
Symbol
Symbol是es6原生提供的新的基本数据类型，生成一个唯一值，用在对象中作为唯一属性。
Symbol的特性：
- Symnol是基本数据类型，直接调用生成变量Symbol(),不可以使用new来调用
- Symbol生成的值是唯一的，使用相同描述重复声明的两个Symbol变量不相等
- Object.getOwnPropertyNames()获取对象属性名，会忽略Symbol值的属性名，可以通过Object.getOwnPropertySymbols()方法获取symbol值的属性
- JSON.tringfy()序列化会忽略Symbol为属性名的属性
- Object.keys(),for...of,for...in 循环中会跳过Symbol值的属性
- ES6 有很多内置方法使用Symbol类型为属性名
迭代器和生成器
Iterator
Iterator概念
Iterator是一种机制，为不同的数据结构提供统一访问的机制。使用[Symbol.iterator]属性实现，返回一个迭代器。已部署iterator接扣的数据结构，可以使用for..of遍历。
[Symbol.iterator]是一个函数，返回一个迭代器，可以自定义函数，指定数据结构的迭代顺序。
已部署iterator接口的数据结构，在以下语法里，自动调用
- for...of
- ...扩展运算符
- [...arr]解构运算
- yeild* ： 后面跟的是一个可遍历结构，它会调用该结构的遍历器接口
- Array.from()
- Map()/Set()/WeakMap()/WeakSet()
- Promise.all()
- Promise.race()
ES6原生提供的可迭代数据结构有
- Array
- Map
- Set
- String
- TypeArray
- 函数的arguments对象
- NodeList对象 类数组对象可以使用Array.from()方法转换为数组，使用for...of
for...of与其他遍历方法的区别
- for...of只能遍历已部署[Symbol.iterator]接口的数据结构，不能遍历对象
- for...of、for循环、for...in可以跳出循环，map、forEach等数组迭代方法不可以跳出循环
- for..of循环，获取的是每一项的value，for...in获取的是每一项的key
