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

 更新时间:2019年07月31日 15:05:59   作者:前端前端前端   我要评论
这篇文章主要介绍了原生js代码能实现call和bind吗,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

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});

以上代码的执行结果是

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

对比于函数自带的call:

show.call({haha:122})

其结果为

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

核心

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

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

相关文章

  • JAVASCRIPT IE 与 FF中兼容问题小结

    JAVASCRIPT IE 与 FF中兼容问题小结

    在不同浏览器中对于一些属性的支持也不一样,下面是对ie和firefox的一些小结。
    2009-02-02
  • 最简短的拖动对象代码实例演示

    最简短的拖动对象代码实例演示

    最简短的拖动对象代码实例演示...
    2006-11-11
  • 第五章之BootStrap 栅格系统

    第五章之BootStrap 栅格系统

    Bootstrap,来自 Twitter,是目前最受欢迎的前端框架。本文给大家介绍BootStrap 栅格系统的相关资料,需要的朋友可以参考下
    2016-04-04
  • 中文字符串截取的js函数代码

    中文字符串截取的js函数代码

    有时在显示某段文字的时候,可能会太长,影响我们页面的显示效果。如果仅是英文,那么我们可以用String.substring(start, end)函数就已经够用了。但是通常我们都会遇到既有英文,又有汉字的情况。而汉字是占用2个字节的,如果用String.substring(start, end)截取字符串的话,会发现汉字截取后比英文截取后个数虽然相同,但是长度还是长出去不少(具体要视字符个数来决定)
    2013-04-04
  • ExtJs异步无法向外传值和赋值的完美解决办法

    ExtJs异步无法向外传值和赋值的完美解决办法

    这篇文章主要介绍了ExtJs异步无法向外传值和赋值的完美解决办法,需要的朋友可以参考下
    2017-06-06
  • 关闭页面时window.location事件未执行的原因分析及解决方案

    关闭页面时window.location事件未执行的原因分析及解决方案

    最近在做一个项目的时候,遇到个问题,就是关闭页面时window.location事件未执行,百思不得其解,度娘上搜了一下才知道具体原因,记录一下
    2014-09-09
  • 浅谈用Webpack路径压缩图片上传尺寸获取的问题

    浅谈用Webpack路径压缩图片上传尺寸获取的问题

    下面小编就为大家分享一篇浅谈用Webpack路径压缩图片上传尺寸获取的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-02-02
  • 关于iframe跨域POST提交的方法示例

    关于iframe跨域POST提交的方法示例

    这篇文章主要给大家介绍了关于iframe跨域POST提交的相关资料,文中给出了详细的介绍与示例代码,相信对大家的学习或者工作具有一定的参考借鉴价值,需要的朋友可以一起来学习学习。
    2017-01-01
  • js轮盘抽奖实例分析

    js轮盘抽奖实例分析

    这篇文章主要为大家详细介绍了js轮盘抽奖实例,分析js轮盘抽奖实现原理,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-08-08
  • 获得Javascript对象属性个数的示例代码

    获得Javascript对象属性个数的示例代码

    这篇文章主要是对获得Javascript对象属性个数的示例代码进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2013-11-11

最新评论