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语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现. ...
随机推荐
- navicat 12 破解
一.安装 官方下载下载 http://www.navicat.com.cn/download/navicat-premium 二.安装完后下载破解文件 https://pan.baidu.com/s/ ...
- css-css简介
CSS:层叠样式表 ** 层叠:一层一层的 ** 样式表:很多的属性和属性值 * 使页面显示效果更好 * CSS将网页内容和显示样式进行分离,提高了显示功能.
- scss-@for 指令
此指令用于循环输出,具有两种循环方式,下面分别做一下介绍. (1).@for $var from <start> through <end>: 此种方式的遍历索引区间是[sta ...
- JavaScript彻底搞懂apply和call方法
彻底搞懂JavaScript中的apply和call方法 call和apply都是为了改变某个函数运行的context上下文而存在的,即为了改变函数体内部this的指向.因为JavaScript的函数 ...
- Instance Segmentation入门总结
前一阵子好忙啊,好久没更新了.最近正好挖了新坑,来更新下.因为之前是做检测的,而目前课题顺道偏到了instance segmentation,这篇文章简单梳理一下从检测.分割结果到instance s ...
- 从软件工程师的角度看MacBook Air的几个设计亮点
我多年从事软件开发和运营工作,从未跟“设计”间断过.现在在设计一个全新saas产品:超级表格(www.domypp.com).最近买了台苹果最新款的笔记本电脑MacBook Air,从该产品功能设计和 ...
- 性能优化小Tips
Performance Tips 这篇文章主要是介绍了一些小细节的优化技巧,当这些小技巧综合使用起来的时候,对于整个App的性能提升还是有作用的,只是不能较大幅度的提升性能而已.选择合适的算法与数据结 ...
- 防反编译、混淆文件proguard.cfg与proguard-project.txt详解
在新版本的ADT创建项目时,混码的文件不再是proguard.cfg,而是project.properties和proguard-project.txt. 如果需要对项目进行全局混码,只需要进行一步操 ...
- LeetCode刷题系列——Add Two Numbers
题目链接 这个题目很简单,归并而已,好久没练编程,居然忘了在使用自定义类型前,要进行初始化(new操作). class ListNode{ int val; ListNode next; ListNo ...
- CSS3控制单行文本的溢出
text-overflow用来设置是否使用一个省略标记(...)标示对象内文本的溢出.语法: 但是text-overflow只是用来说明文字溢出时用什么方式显示,要实现溢出时产生省略号的效果,还须定义 ...