js bind的实现
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的实现的更多相关文章
- JS bind()方法、JS原生实现bind()
一.arguments的含义 // arguments 是一个对应于传递给函数的参数的类数组对象 function a(){ console.log(arguments); } a(); // Arg ...
- js bind
1.作用 函数的bind方法用于将函数体内的this绑定到某个对象,然后返回一个新函数. //bind 相比于call apply this 都等于 obj; bind是产生一个新的函数 不执 ...
- js bind绑定事件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Js/Bind()的认识
1.bind( eventType [, eventData], handler(eventObject))2.向绑定的对象上面提供一些事件方法的行为.其中三个参数的意义分别代表: 一.eventTy ...
- js bind 绑定this指向
1.示例代码 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UT ...
- js bind es5函数柯里化
绑定函数 bind()最简单的用法是创建一个函数,使这个函数不论怎么调用都有同样的this值.常见的错误就像上面的例子一样,将方法从对象中拿出来,然后调用,并且希望this指向原来的对象. 如果不做特 ...
- bind,call,apply区别
js中bind.call.apply函数的用法 2015-02-27 21:16:39 标签:javascript js bind call apply 原创作品,允许转载,转载时请务必以超链接形式 ...
- Atitti.数据操作crud js sdk dataServiceV3设计说明
Atitti.数据操作crud js sdk dataServiceV3设计说明 1. 增加数据1 1.1. 参数哦说明1 2. 查询数据1 2.1. 参数说明2 3. 更新数据2 3.1. 参数说明 ...
- javascript深入理解js闭包(转)
javascript深入理解js闭包 转载 2010-07-03 作者: 我要评论 闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现. ...
随机推荐
- 02.List泛型集合
List泛型可以转换成数组 List泛型和数组的相同点: List泛型的数据类型必须是指定的,数组的数据类型也必须是指定的. List泛型和数组的不同点: List泛型的长度是随意的,而数组的长度必须 ...
- OpenLayers3 实现自定义放大缩小滑块,自定义方向按钮
由于项目需要,需要自定义滑块.为此记录如下: <div id="map" class = "map"> <div id = "zoo ...
- Web程序中使用EasyUI时乱码问题
今天偶然遇见使用easyUI时,弹窗和分页都是乱码的问题,耗费了很长的时间来解决,以此记住这个坑. 相信大家都会在使用easyUI时都会设置这样一句: 那么就有可能出现设置中文后的乱码问题,如下图: ...
- Java 的版本历史与特性
Java SE 8[2014-03-14发行] Lambda表达式 Pipelines和Streams Date和Time API Default方法 Type注解 Nashhorn JavaScri ...
- Windows10 iis10 arr webfarm
win10安装arr提示安装失败,但是安装说明中提升iis7及以上版本,iis10却安装失败,坑爹!安装方法: 1.HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSe ...
- OLEDB 调用存储过程
除了常规调用sql语句和进行简单的插入删除操作外,OLEDB还提供了调用存储过程的功能,存储过程就好像是用SQL语句写成的一个函数,可以有参数,有返回值. 存储过程除了像普通函数那样返回一般的值以外, ...
- 【Android】4.0 神一样的仪式感:Android第一个项目HelloWorld——eclipse
进入Eclipse,在左侧栏右击: 新建 “Android Application Project”项目,如果new之后没有,选择“Project”中“Android”目录下的 “Android Ap ...
- JQuery Tips
另一篇文章 JavaScript Tips 1. 获取span标签的值需要用text(); 2. datepicker控件的‘setDate’属性可用于设置默认值: 3. 使用parseFloat转换 ...
- angularJS 单页面 两个及以上个 ng-app 的处理方式
<div ng-app="myApp1" ng-controller="myCtrl1"> 名: <input type="text ...
- CompletionService的poll方法
1.poll():马上返回完成的任务,若没有,则返回null 2.poll(long timeout, TimeUnit unit): 等待timeout时间,如果大于最短任务完成时间,则获取任务结果 ...