闭包
(注：所以案例以 javascript 实现)
初识闭包
for (var i = 0; i < 5; i += 1) {
setTimeout(function () {console.log("counting...", i); }, 200);
}
/*
** console output: **
counting... 5
counting... 5
counting... 5
counting... 5
counting... 5
*/
for (var i = 0; i < 5; i += 1) {
setTimeout((function (i) {
console.log("counting...", i);
})(i), 200);
}
/*
** console output: **
counting... 0
counting... 1
counting... 2
counting... 3
counting... 4
*/
什么是闭包
- MDN
Closures are functions that refer to independent (free) variables.
- 我的认知过程
- Stage 1: 解决循环时setTimeout的变量绑定
- Stage 2: 实现私有变量
- Stage 3: 返回函数的函数 => 柯里化
- Stage 4: 函数即数据
实现私有变量
function Point(_x, _y) {
this.getX = function () {
return _x;
};
this.setX = function (x) {
_x = x;
};
this.getY = function () {
return _y;
};
this.setY = function (y) {
_y = y;
};
}
返回函数的函数 => 柯里化
函数的类型
- 如何解读
map的类型- map :: (a -> b) -> [a] -> [b]
// Demo 1
// (a -> b) -> [a] -> [b]
console.log(map(x => 2 * x, [1, 2, 3])); // [2, 3, 4]
// Demo 2
// (a -> b) -> ([a] -> [b])
// let listMultiplyTwo = map(x => 2 * x);
let listMultiplyTwo = _.partial(map)(x => 2 * x);
console.log(listMultiplyTwo([1, 2, 3])); // [2, 3, 4]
console.log(listMultiplyTwo([4, 5, 6])); // [8, 10, 12]
// Demo 3
let listMultiply = (n) => _.partial(map)(x => n * x);
console.log(listMultiply(2)([1, 2, 3])); // [2, 3, 4]
console.log(listMultiply(3)([4, 5, 6])); // [12, 15, 18]
柯里化的价值
- 获得部分数据，重新返回一个函数
- 绝大部分能看到的返回函数的函数，都用到了闭包。否则的话，该函数就应该直接在外围定义。
- 柯里化 ＋ 函数组合 ＝抽象 ＋ 复用性
尝试实现 partial (柯里化)
- 2个参数
- 3个参数
- n个参数
- 挑着参数传
var partial_2 = function (fn) {
return function (x) {
return function (y) {
// closure: x
return fn(x, y)
};
};
};
var partial_3 = function (fn) {
return function (x) {
return function (y) {
return function (z) {
// closure: x, y
return fn(x, y, z);
};
};
};
};
// n个参数
// 以上两个函数存在的问题
// partial_2 只能一个一个收参数，不能直接接受2个参数
var partial_n = function (fn) {
var len = fn.length,
arbitary = function (cur_args, left_arg_cnt) {
return function () {
var args = Array.prototype.slice.call(arguments);
if (args.length >= left_arg_cnt) {
return fn.apply(null, cur_args.concat(args));
}
return arbitary(cur_args.concat(args), left_arg_cnt - args.length);
}
};
return arbitary([], len);
};
// 挑着参数传
// 可以实现类似 partial(setTimeout)(_, 200)(fn) 的效果
var partial_x = function (fn) {
var len = fn.length,
length = function (args) {
return args.reduce(function (prev, cur) {
return (cur !== _) ? (prev + 1) : prev;
}, 0);
},
fill_args = function (orig_args, args) {
var i =0,
j = 0,
len = orig_args.length,
jlen = args.length;
for (; i < len && j < jlen; i += 1) {
if (orig_args[i] === _) {
orig_args[i] = args[j++];
}
}
return orig_args.concat(args.slice(j));
}
arbitary = function (cur_args, left_arg_cnt) {
return function () {
var args = Array.prototype.slice.call(arguments),
args_len = length(args),
new_args = fill_args(cur_args, args);
if (args_len >= left_arg_cnt) {
return fn.apply(null, new_args);
}
return arbitary(new_args, left_arg_cnt - args_len);
}
};
return arbitary([], len);
};
var _ = partial_x;
尝试实现组合
- compose :: (b -> c) -> (a -> b) -> (a -> c)
// 接收2个一个参数的函数，返回一个新的一参函数
var compose_2 = function (a, b) {
return function (x) {
return a(b(x));
};
};
// 接收n个一参函数，，返回一个新的一参函数
var compose_n = function () {
var slice = function (x) { return Array.prototype.slice.call(x); },
fns = slice(arguments);
return fns.reduce(function (prev, cur) {
return function (x) {
return cur(prev(x));
};
}, function (x) { return x; });
};
进一步做准备工作
- 有了柯里化 (partial) 、组合 (compose) 这个两个强力武器之后，再加上 reduce，后面就是尽情的造齿轮，也许无意间你已经有了一块手表
(举例：实现一个矩阵转置)
/*
var transpose = function (twoDemensionArray) {
...
};
*/
var transpose = partial_x(zip)(function () {
return Array.prototype.slice.call(arguments);
});
var range = function (start, end, step_) {
var ret = [],
step = step_ || 1;
for (var i = start; i < end; i += step) {
ret.push(i);
}
return ret;
};
var zip = function (fn, twoDemensionArray) {
var max_length = Math.max.apply(null, twoDemensionArray.map(function (x) { return x.length; }));
return range(0, max_length).map(function (x) {
var args = twoDemensionArray.map(function (list) {
return list[x];
});
return fn.apply(null, args);
});
};
// transpose([[1,2],[3,4],[5,6],[7,8]])
// == [[1,3,5,7], [2,4,6,8]]
函数即数据
- 将函数看成一个盒子，把参数传给一个函数，就相当于返回了一个包装在盒子里的值
（待后续补充）