看以下代码:

 var bind = Function.prototype.call.bind(Function.prototype.bind); 

第一眼看上去,我能猜出它究竟是用来做什么的。它把x.y(z)转化成了y(x,z)。

编写良好的代码会比较容易被读懂。在读完Functional Javascript和 JavaScript Allongé (两本都是相当好的书)这两本书之后,再加上在Javascript函数式编程方面有些经验,弄懂上面这段代码的意思毫无压力。但是应该怎么向没有函数式编程经验的人解释呢(正如大多数人关心的那样)?

//设立一个简单地对象作为“上下文”
var context = { foo: "bar" }; //一个在this上下文中指向foo变量的函数
function returnFoo () {
return this.foo;
} // 变量在作用域中不存在,因此显示undefined
returnFoo(); // => undefined // 如果我们把它绑定在context上下文中
var bound = returnFoo.bind(context); // 现在的作用域中有这个变量了
bound(); // => "bar" //
// 这就是Function.prototype.bind的作用.
//由于returnFoo也是函数,因此它继承了function的原型
//
// 如果你觉得享受,接着往下读,下面更精彩
// // 有许多方法将函数绑定在一个上下文中
// Call和Apply让你能在上下文中调用函数
returnFoo.call(context); // => bar
returnFoo.apply(context); // => bar // 将函数添加到对象中
context.returnFoo = returnFoo;
context.returnFoo(); // => bar //
// 现在我们来玩一点诡异的东西
// // Array.prototype 中有一个叫做slice的方法
// 对一个数组调用slice,可以返回一个从start index到end index的数组
[1,2,3].slice(0,1); // => [1] // 因此我们把Array.slice赋值给一个本地变量slice
var slice = Array.prototype.slice; //现在的slice是"自由的",由于Array.prototype中的slice一般指定了上下文
//或者默认为this,此时slice将不起作用
slice(0, 1); // => TypeError: can't convert undefined to object
slice([1,2,3], 0, 1); // => TypeError: ... // 但是如果我们使用call或者apply,slice又将在一个上下文中执行
slice.call([1,2,3], 0, 1); // => [1] // Apply和Call差不多,只是参数要放在一个数组中
slice.apply([1,2,3], [0,1]); // => [1] // 使用call没错了,那么能不呢使用bind呢?
// 没错,我们来把"call"绑定在slice上
slice = Function.prototype.call.bind(Array.prototype.slice); // 现在slice可以把第一个参数作为上下文了
slice([1,2,3], 0, 1); // => [1] //
// 很酷,对吧。现在再来完成一件事
// // 现在我们对bind本身做一件刚才对silce做的事
var bind = Function.prototype.call.bind(Function.prototype.bind); // 在这里总结一下,好好想想
// 发生了什么事? 我们改变了call,
// 返回一个接收一个函数和一个上下文作为ic桉树的函数
//并且返回了一个完全绑定的函数 // 回到最初的例子
var context = { foo: "bar" };
function returnFoo () {
return this.foo;
} // 现在来使用神奇的"bind"函数
var amazing = bind(returnFoo, context);
amazing(); // => bar

原文:http://www.html-js.com/article/1553

英文原文:https://variadic.me/posts/2013-10-22-bind-call-and-apply-in-javascript.html

参考文章: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind

最新文章

  1. 理解DOM
  2. Async Programming - 1 async-await 糖的本质(1)
  3. CentOS7网卡的命名规则
  4. APP链接请求电话
  5. Lua协程
  6. Tomcat热部署和虚拟目录配置
  7. href="#"会导致location.replace(location.href);脚本不工作
  8. 魅族MX3问题集锦
  9. No identifier specified for entity
  10. C#学习笔记8:HTML和CSS基础学习笔记
  11. 【转】 学习ios(必看经典)牛人40天精通iOS开发的学习方法【2015.12.2
  12. TextField控件详解2
  13. python装饰器探究与参数的领取
  14. Android逆向破解表单注册程序
  15. Java并发编程笔记之StampedLock锁源码探究
  16. spring-boot-2.0.3之redis缓存实现,不是你想的那样哦!
  17. LyX快捷键管理
  18. php 设置中文 cookie, js获取
  19. Intelij的idea和pycharm的使用
  20. G1 Garbage Collector and Shenandoah

热门文章

  1. c++101rule
  2. Form_通过Zoom客制化跳转页面功能(案例)
  3. sublime代码片段功能
  4. centos nginx环境下删除CI框架Index.php入口遇到404问题
  5. android之datepicker控件用法
  6. Python进阶02 文本文件的输入输出
  7. C++学习40 抛出自己的异常
  8. [SQL]不知道1
  9. Codeforces 452D [模拟][贪心]
  10. (medium)LeetCode .Implement Trie (Prefix Tree)