原生js代码能实现call和bind吗


Posted in Javascript onJuly 31, 2019

js手动实现call和bind都是谎言

网上有很多关于说自己实现call和bind的原理的文章,然而call和bind的原理真如他们所说的那样吗?今天就让我来推翻这些所谓的”原理“,揭开谎言下的真相。

首先看看网上对call的实现:

// 手写 call
Function.prototype.mycall = function (context) {
  context = context || window;
  context.fn = this;
  const args = [...arguments].slice(1);
  const result = context.fn(...args);
  // 执行fn时上下文context已被修改,不是我们所期望的call 
  delete context.fn;
  return result;
}
function show() {
  console.log(this);
}
show.mycall({haha:122});

以上代码的执行结果是

原生js代码能实现call和bind吗

如你所见,这样实现的call并不是我们所期望的那样。

对比于函数自带的call:

show.call({haha:122})

其结果为

原生js代码能实现call和bind吗

分析其原因不难发现,根据函数mycall,执行context.fn(...args)之前修改了上下文context,所以执行fn时所使用的上下文是修改后的上下文,导致与预期结果相差甚远。

核心

而且,往更深的层次去思考,call绝不是这样(或类似这样)实现的,call是底层语言为浏览器封装好的函数,是绝对不能也没必要用js强行模仿的。

综上,js模仿call和bind绝对没有get到底层原理,这样的模仿只能用于娱乐而已,没有实际价值。bind和call类似,这里就不赘述了。

Javascript 相关文章推荐
基于jquery完美拖拽,可返回拖动轨迹
Mar 29 Javascript
js 验证身份证信息有效性
Mar 28 Javascript
jQuery中removeProp()方法用法实例
Jan 05 Javascript
jQuery实现的图片分组切换焦点图插件
Jan 06 Javascript
Windows下用PyCharm和Visual Studio开始Python编程
Oct 26 Javascript
jquery特效 点击展示与隐藏全文
Dec 09 Javascript
JS之获取样式的简单实现方法(推荐)
Sep 13 Javascript
Angularjs的Controller间通信机制实例分析
Nov 07 Javascript
AngularJS+Bootstrap实现多文件上传与管理
Nov 08 Javascript
jQuery插件Echarts实现的渐变色柱状图
Mar 23 jQuery
uni-app使用countdown插件实现倒计时
Nov 01 Javascript
react+antd 递归实现树状目录操作
Nov 02 Javascript
微信小程序下拉框搜索功能的实现方法
Jul 31 #Javascript
javascript中undefined的本质解析
Jul 31 #Javascript
JavaScript实现的3D旋转魔方动画效果实例代码
Jul 31 #Javascript
vue 实现滚动到底部翻页效果(pc端)
Jul 31 #Javascript
js实现一个简易计算器
Mar 30 #Javascript
微信小程序iBeacon测距及稳定程序的实现解析
Jul 31 #Javascript
JS获取动态添加元素的方法详解
Jul 31 #Javascript
You might like
分页显示Oracle数据库记录的类之二
2006/10/09 PHP
PHP syntax error, unexpected $end 错误的一种原因及解决
2008/10/25 PHP
ThinkPHP中limit()使用方法详解
2016/04/19 PHP
PHP云打印类完整示例
2016/10/15 PHP
详解EventDispatcher事件分发组件
2016/12/25 PHP
PHP以json或xml格式返回请求数据的方法
2018/05/31 PHP
Javascript+XMLHttpRequest+asp.net无刷新读取数据库数据
2009/08/09 Javascript
用按钮控制iframe显示的网页实现方法
2013/02/04 Javascript
jquery取子节点及当前节点属性值的方法
2014/09/09 Javascript
jQuery实现弹出窗口中切换登录与注册表单
2015/06/05 Javascript
Javascript实现div的toggle效果实例分析
2015/06/09 Javascript
JS实现完全语义化的网页选项卡效果代码
2015/09/15 Javascript
浅析JavaScript声明变量
2015/12/21 Javascript
利用Js的console对象,在控制台打印调式信息测试Js的实现
2016/11/26 Javascript
AngularJS使用拦截器实现的loading功能完整实例
2017/05/17 Javascript
使用nvm管理不同版本的node与npm的方法
2017/10/31 Javascript
Python中字典创建、遍历、添加等实用操作技巧合集
2015/06/02 Python
Python简单计算文件MD5值的方法示例
2018/04/11 Python
pandas pivot_table() 按日期分多列数据的方法
2018/11/16 Python
python实现批量修改服务器密码的方法
2019/08/13 Python
python3 assert 断言的使用详解 (区别于python2)
2019/11/27 Python
IronPython连接MySQL的方法步骤
2019/12/27 Python
如何在 Django 模板中输出 "{{"
2020/01/24 Python
python 实现在shell窗口中编写print不向屏幕输出
2020/02/19 Python
python GUI库图形界面开发之PyQt5拖放控件实例详解
2020/02/25 Python
Python三维绘图之Matplotlib库的使用方法
2020/09/20 Python
意大利男装网店:Vrients
2019/05/02 全球购物
学校安全责任书
2014/04/14 职场文书
3的组成教学反思
2014/04/30 职场文书
单位租房协议范本
2014/12/03 职场文书
实习科室评语
2015/01/04 职场文书
党员转正意见怎么写
2015/06/03 职场文书
走进科学观后感
2015/06/18 职场文书
护士旷工检讨书
2015/08/15 职场文书
2016年小学推普宣传周活动总结
2016/04/06 职场文书
解决hive中导入text文件遇到的坑
2021/04/07 Python