源码共读，第33期 | arrify 转数组

清浅吖
97 阅读3分钟

前言

image.png

想要学习的知识点

  1. 项目目录中各文件所存在的意义
  2. package.json的详细了解
  3. 学习 Symbol.iterator 的使用场景

效果检测（输出物）

  1. 解决当前自己项目中LF格式问题

源码阅读

  1. 使用场景？
    • 传入任意数据都返回数组形式的数据；
  2. 代码目录部分
    • .editorconfig
      • 规定项目的编码规范，项目配置高于编辑器配置
      • 项目中.editorconfig 文件中定义了 end_of_line = lf，若是没生效，需要以下步骤
        • vscode 安装 EditorConfig for vs code 插件
        • 在要格式化的页面手动 alt+shift+f 格式化
      • root = true
        • 根目录的配置文件，编辑器会由当前目录向上查找，如果找到 roor = true 的文件，则不再查找
    • .gitattributes
      • 使用场景：当多人协作项目，尾序列不同时用
      • 目的：
        • 确保文件行尾序列符合一致，在 windows 下行尾序列为 CRLF 而在 mac 和 linux 则是 LF。行尾序列不同在某些 Eslint 规则下会显示报错，这是为了规范你的代码。
        • 避免 git 提交记录莫名差异，例如从仓库下拉取了一个项目，更改了一个某一个文件的内容发现不对又撤销了，但是因为系统不同行尾序列已经发生了变更，git 会显示这个文件的差异。
      • 具体的使用方法参考文章末尾链接
    • .gitignore
      • 指定哪些文件不被git管理，git commit不会提交这些文件
      • 常见的如node_modules/ yarn.lock package-lock.json yarn-error.log*等
      • 可以在文件中用#做注释
    • .npmrc
      • npm运行时配置文件
      • 设置package-lock=false 表示npm install下载时候不生成package-lock.json文件，默认不配置就会生成lock文件
    • index.d.ts
    • index.js
    • index.test-d.ts
    • license
      • 开源协议
      • MIT License（一般这个协议，比较宽松）
      • 上述协议，表示软件可以随便用，随便改，可免费可收费
      • 彻底的授权，授权后的操作与提供软件的人无关、无责任
    • package.json
      • 包管理文件
    • readme.md
      • 说明文件，一般用来写项目或模块实现功能的用法
    • test.js
      • 测试文件
  3. 代码的实现过程
    • 类型判断（null、undefined、string、array、function）

package.json字段说明

"name": "", # 发布的包名 一般名称 '-'代替驼峰命名
"version": "", # 发布包版本
"description": "", # 项目描述，用于npm官网搜索
"license": "MIT", # 开源协议
"repository": "sindresorhus/arrify", # 代码仓库地址
"funding": "https://github.com/sponsors/sindresorhus",
"author": {
	"name": "",
	"email": "",
	"url": ""
}, # 作者相关信息
"type": "module", # 指定项目的规范，默认是commonjs ，module值es module规范
"exports": "./index.js", # 定义导出入口点
"engines": {
	"node": ">=12"
},# 指定依赖的node版本号
"scripts": {
	"test": "xo && ava && tsd"
},# 执行脚本 一般 npm run xxx
"files": [
	"index.js",
	"index.d.ts"
],# 当别人安装你的包时，所需要安装的文件
"keywords": [], # 在npmjs中显示的关键词，会在搜索的时候被搜索
"devDependencies": {} # 开发环境安装依赖

Symbol.iterator使用场景

  • 是什么： 迭代器属性
  • 使用场景
    • 解构赋值
    • 扩展运算
    • for...of
  • 哪些具有迭代特性
    • Array、Set、Map、String、arguments等类数组
    • 对象有默认的迭代器属性，属性名Symbol.iterator
  • 字符串迭代后是字符分割的数组
  • 迭代器中通过next()执行中会返回value和done表示当前值和迭代状态

总结

  • 解决了项目中一直困扰我的格式化LF和CRLF问题
  • 对项目的一些配置有了更深的理解
  • 了解了判断类型可以结合Symbol.iterator使用

不足

  • ava,tsd,xo不了解
  • 看源码项目的过程中很多地方不知道，查阅资料需要较长时间

参考链接

avatar
文章
阅读
粉丝