前言
上一篇《关于Virtual Dom的那些事（四）》主要是介绍了Thunk概念，加上之前所有有的内容都只是snabbbom的前菜，本篇直接分析其200 SLOC（Source Lines of Code），大概200行的核心代码。并附上其它剩余所有代码的源码分析。 继续阅读“关于Virtual Dom的那些事（五）”
分类：javascript设计模式
关于Virtual Dom的那些事（四）
前言
上一篇《关于Virtual Dom的那些事（三）》主要是介绍了生成VNode的几种方式。翻一翻snabbdom的源码，我看还可以看到一个概念-Thunk，Thunk是什么？在react全家桶中经常会看到Thunk这概念，在计算机语言中是传名调用的意思，但如果按我个人的理解就是中间件的概念，更通俗一点就是在某函数的每次输入与输出之间，预加一个自定义的拦截处理函数（thunk函数）， 继续阅读“关于Virtual Dom的那些事（四）”
关于Virtual Dom的那些事（三）
前言
上一篇《关于Virtual Dom的那些事（二）》主要是介绍了VNode。其实生成VNode的方式在snabbdom中除了VNode自身的最基本的构造函数vnode()外，还有两种方式来生成。一种是toVNode（即把原生的Dom转化成为VNode），还有一种是非常有名的h函数（hyperscript最原始的定义是“Create HyperText with JavaScript.”）。本节主要是分析一下这两种函数在snabbdom中的源码。 继续阅读“关于Virtual Dom的那些事（三）”
关于Virtual Dom的那些事（二）
前言
上一篇《关于Virtual Dom的那些事（一）》在最后之处讲到Virtual Dom 主要涉及的概念。本篇将紧跟着并结合snabbdom的源码来讲讲其中的第一点“VNode”。既然是Virtual Dom，那当然其结构里面的Node节点相应也有VNode的概念。其组织形式按理来说应该与真实的Node节点类似才对。
真实Dom由些什么组成呢？
关于 Virtual Dom 的那些事（一）
前言
一直想写点关于 Virtual Dom 的东西。以前刚开始接触 react 的时候就已经接触到了 Virtual Dom 和 diff 算法的概念，但一直觉得这些都是很复杂，很高深的东西。后面使用 react，使用 Vue 多了，逐渐觉得这些概念没那么陌生了。但还是觉得各种开源的 Virtual Dom，React 等对 Virtual Dom 的实现的源码不太容易读懂，源码的注释不全是一大障碍，直到遇到了 snabbdom，才开始觉得有深究其源码的冲动。
为什么是 snabbdom?
javascript函数式编程之 函子（functor）
一个最简单的容器，一个最简单的函子
函子functor 是实现了 map 函数并遵守一些特定规则的容器类型。什么是容器？如下是一个最简单的容器。函子则是Mappable的容器。下面的容器实现了map，所以它也是一个最简单的函子。
引入数学概念范畴学中的函子是为了要处理一些比较复杂的情况。诸如：控制流（control flow）、异常处理（error handling）、异步操作（asynchronous actions）和状态（state），还有更棘手的副作用（effects）。
继续阅读“javascript函数式编程之 函子（functor）”
javascript函数式编程之 声明式编程（declarative programing）
定义
在计算机科学中，声明式编程是一种编程范式 – 构建计算机程序的结构和元素的一种风格 – 专注于表达计算逻辑，而不需要描述其控制流程。
应用这种风格的许多语言尝试通过描述程序在问题领域中必须完成的内容来最大限度地减少或消除副作用，而不是描述如何将其作为编程语言原函数的序列直到实现。这与命令式编程相反，命令式编程在显式步骤中实现算法。 继续阅读“javascript函数式编程之 声明式编程（declarative programing）”
javascript函数式编程之 无参风格（point-free style）
定义
无参风格是一种编程范例，其中函数定义不能识别它们所运行的参数（或“点”）。 相反，它只是组合(compose)其他函数，在其子函数中操纵参数的组合器。
因为严格使用组合可以很好地适应等式推理的程序，它也是某些编程语言的自然风格，包括APL和诸如Forth之类的连接语言。
例子如下： 继续阅读“javascript函数式编程之 无参风格（point-free style）”
javascript函数式编程之 柯里化（curry）
定义
柯里化（curry）的概念其实可以简单理解为这样，本来有个已存在的函数需要接收多个参数的，现我想要根据需求由此函数打造成一个只有一个或者指定数量参数的新的函数。这里我们引用lodash库来举例，如下：
<script src="https://cdn.bootcss.com/lodash.js/4.17.4/lodash.min.js"></script> 继续阅读“javascript函数式编程之 柯里化（curry）”
javascript函数式编程之 函数组合（compose）
定义
在函数式编程使用过程中，组合（compose）简单来说就是把两个你喜欢的接入参数一样(最好都是一参的形式，可能过柯里化curry把多参转为一参)的函数把它们组合到一起，产生一个新的函数。如下：
var compose = function(f, g) {
return function(x) {
return f(g(x));
};
};
在这里，我们把f和g两个函数组合到一起，它们有共同的参数x，显然在compose组合时，函数的执行顺序是由右向左执行，先执行g(x)再执行f(g)，可称之为“左倾”。使用起来如下： 继续阅读“javascript函数式编程之 函数组合（compose）”