【源码共读】Vue3源码 shared 模块下的 38 个工具函数

Vue3的工具函数对比于Vue2的工具函数变化还是很大的，个人感觉主要还是体现在语法上，已经全面拥抱es6了；

对比于工具类的功能变化并没有多少，大多数基本上都是一样的，只是语法上和实现上有略微的区别；

源码地址：

• vue-next
• vue-next/packages/shared/src/index.ts

之前介绍了很多阅读方式，这次就直接跳过了，直接开始阅读源码；

所有工具函数

• makeMap: 生成一个类似于Set的对象，用于判断是否存在某个值
• EMPTY_OBJ: 空对象
• EMPTY_ARR: 空数组
• NOOP: 空函数
• NO: 返回false的函数
• isOn: 判断是否是on开头的事件
• isModelListener: 判断onUpdate开头的字符串
• extend: 合并对象
• remove: 移除数组中的某个值
• hasOwn: 判断对象是否有某个属性
• isArray: 判断是否是数组
• isMap: 判断是否是Map
• isSet: 判断是否是Set
• isDate: 判断是否是Date
• isRegExp: 判断是否是RegExp
• isFunction: 判断是否是函数
• isString: 判断是否是字符串
• isSymbol: 判断是否是Symbol
• isObject: 判断是否是对象
• isPromise: 判断是否是Promise
• objectToString: Object.prototype.toString
• toTypeString: Object.prototype.toString的简写
• toRawType: 获取对象的类型
• isPlainObject: 判断是否是普通对象
• isIntegerKey: 判断是否是整数key
• isReservedProp: 判断是否是保留属性
• isBuiltInDirective: 判断是否是内置指令
• camelize: 将字符串转换为驼峰
• hyphenate: 将字符串转换为连字符
• capitalize: 将字符串首字母大写
• toHandlerKey: 将字符串转换为事件处理的key
• hasChanged: 判断两个值是否相等
• invokeArrayFns: 调用数组中的函数
• def: 定义对象的属性
• looseToNumber: 将字符串转换为数字
• toNumber: 将字符串转换为数字
• getGlobalThis: 获取全局对象
• genPropsAccessExp: 生成props的访问表达式

这其中有大部分和Vue2的工具函数是一样的，还有数据类型的判断，使用的是同一种方式，因为有了之前Vue2的阅读经验，所以这次快速阅读；

如果想要详细的可以看我之前写的文章：【源码共读】Vue2源码 shared 模块中的36个实用工具函数分析;

而且这次是直接源码，ts版本的，不再处理成js，所以直接阅读ts源码；

正式开始

makeMap

export function makeMap( str: string,expectsLowerCase?: boolean ): (key: string) => boolean {const map: Record<string, boolean> = Object.create(null)const list: Array<string> = str.split(',')for (let i = 0; i < list.length; i&