js学习-apply,call,bind的实现
目录
apply
简单说:构建一个和调用aplly函数一样的字符串,用eval执行,完了之后删除掉,最后返回执行的结果。
Function.prototype.applyCopy = function() {
var obj = arguments[0];
obj.fn = this;
var args = arguments[1];
if(!args || args.length == 0) return obj.fn();
// obj.fn参数
var argsStr = '';
for(var i in args) {
argsStr += '"' + arguments[1][i] + '",';
}
var result = eval('obj.fn('+argsStr.replace(/,$/, '')+')');
delete obj.fn;
return result;
};
call
Function.prototype.callCopy = function() {
var obj = [].shift.applyCopy(arguments);
return this.applyCopy(obj, arguments);
}
bind
Function.prototype.bindCopy = function() {
var _this = this;
var obj = arguments[0];
return function() {
return _this.applyCopy(obj, arguments);
}
}
demo
var s = {
desc: 's.desc',
name: '你好',
}
var name = 'window';
var desc = 'window => this'
function sayHi(age, type) {
return {
name: this.name,
desc: this.desc,
age: age,
type: type
}
}
console.log(sayHi(12,'sayHi'));
console.log(sayHi.applyCopy(s, [12, 'applyCopy']));
console.log(sayHi.callCopy(s, 12, 'callCopy'));
console.log(sayHi.bindCopy(s)(12, 'bindCopy'));
总结:apply是基础,call,bind都是在apply的基础上实现的。
js学习-apply,call,bind的实现的更多相关文章
- JS之apply,call,bind区别
为了加深对基础知识的理解,今天再复习下js中的apply,call,bind的区别和用法.整理笔记的过程也是一个再次学习的过程. apply和call js中的调用apply和call方法可以改变某个 ...
- JS中用apply、bind实现为函数或者类传入动态个数的参数
为纪念10年没写blog,第一篇博文就以这样一个有趣的窍门开始吧 -___- 在ES5中,当我们调用一个函数时,如果要传入的参数是根据其他函数或条件判断生成的,也就是说不确定会传入多少个参数时,在不改 ...
- js学习进阶中-bind()方法
有次面试遇到的,也是没说清楚具体的作用,感觉自己现在还是没有深刻的理解! bind():绑定事件类型和处理函数到DOM element(父元素上) live():绑定事件到根节点上,(document ...
- 使用call、apply和bind解决js中烦人的this,事件绑定时的this和传参问题
1.什么是this 在JavaScript中this可以是全局对象.当前对象或者任意对象,这完全取决于函数的调用方式,this 绑定的对象即函数执行的上下文环境(context). 为了帮助理解,让我 ...
- JS核心系列:浅谈 call apply 与 bind
在JavaScript 中,call.apply 和 bind 是 Function 对象自带的三个方法,这三个方法的主要作用是改变函数中的 this 指向,从而可以达到`接花移木`的效果.本文将对这 ...
- js里function的apply vs. bind vs. call
js里除了直接调用obj.func()之外,还提供了另外3种调用方式:apply.bind.call,都在function的原型里.这3种方法的异同在stackoverflow的这个答案里说的最清楚, ...
- JS中的call、apply、bind方法
JS中的call.apply.bind方法 一.call()和apply()方法 1.方法定义 call方法: 语法:call([thisObj[,arg1[, arg2[, [,.argN]]] ...
- js中call、apply、bind那些事
前言 回想起之前的一些面试,几乎每次都会问到一个js中关于call.apply.bind的问题,比如- 怎么利用call.apply来求一个数组中最大或者最小值 如何利用call.apply来做继承 ...
- 前端总结·基础篇·JS(三)arguments、callee、call、apply、bind及函数封装和构造函数
前端总结系列 前端总结·基础篇·CSS(一)布局 前端总结·基础篇·CSS(二)视觉 前端总结·基础篇·CSS(三)补充 前端总结·基础篇·JS(一)原型.原型链.构造函数和字符串(String) 前 ...
随机推荐
- toFixed奇葩问题
1.浮点数运算后的精度问题 在计算商品价格加减乘除时,偶尔会出现精度问题 // 加法 ===================== 0.1 + 0.2 = 0.30000000000000004 0.7 ...
- CVPR2020:端到端学习三维点云的局部多视图描述符
CVPR2020:端到端学习三维点云的局部多视图描述符 End-to-End Learning Local Multi-View Descriptors for 3D Point Clouds 论文地 ...
- Spring4
Spring javaEE开发一站式框架 web层:SpringMVC Service层:Spring的Bean管理(IoC).Spring声明式事务 Dao层:Spring的jdbc模板.Sprin ...
- js正则中文
hi,大家好 今天跟小伙伴们浅谈以下如何用正则表示中文以及如何去运用.众所周知中文在计算机中是不能进行存储的.那我们是以什么办法让我们和计算机进行更好的沟通呢?常用的几种中文编码格式utf-8编码ut ...
- 【NX二次开发】Block UI 图层
属性说明 常规 类型 描述 BlockID String 控件ID Enable Logical 是否可操作 Group Logical ...
- [Linux]经典面试题 - 网络基础 - TCP三次握手
[Linux]经典面试题 - 网络基础 - TCP三次握手 目录 [Linux]经典面试题 - 网络基础 - TCP三次握手 一.TCP报文格式 1.1 TCP报头 1.2 报文图例 二.TCP三次握 ...
- Linux关闭打开防火墙命令
Linux下打开和关闭防火墙 1.及时生效,重启后复原 关闭:service iptables stop 开启:service iptalbes start 查看状态:service iptabl ...
- springboot bean的循环依赖实现 源码分析
springboot bean的循环依赖实现 源码分析 本文基于springboot版本2.5.1 <parent> <groupId>org.springframework. ...
- jQuery筛选选择器
<!DOCTYPE html><html><head> <meta http-equiv="Content-type" conten ...
- excel VBA使用教程
1.选择文件--选项 2.选择自定义功能区--开发工具的√勾上