一、闭包
理解闭包:
- 只有函数内部的子函数才能读取局部变量,因此可以把闭包简单理解成"定义在一个函数内部的函数"。
- 本质上,闭包就是将函数内部和函数外部连接起来的一座桥梁。
闭包用途:
- 可以读取函数内部的变量
- 让这些变量的值始终保持在内存中。
function f1(){
var n=999;
nAdd=function(){n+=1}
function f2(){
alert(n);
}
return f2;
}
var result=f1();
result(); // 999
nAdd();
result(); // 1000
柯里化
典型应用:bind、检测数据类型
又称为部分求值,是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数,并且返回一个新的函数的技术,新函数接受余下参数并返回运算结果。
柯里化所要表达是:如果你固定某些参数,你将得到接受余下参数的一个函数,所以对于有两个变量的函数yx,如果固定了y=2,则得到有一个变量的函数2x。这就是求值策略中的部分求值策略。
- 接收单一参数,将更多的参数通过回调函数来搞定
- 返回一个新函数,用于处理所有的想要传入的参数;
- 需要利用call/apply与arguments对象收集参数;
- 返回的这个函数正是用来处理收集起来的参数。
柯里化有3个常见作用:- 参数复用;
- 提前返回;
- 延迟计算/运行。
张鑫旭:
虽然延迟计算听上去很高级,但是,恕我愚钝,我想破了脑袋也没想出哪种情况非要柯里化延迟计算实现才能显著提高性能。能想到的好处就是参数个数随意,比方说:
addWeight(2.3, 6.5);
addWeight(1.2, 2.5);
也是可以的。
补充于翌日:经人提点,发现自己忘了个东西,ES5中的bind方法,用来改变Function执行时候的上下文(函数主体本身不执行,与call/apply直接执行并改变不同),本质上就是延迟执行。例如:
var obj = {
"name": "currying"
},
fun = function() {
console.log(this.name);
}.bind(obj);
fun(); // currying
function currying(fn) {
var slice = Array.prototype.slice,
__args = slice.call(arguments, 1);
return function () {
var __inargs = slice.call(arguments);
return fn.apply(null, __args.concat(__inargs));
};
}
看了柯里化三天,一直云里雾里,文章看了无数,一直迷迷糊糊~
在这个月黑风高的凌晨,我总算搞清楚了一点,现在先记录下来,后续有新的认识再进行补充吧~
function bind(fn,obj){
// bind(fn1,obj,'小明',19),如果是这样调用,在这里就直接全部获取
let arg1 = [].slice.call(arguments,2)
return function(){
// let mybind = bind(fn1,obj)
// mybind('小明',19)
//如果是这样调用,那么传入的参数就是这个函数中获取
let arg2 = [].slice.call(arguments)
let arrArr = arg1.concat(arg2)
return fn.apply(obj,arrArr)
}
}
-
特点:预处理,延迟执行
延迟执行:bind(),这样调用并不会执行,需要bind()()才可以执行 - 应用场景: 如果相同业务逻辑的代码,可以封装在一个柯里化函数中,第一层传入不变的部分,第二层传动态的部分,在需要的时候调用即可。
bind
function bind(fn,context){
//这里的arguments就是fn,context,2,事先生命要传什么函数
var args = [].slice.call(arguments,2)
return function(){
// 将这个第二层函数的arguments转成数组,这个参数就是事件对象e
var innerArgs = [].slice.call(arguments)
// 最终将第一层函数的参数和第二层函数的参数组合成一个数组
var finalArgs = args.concat(innerArgs)
// fn执行,this是context,传入的参数是两个函数组成的所有参数
return fn.apply(context,finalArgs)
}
}
---
let obj = {
name : 'nn'
}
function fn(){
console.log(this.name)
}
// bind执行了一次,点击的时候就是执行了第二次
div1.onclick = bind(fn,obj,'我是函数的参数') // nn