浅谈JS中的bind方法与函数柯里化_javascript技巧

绑定函数bind()最简单的用法是创建一个函数,使这个函数不论怎么调用都有同样的this值。不同于call和apply只是单纯地设置this的值后传参,它还会将所有传入bind()方法中的实参(第一个参数之后的参数)与this一起绑定。

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

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方法的特性, 这种技术也被称为函数柯里化。这种技术将多个参数的函数变成只带一个参数的函数。bind方法就是该技术在js中的实践。

关于这篇浅谈JS中的bind方法与函数柯里化就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索js函数柯里化
javascript 柯里化、javascript函数柯里化、javascript bind、javascript bind this、javascript bind 函数,以便于您获取更多的相关知识。

时间: 2024-10-04 16:49:08

浅谈JS中的bind方法与函数柯里化_javascript技巧的相关文章

浅谈JS中的!=、== 、!==、===的用法和区别_javascript技巧

var num = 1; var str = '1'; var test = 1; test == num //true 相同类型 相同值 test === num //true 相同类型 相同值 test !== num //false test与num类型相同,其值也相同, 非运算肯定是false num == str //true 把str转换为数字,检查其是否相等. num != str //false == 的 非运算 num === str //false 类型不同,直接返回fals

深入剖析JavaScript中的函数currying柯里化_javascript技巧

curry化来源与数学家 Haskell Curry的名字 (编程语言 Haskell也是以他的名字命名).   柯里化通常也称部分求值,其含义是给函数分步传递参数,每次传递参数后部分应用参数,并返回一个更具体的函数接受剩下的参数,这中间可嵌套多层这样的接受部分参数函数,直至返回最后结果. 因此柯里化的过程是逐步传参,逐步缩小函数的适用范围,逐步求解的过程.  柯里化一个求和函数 按照分步求值,我们看一个简单的例子 var concat3Words = function (a, b, c) {

深入解析JavaScript中函数的Currying柯里化_javascript技巧

引子先来看一道小问题: 有人在群里出了到一道题目: var s = sum(1)(2)(3) ....... 最后 alert(s) 出来是6  var s = sum(1)(2)(3)(4) ....... 最后 alert(s) 出来是10  问sum怎么实现? 刚看到题目,我第一反应是sum返回的是一个function,但是没有最终实现,印象中看到过类似的原理,但是记不清了.   后来同事说,这个是叫柯里化, 实现方法比较巧妙:   function sum(x){ var y = fun

浅谈js的ajax的异步和同步请求的问题_javascript技巧

先来看以下代码: var flag=true; var index=0; $.ajax({ url: "http://www.jb51.net/", success: function(data){ flag=false; } }); while(flag){ index++; } alert(index); 请问最后alert的index的结果是多少? 可能有人会说0呗.实际上却没那么简单.大家可以自己试试看.可以看到最终程序进入了一个死循环!怎么会这样呢! 我们在看一段代码: va

浅谈javascript中for in 和 for each in的区别_javascript技巧

区别一:         for in是javascript 1.0 中发布的.         for each in是作为E4X标准的一部分在javascript 1.6中发布的,而它不是ECMAScript标准的一部分.         这将意味着存在各种浏览器的兼容性问题.for each in,对很多浏览器都不支持的.例如是不支持IE6,IE7,IE8等浏览器的. 区别二:     例:  var 长方形= {  高:"15",  宽:"25"  }; f

浅谈javascript中执行环境(作用域)与作用域链_javascript技巧

相信很多初学者对与javascript中的执行环境与作用域链不能很好的理解,这里,我会按照自己的理解同大家一起分享. 一般情况下,我们把执行环境分为全局执行环境和局部执行环境,其中局部执行环境我们又可以称之为函数执行环境.那么究竟什么使执行环境呢?通俗的说,执行环境即为代码执行时所处的环境.我们下来看一看如下代码,再进一步分析之. <script><br>var name="zhuzhenwei"; function changeName(){ if (name

JS中的substring和substr函数的区别说明_javascript技巧

1. 在JS中函数声明: stringObject.substring(start,stop) start是在原字符串检索的开始位置,stop是检索的终止位置,返回结果中不包括stop所指字符. 如:"hamburger".substring(4,8) returns "urge" 2. substr(start,length) 如:当DETAIL_TYPE 的值为1111053 时, substr(DETAIL_TYPE,1,6) = 111105 从DETAIL

js中使用replace方法完成某个字符的转换_javascript技巧

复制代码 代码如下: var str = "国字[1990]12号"; 如何把变量中的"["和"]"的前面加上反斜杠, 就是要替换成这样:str = "国字\[1990\]12号"; 复制代码 代码如下: <script language="javascript" type="text/javascript"> var str = "国字[1990]12号"

浅谈JavaScript中定义变量时有无var声明的区别_javascript技巧

前段时间回答了一个关于定义变量时使用关键字var与否的区别,总结回顾一下. 1.在函数作用域内 加var定义的变量是局部变量,不加var定义的就成了全局变量. 使用var定义: var a = 'hello World'; function bb(){ var a = 'hello Bill'; console.log(a); } bb() //'hello Bill' console.log(a); //'hello world' 不使用var定义: var a = 'hello World'