zoukankan      html  css  js  c++  java
  • 【转载】JS中bind方法与函数柯里化

      原生bind方法

      不同于jQuery中的bind方法只是简单的绑定事件函数,原生js中bind()方法略复杂,该方法上在ES5中被引入,大概就是IE9+等现代浏览器都支持了(有关ES5各项特性的支持情况戳这里ECMAScript 5 compatibility table),权威指南上提到在ES3中利用apply模拟该方法的实现(JS权威指南中函数那章), 但无法真实还原该方法, 这也是真bind方法中的有趣特性。

      (原文这边理解有问题, 这段话的意思如果结合犀牛书上下文的意思, 再结合犀牛书中bind()方法实现, 是说把bind()方法第一个参数以后的所有参数作为返回函数的起始实参)首先bind不同于call和apply只是单纯地设置this的值后传参,它还会将所有传入bind()方法中的实参(第一个参数之后的参数)与this一起绑定,我个人的理解是其后的参数也会作为绑定上下文的一部分,以下为《js权威指南》原文的说法:

    The ECMAScript 5 bind() method does more than just bind a function to an object. It also performs partial application: any arguments you pass to bind() after the first are bound along with the this value.

      关于这个特性看《权威指南》原文的栗子:

    var sum = function(x,y) { return x + y }; 
    
    var succ = sum.bind(null, 1); //让this指向null,其后的实参也会作为实参传入被绑定的函数sum
    
    succ(2) // => 3:  可以看到1绑定到了sum函数中的x

      其次, bind()方法所返回的函数的length(形参数量)等于原函数的形参数量减去传入bind()方法中的实参数量(就是剩下没有传的参数),因为传入bind中的实参都会绑定到原函数的形参,吗的,绕死了, 举个栗子:

    function  func(a,b,c,d){...} //func的length为4
    
    var after = func.bind(null,1,2)  //这里输入了两个实参(1,2)绑定到了func函数的a,b
    
    console.log(after.length) //after的length为 2

      第三,当bind()所返回的函数用作构造函数的时候, 传入bind()的this将被忽略,实参会全部传入原函数,这样说很抽象, 举个栗子?

    function original(x){
      this.a=1;
      this.b =function(){return this.a + x}
    }
    var obj={
      a:10
    }
    var  newObj = new (original.bind(obj,2)) //传入了一个实参2
    console.log(newObj.a)  //输出 1, 说明返回的函数用作构造函数时obj(this的值)被忽略了
    
    console.log(newObj.b()) //输出3 ,说明传入的实参2传入了原函数original

      函数柯里话的概念

      以上就是ES5中bind方法的特性, 这种技术也被称为函数柯里化,在看《js权威指南》的时候感觉这玩意逼格太高直接忽略了,最近又碰到这概念, 索性打算搞定他。
    函数柯里化在百科的解释为:

    在计算机科学中,柯里化(Currying)是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数,并且返回接受余下的参数且返回结果的新函数的技术。这个技术由 Christopher Strachey 以逻辑学家 Haskell Curry 命名的,尽管它是 Moses Schnfinkel 和 Gottlob Frege 发明的。

      以上翻译成人话就是:这种技术将多个参数的函数变成只带一个参数的函数。bind方法就是该技术在js中的实践。作为一个菜鸟, 目前只用过bind设置this的值, 码这篇博客的目的就是厘清下bind的特性。

      原文链接:https://segmentfault.com/a/1190000003963461

  • 相关阅读:
    把手机用户的身份验证简化到极致 – IEMI
    WIFI 功放芯片确定功率大小
    告别镜像端口:完成流量监控全功略
    windows 2003 server 配置为NTP服务器
    【转】VIM 多文件跳转
    【转】在Linux下FQ的看过来
    【转】VIM自动完成
    【转】VIM下的跳转练习
    【转】vim 窗口调整
    【转】Cscope的使用(领略Vim + Cscope的强大魅力)
  • 原文地址:https://www.cnblogs.com/diligenceday/p/5528968.html
Copyright © 2011-2022 走看看