温故而知新:柯里化 与 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 ...
随机推荐
- iOS webservice SOAP 请求
1. Web Service技术, 能使得运行在不同机器上的不同应用无须借助附加的.专门的第三方软件或硬件, 就可相互交换数据或集成.依据Web Service规范实施的应用之间, 无论它们所使用的语 ...
- 解决工作中遇到的一个"打开,保存"文件框的bug的过程
工作中遇到的这个问题还是很有意思的.其中嵌套了很多奇葩性的问题. (转载请指明出于breaksoftware的csdn博客) 我们来看下故事的发生过程,QA同学发现我们存在如下的bug 看到如此多的串 ...
- Word2007的自动插入题注!
要在word中插入图片,是截屏获取的图片,还未保存成位图.要使用word2007的自动插入题注时,发现选项里面没有关于word图片的选项,2003里面有个word图片(差不多是这个叫法吧),在2003 ...
- Java通过ScriptEngine 执行js脚本案例
public static void main(String[] args) throws ScriptException, FileNotFoundException, NoSuchMethodEx ...
- 两个自定义对象List列表取交集(intersection)
public static void main(String[] args) { List<Fpxx> list = ListUtils.intersection(getFpList1() ...
- Spring+MyBatis纯注解零XML整合(4)
不得不说,利用XML作为配置文件是一个非常好的想法,它可以轻松地实现配置集中化,而且修改之后无需再次编译.然而,由于大多数情况下开发者基本都会拿到程序的源码,加之对于各种XML配置文件一般情况下也只有 ...
- 算法笔记_218:花朵数(Java)
目录 1 问题描述 2 解决方案 1 问题描述 一个N位的十进制正整数,如果它的每个位上的数字的N次方的和等于这个数本身,则称其为花朵数.例如:当N=3时,153就满足条件,因为 1^3 + 5^ ...
- Data De-duplication
偶尔看到data deduplication的博客,还挺有意思,记录之 http://blog.csdn.net/liuben/article/details/5829083?reload http: ...
- set-matrix-zeroes当元素为0则设矩阵内行与列均为0
题目描述 Given a m x n matrix, if an element is 0, set its entire row and column to 0. Do it in place. c ...
- Windows下MySQL 5.7安装记录
软件下载 环境:Windows 7 旗舰版 64位 MySQL版本:mysql-5.7.3.0-winx64 MySQL下载地址:http://dev.mysql.com/downloads/inst ...