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. 数据库mysql中编码自动生成

    call PrGetRuleCodeNoDate('Table_Name'); call PrGetRuleCode('Table_Name');

  2. js正则验证表达式

    //上传文件大小验证 $.fn.checkFileTypeAndSize = function (options) { //默认设置 var defaults = { allowedExtension ...

  3. IO流之流的操作规律

    流的操作规律 IO流中对象很多,解决问题(处理设备上的数据时)到底该用哪个对象呢? 把IO流进行了规律的总结(四个明确): l  明确一:要操作的数据是数据源还是数据目的. 源:InputStream ...

  4. scss-@media

    首先回顾下css3中的@media 定义和使用: 使用 @media 查询,你可以针对不同的媒体类型定义不同的样式. @media 可以针对不同的屏幕尺寸设置不同的样式,特别是如果你需要设置设计响应式 ...

  5. Linux - centos 7 mysql安装

    安装 CentOS Linux release 7.1.1503 (Core)下载地址链接:https://pan.baidu.com/s/1c2rWsbm 密码:5nrt #yum -y insta ...

  6. iDempiere 使用指南 测试 及 开发 虚拟机下载

    Created by 蓝色布鲁斯,QQ32876341,blog http://www.cnblogs.com/zzyan/ iDempiere官方中文wiki主页 http://wiki.idemp ...

  7. 什么是SQL注入?什么是XSS攻击?什么是CSRF攻击?

    1. XSS(Cross Site Script,跨站脚本攻击) 是向网页中注入恶意脚本在用户浏览网页时在用户浏览器中执行恶意脚本的攻击方式. 1.1跨站脚本攻击分有两种形式: 反射型攻击(诱使用户点 ...

  8. matlab练习程序(模拟退火SA)

    模拟退火首先从某个初始候选解开始,当温度大于0时执行循环. 在循环中,通过随机扰动产生一个新的解,然后求得新解和原解之间的能量差,如果差小于0,则采用新解作为当前解. 如果差大于0,则采用一个当前温度 ...

  9. SQL 根据身份证号码获取年龄的函数

    在数据库的运用过程中,我们时常会碰到根据身份证号码来获取当前的年龄,今天我在这里写了一个函数,就是关于获取年龄的 create or replace function FUNC_COMPARE_SFZ ...

  10. Linux 配置 ss

    Linux 配置 Shadowsocks 标签(空格分隔): ss VPS 1.首先安装 sudo pip install shadowsocks 2.然后在指定位置新建shadowsocks.jso ...