一般一说到源码，头就大；但是当自己慢慢地从简单的源码开始阅读的时候，才发现源码并不是什么特别可怕的时；说简单点，源码其实就类似于自己做项目时写的代码一样，只是较为出名的源码比我们自己写的更为巧妙，更优雅，更简洁等；一旦当我们读的多了，总结多了，自己慢慢地也会写出一些优雅巧妙的代码，加油！

arraify

arraify源码连接

阅读源码第一步——克隆源码

git clone https://github.com/sindresorhus/arrify.git

阅读源码第二步——看readme文档

这一步主要是明白该源码是用来干什么的以及怎么使用；
arrify的read.me很简单：Convert a value to an array即把给定的值转化为一个数组。
具体使用方法：

import arrify from 'arrify';

arrify('🦄');
//=> ['🦄']

arrify(['🦄']);
//=> ['🦄']

arrify(new Set(['🦄']));
//=> ['🦄']

arrify(null);
//=> []

arrify(undefined);
//=> []

阅读第三步——思考🤔

这里根据用处和用法，我马上就想到了转换为数组的几种方法：

标题	使用场景
Array.from()	1、类似数组的对象；2、可遍历的对象
扩展运算符	1、获取函数参数的arguments参数对象；2、DOM操作的NodeList
split()	分割字符串成数组
Array.of()	将一组值转换为数组

结合arrify的用法，可以看出它有以下的功能：

若参数是字符串时，直接将该字符串作为数组的第一个元素返回；
若参数本身时数组，直接返回；
若参数时可迭代对象，浅拷贝迭代值创建新数组；
弱参数为null或undefined，返回的是空数组。

阅读第四步———看package.json文件，找入口文件

arrify的入口文件是index.js；源码如下：

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];        
}

从源码可以看出，是根据参数的类型来分别进行转换的；这里比较巧妙的是可迭代对象的判断，利用typeof value[Symbol.iterator] === 'function'来判断是否是可迭代对象。至于什么是可迭代对象，可点击查看可迭代对象

最后———开始调试测试用例

点击开始测试

"scripts": { 
"test": "xo && ava && tsd" 
},

总结

当前类型是否实现了 Symbol.iterator 来判断当前数据是否可扩展；

记最简单的一次源码阅读——arrify转数组