共计 4461 个字符，预计需要花费 12 分钟才能阅读完成。
最近一直在学习函数式编程，前面介绍了函数式编程中非常重要的两个运算函数柯里化 和 函数组合，下文出现的 curry 和 compose 函数可以从前两篇文章中找到。它们都可以直接在实际开发中用到，写出函数式的程序。
本文主要初探容器的相关概念，以及如何处理编程中异步操作，错误处理等依赖外部环境状态变化的情况，，
容器（container）
容器可以想象成一个瓶子，也就是一个对象，里面可以放各种不同类型的值。想想，瓶子还有一个特点，跟外界隔开，只有从瓶口才能拿到里面的东西；类比看看，container 回暴露出接口供外界操作内部的值。
一个典型的容器示例：
var Container = function(x) {
this.__value = x;
}
Container.of = function(x) {
return new Container(x);
}
Container.of(“test”)
// 在 chrome 下会打印出
// Container {__value: “test”}
我们已经实现了一个容器，并且实现了一个把值放到容器里面的 Container.of 方法，简单看，它像是一个利用工厂模式创建特定对象的方法。of 方法正是返回一个 container。
函子（functor）
上面容器上定义了 of 方法，functor 的定义也类似
Functor 是实现了 map 函数并遵守一些特定规则的容器类型。
把值留在容器中，只能暴露出 map 接口处理它。函子是非常重要的数据类型，后面会讲到各种不同功能的函子，对应处理各种依赖外部变量状态的问题。
Container.prototype.map = function(f) {
return Container.of(f(this.__value))
}
把即将处理容器内变量的函数，包裹在 map 方法里面，返回的执行结果也会是一个 Container。这样有几点好处：
保证容器内的 value 一直不会暴露出去，
对 value 的操作方法最终会交给容器执行，可以决定何时执行。
方便链式调用
// 利用上一篇中讲到的柯里化，就可以看出其特性。
var add2 = function(x, y) {
return x + y;
};
curriedAdd = curry(add2);
Container.of(2).map(curriedAdd(3));
// Container {__value: 5}
不同类型的函子
maybe
容器在处理内部值时，经常遇到传入参数异常的情况的情况，检查 value 值的合理性就非常重要。Maybe 函子保证在调用传入的函数之前，检查值是否为空。
var Maybe = function(x) {
this.__value = x;
}
Maybe.of = function(x) {
return new Maybe(x);
}
Maybe.prototype.isNothing = function() {
return (this.__value === null || this.__value === undefined);
}
Maybe.prototype.map = function(f) {
return this.isNothing() ? Maybe.of(null) : Maybe.of(f(this.__value));
}
这个通用的例子，体现了输出结果的不确定性，也可以看出，在容器内部所有对 value 值的操作，都会交给容器来执行。在 value 为空的情况下，也会返回包裹着 null 的容器，避免后续容器链式调用报错。
异常捕获函子
通常 使用 throw/catch 就可以捕获异常，抛出错误，但它并不是一种纯函数方法，最好的方法是在出现异常时，可以正常返回信息。Either 函子，内部两个子类 Left 和 right; 可以看成右值是正常情况下使用并返回的值，左值是操作简单的默认值。
var Left = function(x) {
this.__value = x;
}
Left.of = function(x) {
return new Left(x);
}
Left.prototype.map = function(f) {
return this;
}
var Right = function(x) {
this.__value = x;
}
Right.of = function(x) {
return new Right(x);
}
Right.prototype.map = function(f) {
return Right.of(f(this.__value));
}
// 输入数据进行校验
var setage = function(age) {
return typeof age === ‘number’? Right.of(age): Left.of(‘error age’)
}
setage(12).map(function(age){return ‘my age is’ + age})
// Right {__value: “my age is12”}
setage(“age”).map(function(age){return ‘my age is’ + age})
// Left {__value: “error age”}
left 和 right 唯一的区别在于 map 方法的实现，当然，一个函子最大的特点也体现在 map 方法上，Left.map 不管传入的是什么函数，直接返回当前容器；Right.map 则是示例里面的方法一样。
IO 操作
IO 操作本身就是不纯的操作，生来就得跟外界环境变量打交道，不过可以掩盖他的不确定性。跟下面 localStorage 包裹函数类似，延迟执行 IO 操作。
var getStorage = function(key) {
return function() {
return localStorage[key];
}
}
再看看，封装了高级一点的 IO 函子：
var IO = function(f) {
this.__value = f;
}
IO.of = function(x) {
return new IO(function(){
return x;
})
}
IO.prototype.map = function(f) {
// 使用上一句定义的 compose 函数
return new IO(compose(f, this.__value))
}
compose 函数组合，里面存放的都是函数，this.__value 跟其他函子内部值不同，它是函数。IO.of 方法在 new 对象之前，把值包裹在函数里面，试图延迟执行。
// 测试一下
var io__dom= new IO(function() {return window.document})
io__dom.map(function(doc) {return doc.title})
// IO {__value: ƒ}
返回一个没有执行的函数对象，里面的__value 值对应的函数，在上面函数调用后并没有执行，只有在调用了 this.__value 值后，才执行。最后一步不纯的操作，交给了函数调用者去做。
Monad
一个 functor, 只要他定义了一个 join 方法和一个 of 方法，那么它就是一个 monad。它可以将多层相同类型的嵌套扁平化，像剥洋葱一样。关键在于它比一般 functor 多了一个 join 方法。我们先看看剥开一层的 join 方法。
var IO = function(f) {
this.__value = f
}
IO.of = function(x) {
return new IO(function(){
return x;
})
}
IO.prototype.join = function() {
return this.__value ? this.__value(): IO.of(null);
}
// 包裹上两层
var foo = IO.of(IO.of(‘test bar’));
foo.join().__value();
// 返回里面嵌套着的 IO 类。IO {__value: ƒ}，接着只需调用这里的__value()，就可以返回字符串 `test bar`;
回头看看前面 map 方法，return new IO(), 生成新的容器，方便链式调用，跟 join 方法结合一起使用，生成容器后，再扁平化。形成 chain 函数，
var chain = curry(function(f, m) {
return m.map(f).join();
})
看一个完整示例，其中 curry 和 compose, 分别用到了链接里面的实现,：
var IO = function(f) {
this.__value = f;
}
IO.of = function(x) {
return new IO(function() {
return x;
})
}
IO.prototype.map = function(f) {
// 使用上一句定义的 compose 函数
return new IO(compose(f, this.__value))
}
IO.prototype.join = function() {
return this.__value ? this.__value() : IO.of(null);
}
var chain = curry(function(f, m) {
return m.map(f).join();
})
var log = function(x) {
return new IO(function() {
console.log(x);
return x;
})
}
var setStyle = curry(function(sel, props) {
return new IO(function() {
return document.querySelector(sel).style.background = props
})
})
var getItem = function(key) {
return new IO(function() {
return localStorage.getItem(key);
})
};
var map = curry(function(f, functor) {
return functor.map(f);
});
// 简单实现 join
var join = function(functor) {
return functor.join();
}
localStorage.background = ‘#000’;
var setItemStyle = compose(join, map(setStyle(‘body’)), join, map(log), getItem);
// 换成 链式调用。
setItemStyle = compose(chain(setStyle(‘body’)), chain(log), getItem);
setItemStyle(‘background’).__value(); // 操作 dom 改变背景颜色
总结
本文主要利用简单代码举例，介绍了容器，函子等相关概念，初步认识了各种不同的函子。深入实践示例，可以参考阅读下面链接：
函数式编程风格
js 函数式编程指南 https://llh911001.gitbooks.io…
JavaScript 函数式编程（二）
JavaScript：函数式编程基本概念学习
JS 函数式编程 – 函子和范畴论
javascript 函数式编程之 函子（functor）
函数式编程入门教程
