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. ubuntu系统没有声音解决方法

    好像装了个放视频的软件,就没有声音了.后面网上搜到了一个简单粗暴的办法,效果很明显,改变权限后直接就有声音了. -------------------------------------------- ...

  2. 【Android】8.0活动的生命周期(一)——理论知识、活动的启动方式

    1.0 Android是使用任务(Task)来管理活动的,活动就像栈一样堆放着在一起. 每个活动的生命周期最多可能会有四种状态: 1.1 运行状态 位于栈顶 1.2 暂停状态 不在栈顶但在界面上仍处于 ...

  3. Highcharts - Pie Chart

    1. 饼状图(Pie Chart)示例: <div id="container" style="height: 400px"></div> ...

  4. jQuery Event.stopImmediatePropagation() 函数详解

    stopImmediatePropagation()函数用于阻止剩余的事件处理函数的执行,并防止当前事件在DOM树上冒泡. 根据DOM事件流机制,在元素上触发的大多数事件都会冒泡传递到该元素的所有祖辈 ...

  5. SQL Server ->> 生成代码把表字段从NULL改为NOT NULL

    一般我们用SELECT .... INTO语句生成的表字段都是允许为NULL.而如果我们需要改成NOT NULL呢 select 'ALTER TABLE dbo.XXXXXXX ALTER COLU ...

  6. WIN7系统程序放在中文文件夹打开报错及界面汉字变乱码

    今天发现在一个服务商提供的设备的WIN7系统里,一个稳定运行的程序打开时报错,且界面汉字变乱码. 经测试发现程序放在英文名称的文件夹中可以正常打开,但界面上的汉字仍为乱码. 后检查“控制面板“--”区 ...

  7. March 11 2017 Week 10 Saturday

    Wisdom outweighs any wealth. 智慧比财富更有价值. Wisdom can create wealth if used in proper ways, it can help ...

  8. python3乱码问题:接口返回数据中文乱码问题解决

    昨天测试接口出现有一个接口中文乱码问题,现象: 1 浏览器请求返回显示正常 2 用代码请求接口返回数据中文显示乱码 3 使用的python3,python3默认unicode编码,中文都是可以正常显示 ...

  9. Reverse Polish notation

    Reverse Polish notation is a notation where every operator follows all of its operands. For example, ...

  10. Vue.js系列之vue-resource(6)

    网址:http://blog.csdn.net/u013778905/article/details/54235906