模拟 JS 原生 call 函数的实现

最新推荐文章于 2024-04-18 08:57:50 发布
最新推荐文章于 2024-04-18 08:57:50 发布
阅读量2.7k 收藏 3
点赞数 2
分类专栏： JavaScript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_41440282/article/details/81056462
版权

      在前端开发的过程中，js是一个必不可少的技能。而说起js，就不得不提js中一个特别重要的知识点---this，因为js中的 this 的指向和传统的面向对象的语言中 this 的指向有很大的不同。

      而为了让我们开发者能够让 this 按照我们的意愿，指向我们所希望她指向的地方，js给我们暴露出了几种可以硬性的绑定this到指定对象上的方法。它们分别是 call ，apply ，bind。

       笔者之前也只是知道怎么用这些方法，并没有去探索它们内部的实现原理。而作为一个有追求的程序猿，我们不仅要知其然，还要知其所以然，所以今天我就来模拟一下 call 的实现。下面上图：


    不出所料，运行结果为 ‘’


小明爱折腾
关注
  • 2
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
专栏目录
call函数的实现
m0_46639734的博客
04-18 652
call()方法是使用一个指定this值和单独给出的一个或多个参数来调用函数，本文就是手写call方法以上就是call函数的实现，该方法的语法和作用与 apply() 方法类似，只有一个区别，就是 call() 方法接受的是一个参数列表，而 apply() 方法接受的是一个包含多个参数的数组。
JS实现 call 函数
qq_51544319的博客
03-22 198
JS实现call函数
手写call方法，以及call如何实现的解释、原理
Sapling
04-18 367
call方法用于改变this的指向，从而将一个对象的属性或方法在另一个对象方法中使用，实际上内部原理是结合this绑定的规格和给传入对象新增某个方法实现的。
深度解析 JavaScript 中call方法原理
qq_44410862的博客
11-19 2055
一丶深度解析 JavaScript 中call方法原理 call 方法是 Function 类原型上的一个公共方法，我们知道所有的函数都是 Function 类的一个实例(对象)，当然，call函数本身也是Function类的一个实例。 任何一个函数都可以调用call方法，包括call方法本身。函数调用call方法时，是把函数作为Function的实例也就是对象身份的。 function fn1() {} console.log(Function.prototype.call.__proto__ === F
js使用用最简单的方法实现call，看了就会
Big_YiFeng的博客
06-07 350
手写一个call方法可以利于自己更好的理解this，而且面试有时候也会遇到
JS 中Call函数的实现
weixin_54607676的博客
07-27 210
代码】JS中Call函数的实现。
原生js代码能实现call和bind吗
10-16
因此，我们可以说，尽管可以尝试理解 `call` 和 `bind` 的工作原理，并编写一些近似的实现，但这些模拟版并不能替代原生功能，尤其是对于性能敏感的应用。 总的来说，了解 `call` 和 `bind` 的基本概念和工作原理对...
js代码-实现一个 call 函数
07-14
实现一个简单的`call`函数，我们需要模拟这个过程，主要包含以下步骤： 1. 获取传入函数（`func`）和上下文（`thisArg`）。 2. 将额外的参数（`arg1, arg2, ..., argN`）包装成数组。 3. 创建一个新的函数，用于执行...
一些常用且实用的原生JavaScript函数
12-08
10. **兼容事件绑定**：`addEventSamp(obj, evt, fn)`函数实现了跨浏览器的事件监听，支持`addEventListener`（现代浏览器）和`attachEvent`（IE）。 11. **移除事件**：`removeEventSamp(obj, evt, fn)`函数与事件...
js中的call方法并模拟实现自己的call方法
前端三脚猫的博客
06-02 729
定义 先来看下call()方法，在mdn中的定义： call() 方法使用一个指定的 this 值和单独给出的一个或多个参数来调用一个函数。（其实就是改变函数的this指向，并且调用该函数） 语法 Function.call(thisObj, res1, res2, …); call方法传递两个参数，第一个参数传递的是所要改变指向的值(当该函数处于非严格模式下，则指定为 null 或 undefined 时会自动替换为指向全局对象，原始值会被包装。)，后面是所要传递的参数（参数可以为多个）。 返回值 返回调
带你手动实现call方法，让你收获满满
少油少盐不要辣
05-05 1068
1.首先，了解call方法的要点 语法：function.call(thisArg, arg1, arg2, ...) 参数： 1.thisArg 在 function 函数运行时使用的 this 值。请注意，this可能不是该方法看到的实际值：如果这个函数处于非严格模式下，则指定为 null 或 undefined 时会自动替换为指向全局对象，原始值会被包装。 this指向：非严格模式下，指向...
原生实现call、apply方法
smallsun
06-17 6166
大学的时候，一位大佬跟我说，让我用原生写一下call、apply方法，我没写。直到现在。。。。拖延症真的不是吹的。call先来看官方解释：call()方法调用一个函数，其具有一个指定的this值和分别地提供的参数（参数的列表）。也就是说使用call方法，你可以指定被调用函数的this值，并且给他传参数。接下来我们自己实现一个call方法。1、模拟如何指定this的值先来看一段代码function ...
JS call方法原理
liubangbo的专栏
11-15 8014
原文转自：https://blog.csdn.net/u010377383/article/details/80646415 前言 本来计划是, 先把深入React技术栈过完,  但是，现在在满足RN app开发情况下，我还是先深入js一个系列。 （一）call源码解析 首先上一个call使用 function add(c, d) {   return this.a + this.b + c...
原生js中apply()和call()
王中博的博客
01-08 308
每个函数都包括两个非继承而来的方法：apply（）和call（）。两者用途都是在特定的作用域中调用函数，等于重新设置了函数体内this对象的值。 两者区别仅在于接收参数方式不同，apply（）第一个参数是调用apply的函数运行的作用域，的第二个参数可以是Array的实例（数组），也可以是arguments对象，call（）第一个参数是this的值没有变化，而其余参数都直接传递给函数（也就是逐个
手动实现call() , apply() , bind()
南风
08-01 7151
这篇文章简单的介绍了实现call() , apply() , bind()的思路 实现call(obj,arg,arg....) 将目标函数的this指向传入的第一个对象，参数为不定长，且立即执行 实现思路 改变this指向：可以将目标函数作为这个对象的属性 利用arguments类数组对象实现参数不定长 不能增加对象的属性，所以在结尾需要delete 那么怎么将不定长的参数传递给函数...
call、apply及bind的实现原理
zl13015214442的博客
07-15 2115
1. call和apply call 和 apply 的功能相同，都是改变 this 的执行，并立即执行函数。区别在于传参方式不同。 func.call(thisArg, arg1, arg2, ...)：第一个参数是 this 指向的对象，其它参数依次传入。 func.apply(thisArg, [argsArray])：第一个参数是 this 指向的对象，第二个参数是数组或类数组。 2. c...
【Javascript高级知识】封装实现一个自己的call, apply, bind函数（原生版+ES6版）
小牛itbull的博客
06-27 706
call, apply, bind的模拟实现 call的模拟实现 // 使用原生的ES3语法实现的call Function.prototype._call = function() { var context = context || window; context.fn = this; var args = []; ...
call和apply实现原理
浅听记忆的博客
08-27 796
call：它的作用是改变调用者的this指向到指定的对象上面，并将调用者执行之后返回给自己 var person = { fullName: function(city, country) { return this.firstName + " " + this.lastName + "," + city + "," + country; } } var person1 = { firstName:"Bill", lastName: "Gates" } person.fullNa
call的实现原理及一个很好的应用场景
lzr_must的博客
08-11 765
call方法是js中比较重要的一个知识点，看了很多介绍也未必能够对他有个深刻的理解，那就让我们看看他的实现原理吧。 //这个方法只是简单的模拟了call的实现原理，对context是否非空，参数对象素组字符串的类型都没有做处理。 Function.prototype.call2 = function(context) { context.fn = this; var args = [
自定义函数，使用原生JS代码实现字符串翻转
最新发布
06-26
这里是一个使用原生JS代码实现的简单字符串翻转函数： ```javascript function reverseString(str) { // 使用split(), reverse()和join()方法 return str.split('').reverse().join(''); } // 示例用法 let ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值