项目地址: u.js
核心是对js中一些基础的数据结构和函数作了整理, 这些也都是编程中的基本概念, 原则上对于其他语言也适用.
核心代码位于u/u.js中. 从头开始看, 首先是获取全局对象的代码, 这段代码来源于网络, 现代js可以直接使用globalThis获取, 不过对于各种不同环境, 这种老式的代码兼容性更好. 全局对象的主要作用是提供一个最短的挂载点, 方便引用, 因此不是必须的, 也可以使用模块化的方式引用.
之后是console.log方法的别名, 因为这个方法很常用, 所以希望以最简短的方式引用到. console.log方法可以接收多个参数, 却没有返回值, 只有副作用. 因此也增加了一个只接受一个参数然后返回参数本身的log方法, 方便在链式调用中插入输出点. 例如: Promise.resolve([]).then(o).then(u.t)
之后是顶层的u函数. 为便于将来替换内部实现, 用一个三参数的空方法对其进行了包装. 全库中设计函数参数个数不会超过三个,因此最多只使用了三参数函数的声明, 没有用到参数扩展. 目前实现的顶层方法是判断参数类型. 对于基础类型使用typeof的返回值, 对于对象使用Object.prototype.toString的返回值, 并且全部转为小写以便统一判断.
之后是几个全局方法. u.en用于Object.entries, Object.fromEntries, Object.keys, Object.values 等方法. 同时也加入了反转对象键值的功能.
u.t方法用于转换字符串, 用于各种类型和字符串之间相互转化, 还可以添加更多自定义类型的转换方法.
关于方法的命名, 项目文档中做了一些解释, 选取字形美观的单字母作名字. 以i t e n四个字母为主. i一般用于info或item方法, t用于to方法, e用于edit方法, n用于返回number的find方法.
核心方法也是在字符串和数组原型上加上了这四个方法, 将原有的原型方法整理合并到这四个方法的调用中, 通过判断参数的类型, 以及一些标识值, 进行调用.
从日常开发的业务实践来看, 增删改查方法是一般业务的重点. 但是从比例来看, 多数都是各种查询, 增删改可以合并为修改. 从关系理论来说,关系的三种基本运算是选择,投影,连接.选择类似数组的filter或find方法. 投影类似map方法. 而连接是对数组的一些zip变换. 从各方面来看, 将数组方法分成四种基本类别是可行的. 减少了书写和记忆负担, 也不会造成太大的混淆. 字符串的方法参照数组方法处理, 但是join和split方法都放在t函数里.
有一些简单的规则可以帮助记忆, 数组传递函数作为参数的, i t e n 分别会调用reduce map forEach filter方法. 字符串传递正则作为参数的, i t e n 分别会调用 test split replace match方法. 如果给n同时传递1作为标识值,, 则调用search方法.
然后是两个简写, mt代表Math, tm代表time, 是对数学和时间的一些常用方法进行整理.
dom相关部分位于u/web.js中, 常用的方法是放在Element的原型上. 并且只使用了i用于属性操作, n用于查找. 由于dom元素更多的是围绕html节点和css样式, 因此把这两类操作合并到了h和s方法下.代表html和style.
除此之外, 开发中常用的高频刚需操作还有网络请求和存储. 前端所涉及的一般是简单的键值存储, 使用localStorage足以应对. 特殊要求要使用复杂数据存储的也封装了indexedDB的操作方法, 当然也只是用于键值存储的场合, 使用上尽量简单. 网络请求主要使用get方法, 由于post请求也很常见, 因此也增加了简写方法fet. api保持一致, 三个参数分别为路径, 数据和选项. 底层实现可以用fetch或xhr, 或者各平台特有的方法, 如小程序的request等. 路径跳转与网络请求方法参数格式保持一致.
虽然保持简单, 却没有限制添加自定义方法和实现. 比如在各种框架之上加一个轻量的统一层. 之前各前端框架常用传递选项对象的方式, 但是对象参数却不一致, 因此可以自己定义一个参数规范, 在通过适配函数转成各个框架要求的格式.
使用上可以参照张鑫旭的方式, 将代码直接复制到项目中, 可以根据项目要求定制使用.
