温故而知新:柯里化 与 bind() 的认知
什么是柯里化?
科里化是把一个多参数函数转化为一个嵌套的一元函数的过程。(简单的说就是将函数的参数,变为多次入参)
- const curry = (fn, ...args) => fn.length <= args.length ? fn(...args) : curry.bind(null, fn, ...args);
- // 想要看懂上面这个函数,重点在于全面理解bind的用法。
- // 思路倒是很简单,就是在参数未搜集完善之前,通过bind来实现参数搜集,
- // 当搜集完成时,就可以执行原函数了。
- const add = (x, y) => x + y;
- const curryadd = curry(add);
- curryadd()(); // 8
关于bind的认知
bind 和 call / apply 很相似,都可以改变 this 的指向,也都可以传递参数。但还是有一些区别:
1)bind不会立即执行函数,而是返回一个新函数。譬如在 React 中我们经常用 bind 将函数的 this 指向组件本身:
- export default class ClickOutside extends Component {
- constructor(props) {
- super(props)
- this.getContainer = this.getContainer.bind(this)
- }
- getContainer(ref) {
- this.container = ref
- }
- }
2)除了 this 以外的参数,会把原函数的参数位给占领(扰乱王?鸠占鹊巢?小三上位?),也就是预设值绑定(赋值):
- // demo1: 演示预设绑定 x 和 y 的参数
- const add = (x, y, z) => x + y + z;
- add.bind(null, 1, 2)(3) // => 6 , 等价于 add(1, 2, 3)
- // demo2: 演示多次bind
- const add = (x, y) => x + y;
- const myadd = add.bind(null, ).bind(null, )
- myadd() // => 3 , 等价于 add(1, 2)
- // demo3: 和...args这种数组解构结合使用时可别懵了 O(∩_∩)O哈哈~
- const add = (...args) => console.log(args, args.length);
- const myadd = add.bind(null, ).bind(null, ).bind(null, ).bind(null, ).bind(null, )
- myadd() // => [1, 2, 3, 4, 5] 5
这种特性实际上和 偏应用 很相似,区别仅仅在于偏应用不需要关注 this 的绑定。
偏应用的目的只有一个,那就是通过预设值减少函数的参数位,达到简化函数、惰性函数、可重用函数等目的。
温故而知新:柯里化 与 bind() 的认知的更多相关文章
- JavaScript 闭包&基于闭包实现柯里化和bind
闭包: 1 函数内声明了一个函数,并且将这个函数内部的函数返回到全局 2 将这个返回到全局的函数内中的函数存储到全局变量中 3 内部的函数调用了外部函数中的局部变量 闭包简述: 有权访问另一个函数局部 ...
- 【转载】JS中bind方法与函数柯里化
原生bind方法 不同于jQuery中的bind方法只是简单的绑定事件函数,原生js中bind()方法略复杂,该方法上在ES5中被引入,大概就是IE9+等现代浏览器都支持了(有关ES5各项特性的支持情 ...
- javascript中利用柯里化函数实现bind方法
柯理化函数思想:一个js预先处理的思想:利用函数执行可以形成一个不销毁的作用域的原理,把需要预先处理的内容都储存在这个不销毁的作用域中,并且返回一个小函数,以后我们执行的都是小函数,在小函数中把之前预 ...
- [Effective JavaScript 笔记]第26条:使用bind方法实现函数的柯里化
bind方法的作用,除了有绑定函数到对象外,我们来看看bind方法的一些其它应用. 简单示例 例子:假设有一个装配URL字符串的简单函数.代码如下 function simpleURL(protoco ...
- js函数柯里化,实现bind
1.柯里化: 把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数,并且返回接受余下的参数而且返回结果的新函数的技术. 举个栗子: 一个计算两数之和的函数,需要传递两个参数,柯里化 ...
- 从bind函数看js中的柯里化
以下是百度百科对柯里化函数的解释:柯里化(Currying)是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数,并且返回接受余下的参数且返回结果的新函数的技术.概念太抽象,可能 ...
- js bind es5函数柯里化
绑定函数 bind()最简单的用法是创建一个函数,使这个函数不论怎么调用都有同样的this值.常见的错误就像上面的例子一样,将方法从对象中拿出来,然后调用,并且希望this指向原来的对象. 如果不做特 ...
- javascript中bind绑定接收者与函数柯里化
如果我要遍历一个数组, 我只要给forEach传一个匿名函数即可,很简单: let arr = ['a', 'b', 'c']; arr.forEach((item, index) => { c ...
- 函数柯里化与偏函数+bind
简单理解: 1,函数柯里化就是把多参数函数分解为多return的单参数函数: 举个例子(伪代码): function func (a, b, c){ return } 柯里化为 function fu ...
随机推荐
- excel自定义数据验证
1. 判断必须为5位或者9位的数字 2. 自定义限制级别和提示消息
- 算法笔记_200:第三届蓝桥杯软件类决赛真题(C语言本科)
目录 1 星期几 2 数据压缩 3 拼音字母 4 DNA比对 5 方块填数 前言:以下代码部分仅供参考,若有不当之处,还望路过同学指出哦~ 1 星期几 1949年的国庆节(10月1日)是星期六. ...
- itextpdf 备忘
加删除线: .setUnderline(Color.BLACK, 2.0f, 0.0f, 6.0f, 0.0f, 1) https://developers.itextpdf.com/examples ...
- Mysql Left Join Where On
select t1.id,t2.idfrom t1left join t2 on t1.id = t2.id and t1.id>1 and t2.id<>3在mysql的left ...
- MobX快速入门教程(重要概念讲解)
转载请注明原文地址:http://www.cnblogs.com/ygj0930/p/7372119.html 一:Mobx工作流程图 二:MobX涉及到的概念 1:状态state 组件中的数据. 2 ...
- JSP之include动态包含与静态包含
转载请注明原文地址:http://www.cnblogs.com/ygj0930/p/6044676.html JSP中,include是一个经常用到的标签.当应用程序中所有的页面的某些部分(如标题. ...
- Maven让资源文件处理插件能够解析资源文件中的Maven属性
<build> <resources> <resource> <directory>${project.basedir}/src/main/resour ...
- Axure 实现批量的勾选和反选
百度网盘:http://pan.baidu.com/s/1gf4RR2b 1.如何实现批量的勾选和反选的操作? 2.步骤 1)创建3个复选框.2个按钮(全选/反选) 2)设置全选按钮点击事件——选中“ ...
- Servlet学习(一)
Servlet的运行过程 Servlet程序是由WEB服务器调用,web服务器收到客户端的Servlet访问请求后: ①Web服务器首先检查是否已经装载并创建了该Servlet的实例对象.如果是,则直 ...
- java第四节 类的继承/抽象/接口/多态性
/* 类的继承 类的继承可以简化类的定义 java只支持单继承,不允许多重继承 可以有多层继承,即一个类可以继承其一个类的子类,如类B继承了类A,类C又可以继承类B 那么类C也间接继承了类A 子类继承 ...