san.js
文章平均质量分 74
san.js mvvm 框架解读
Kinghiee
Front-end Developer
展开
-
san.js源码解读之工具(util)篇——数据校验
createChainableChecker 函数是所有校验函数的基础,它接收一个参数(validate),在后面 checkType 函数中运行。对于简单类型(any、array、object、func、string、number、bool和symbol)校验函数在san中都是使用 createPrimaryTypeChecker 函数传入对应要校验的类型而生成的。处理 DataTypes.string 校验字符串外,san 提供了一系列校验函数(如下),方便开发中使用。需要注意的是san为了考虑性能,原创 2024-01-06 16:16:11 · 1313 阅读 · 0 评论 -
合成事件在san.js中的应用
DOM3 Event 新增了合成事件(CompositionEvent ), 用于处理通常使用 IME 输入时的复杂输入序列。原创 2023-11-18 18:22:27 · 2281 阅读 · 0 评论 -
san.js源码解读之模版解析(parseTemplate)篇——readCall函数
相关文章。原创 2023-10-29 13:51:36 · 3083 阅读 · 0 评论 -
san.js源码解读之模版解析(parseTemplate)篇——readAccessor函数
这里需要了解的是向 paths 数组中推入数据时调用了 readTertiaryExpr ,这是因为在‘[]’中可能有复杂的表达式,里面有变量数值等逻辑,所以需要从头解析。如果符合 ‘true’ 、‘false’和’null’,那么直接返回,后续不执行。当遇到‘[’时,说明是’demo[job]'、‘demo[index?1: 0]’ 、‘demo[‘true’]’等情况,那么执行面的语句。然后对当前访问表达式进行循环匹配,当遇到 ‘.’ 时,说明是‘demo.job’ 这种情况,那么执行下面语句。原创 2023-10-29 10:23:50 · 2075 阅读 · 0 评论 -
san.js源码解读之模版解析(parseTemplate)篇——readIdent函数
这里需要知道的是为啥是match[1] 而不是 match[0] 或者 [2]?完全匹配成功的文本将作为返回数组的第一项,从第二项起,后续每项都对应一个匹配的捕获组。可以简单为正则表达式中使用括号‘()’括起来的就是一个捕获组,在匹配变量名表达式中可以看出([$0-9a-z_]+)是。首先用到了 walk 类中的 match 函数,该函数源码如下(这里不是 walk 类全部代码而是列出了本次用到的代码)match 函数中主要用到了 exec 函数来进行正则表达式匹配,match 函数中需要注意一下几点。原创 2023-10-28 22:28:11 · 1081 阅读 · 0 评论 -
san.js源码解读之工具(util)篇——each函数
但是这个迭代器模式,可能你已经用了很久了只是不知道它的名字罢了。比如 jquery中的 each 函数。如果不了解迭代器模式的话这里贴一篇我之前写过的博客可以看一下。在开始解析源码之前,先来看一下 javascript 设计模式——迭代器模式,如果没有接触过该模式的小伙伴可能一脸疑惑,表示没听说过。,在这里就不多说了。原创 2023-09-18 16:59:56 · 167 阅读 · 0 评论 -
san.js源码解读之工具(util)篇——inherits函数
它的思路是使用原型链继承原型上的属性和方法,使用借用构造函数继承实例属性。从上述代码中可以看出,两个实例(instance1、instance2)操作了同一个父类实例属性,这里只是向里面推入数据,如果有多个实例对该实例共享属性做增删改查,那么最后得出的结果会和预期不符。上面示例中因为只是继承了父类的实例属性和方法,所有父类原型链上的方法和属性时访问不到的。这种继承的最大特点是:在子类构造函数中调用父类构造函数以及子类原型继承父类的实例对象。这种继承的最大特点是:它是寄生式继承+借用构造函数的组合。原创 2023-09-17 17:41:17 · 251 阅读 · 0 评论 -
san.js源码解读之工具(util)篇——nexttick函数
在代码中可以看到 _resolve 函数,这个是怎么实现的呐?大家都知道代码是同步解析,在遇到 callbacks.push 代码时,会向 callbacks 数组中推入匿名函数,但是此时 _resolve 函数为 undefined, 因为没有执行到 callbacks 数组中的函数所有没事也不会报错,接着执行下面代码。flushCallbacks 函数,用来主要执行队列中的函数。执行 timerFunc 函数时,由于里面是有微/宏任务,所以先执行下面的同步任务,到同步任务执行完了之后再执行微/宏任务。原创 2023-09-27 16:32:23 · 416 阅读 · 0 评论 -
san.js源码解读之工具(util)篇——bind函数兼容
这里需要注意的是 bind 需要使用 apply 函数进行调用。因为 bind 必须在函数上调用,如果 nativeBind(func, slice.call(arguments, 1)) 这么传入会报错。判断原 bind 函数是否存在并且和传入函数原型链上的 bind 函数是否相同,如果相同就直接调用原 bind 函数。如果环境中没有 bind 函数,则需要兼容 bind 函数,兼容 bind 函数原理和手写 bind 函数基本一致。获取 bind 和 slice 原函数。原创 2023-09-26 11:13:48 · 286 阅读 · 0 评论 -
san.js源码解读之工具(util)篇——splitStr2Obj函数
【代码】san.js源码解读之工具(util)篇——splitStr2Obj函数。原创 2023-09-26 17:51:36 · 305 阅读 · 0 评论 -
san.js源码解读之工具(util)篇——extend函数
通过 for in 循环 source 对象中的可遍历属性, 需要注意的是 for in 循环也能遍历到对象上的继承属性,所以使用 hasOwnProperty 函数判断是否是属于自身属性,如果属于自身属性的拷贝,就进行拷贝(这里需要注意的是拷贝不是深拷贝而是浅拷贝)。解释:该方法返回一个布尔值,表示对象自有属性(而不是继承来的属性)中是否具有指定的属性,它不会在对象原型链中检查指定的属性。in 语句以任意顺序迭代一个对象的除Symbol以外的可枚举属性,包括继承的可枚举属性。原创 2023-09-14 10:22:11 · 215 阅读 · 0 评论