call,apply,bind都是用来挟持对象或者说更改this指向的,但是区别还是有的,call 传参是 fn.call(this,1,2,3) apply传参是 fn.apply(this,[1,2,3])

而前两者是立即执行的,后者Bind是返回一个函数 var foo = fn.bind(this)  foo()

看到一个关于美团面试题是如何实现js bind

      if (typeof Function.prototype.bind === "undefined"){
Function.prototype.bind = function (thisArgs){
var fn = this,
slice = Array.prototype.slice,
args = slice.call(arguments, 1);//都是为了截取参数
return function (){
return fn.apply(thisArgs, args.concat(slice.call(arguments)));
}
}
}

代码来自书籍 《javaScript 模式》

其实结合上ES6可以更简洁:

Function.prototype.bind1 = function (thisArgs){
var fn = this,//foo
//arguments 是类数组,支持for循环,但不支持数组的方法
// args = [].slice.call(arguments, 1);//截取参数 5
args = Array.from(arguments).slice(1);//截取参数 5
return function (){
return fn.apply(thisArgs,args);
}
}
var m = {
"x" : 1
};
function foo(y) {
console.log(this.x + y);
}
// foo.apply(m, [5]);
// foo.call(m, 5);
var foo1 = foo.bind1(m,5);
foo1();

上面的return函数也换成箭头函数的话就更加简洁了。

Function.prototype.bind1 = function (thisArgs){
  args = Array.from(arguments).slice(1);//截取参数 5
  return ()=>this.apply(thisArgs,args)
}

箭头函数注意:只有一句的时候可以省略return,然后前面的fn也可以省略了。

  

  

 

js bind的实现的更多相关文章

  1. JS bind()方法、JS原生实现bind()

    一.arguments的含义 // arguments 是一个对应于传递给函数的参数的类数组对象 function a(){ console.log(arguments); } a(); // Arg ...

  2. js bind

    1.作用 函数的bind方法用于将函数体内的this绑定到某个对象,然后返回一个新函数. //bind 相比于call apply   this 都等于 obj;   bind是产生一个新的函数 不执 ...

  3. js bind绑定事件

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. Js/Bind()的认识

    1.bind( eventType [, eventData], handler(eventObject))2.向绑定的对象上面提供一些事件方法的行为.其中三个参数的意义分别代表: 一.eventTy ...

  5. js bind 绑定this指向

    1.示例代码 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UT ...

  6. js bind es5函数柯里化

    绑定函数 bind()最简单的用法是创建一个函数,使这个函数不论怎么调用都有同样的this值.常见的错误就像上面的例子一样,将方法从对象中拿出来,然后调用,并且希望this指向原来的对象. 如果不做特 ...

  7. bind,call,apply区别

     js中bind.call.apply函数的用法 2015-02-27 21:16:39 标签:javascript js bind call apply 原创作品,允许转载,转载时请务必以超链接形式 ...

  8. Atitti.数据操作crud js sdk dataServiceV3设计说明

    Atitti.数据操作crud js sdk dataServiceV3设计说明 1. 增加数据1 1.1. 参数哦说明1 2. 查询数据1 2.1. 参数说明2 3. 更新数据2 3.1. 参数说明 ...

  9. javascript深入理解js闭包(转)

    javascript深入理解js闭包 转载  2010-07-03   作者:    我要评论 闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现. ...

随机推荐

  1. 02.List泛型集合

    List泛型可以转换成数组 List泛型和数组的相同点: List泛型的数据类型必须是指定的,数组的数据类型也必须是指定的. List泛型和数组的不同点: List泛型的长度是随意的,而数组的长度必须 ...

  2. OpenLayers3 实现自定义放大缩小滑块,自定义方向按钮

    由于项目需要,需要自定义滑块.为此记录如下: <div id="map" class = "map"> <div id = "zoo ...

  3. Web程序中使用EasyUI时乱码问题

    今天偶然遇见使用easyUI时,弹窗和分页都是乱码的问题,耗费了很长的时间来解决,以此记住这个坑. 相信大家都会在使用easyUI时都会设置这样一句: 那么就有可能出现设置中文后的乱码问题,如下图: ...

  4. Java 的版本历史与特性

    Java SE 8[2014-03-14发行] Lambda表达式 Pipelines和Streams Date和Time API Default方法 Type注解 Nashhorn JavaScri ...

  5. Windows10 iis10 arr webfarm

    win10安装arr提示安装失败,但是安装说明中提升iis7及以上版本,iis10却安装失败,坑爹!安装方法: 1.HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSe ...

  6. OLEDB 调用存储过程

    除了常规调用sql语句和进行简单的插入删除操作外,OLEDB还提供了调用存储过程的功能,存储过程就好像是用SQL语句写成的一个函数,可以有参数,有返回值. 存储过程除了像普通函数那样返回一般的值以外, ...

  7. 【Android】4.0 神一样的仪式感:Android第一个项目HelloWorld——eclipse

    进入Eclipse,在左侧栏右击: 新建 “Android Application Project”项目,如果new之后没有,选择“Project”中“Android”目录下的 “Android Ap ...

  8. JQuery Tips

    另一篇文章 JavaScript Tips 1. 获取span标签的值需要用text(); 2. datepicker控件的‘setDate’属性可用于设置默认值: 3. 使用parseFloat转换 ...

  9. angularJS 单页面 两个及以上个 ng-app 的处理方式

    <div ng-app="myApp1" ng-controller="myCtrl1"> 名: <input type="text ...

  10. CompletionService的poll方法

    1.poll():马上返回完成的任务,若没有,则返回null 2.poll(long timeout, TimeUnit unit): 等待timeout时间,如果大于最短任务完成时间,则获取任务结果 ...