写起来像是下面这种结构(带标签的模板字符串)
const pointA = { x: 100, y: 300 }
const pointB = { x: -100, y: 500 }
const pointC = { x: 400, y: 0 }
const point1 = calc`${pointA} + ${pointB} + ${pointC}`
const point2 = calc`(${pointA} + ${pointB}) * 3 / (${pointA} + ${pointC}) - ${pointA}`
其中 calc
定义了操作符如何计算,本质上就是通过 带标签的模板字符串
的特性匹配字符串
之前一个项目中包含大量坐标运算,直接解构计算的话代码臃肿;封装成函数调用的话复杂的计算又变得难以理解。所以就想了这样的一个土办法
简单封装下 tagged-operator 源码
通过 tagged-operator
定义 calc
import { createTag } from 'tagged-operator'
const precedence = { 1: ['*', '/'] }
const operator = (operator, val1, val2) => {
// operator 当前操作符, val1 操作符左边待计算值, val2 操作符右边待计算值
// 根据这三个参数就可以定义如何计算了
}
const calc = createTag({ operator, precedence })
这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。
V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。
V2EX is a community of developers, designers and creative people.