JS 手写 call( )

最新推荐文章于 2024-04-10 18:00:15 发布
最新推荐文章于 2024-04-10 18:00:15 发布
阅读量491 收藏
点赞数 1
分类专栏： 代码 前端面试题 文章标签： js javascript es6
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_47021982/article/details/113946301
版权

JS 手写 call( )


<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        Function.prototype.myCall = function (thisArg) {
            //判断指定this的类型 
            if (thisArg === null || thisArg === undefined) {
                thisArg = window;
            }
            if (typeof thisArg !== 'undefined' && typeof thisArg !== 'function' && typeof thisArg !== 'object') {
                thisArg = Object(thisArg);
            }

            //获取用户给被call调用的函数的参数
            var argArr = Array.from(arguments).slice(1);

            //给thisArg扩展一个方法 这个方法就是调用call的那个函数this
            //创建一个独一无二的值，作为thisArg的方法key
            var uniqKey = Date.now().toString(36);
            thisArg[uniqKey] = this;

            //调用thisArg的uniqKey方法，此时 调用call的fn函数将被调用
            //并且this也指向了thisArg
            //因为我们还要把参数也传递进去，所以目前需要使用eval方法
            eval("var re = thisArg[uniqKey](" + argArr.toString() + ")");

            //删除给thisArg扩展的方法
            delete thisArg[uniqKey];

            //其实call的返回值 就是被调用函数的返回值 也就是this的返回值
            return re;
        }



        var obj = {
            name: "laowang"
        }

        function fn(a, b, c) {
            console.log(this, a + b + c);
            // return "hello"
        }
        var re = fn.myCall(obj, 1, 2, 3);
        console.log(re)
    </script>
</body>

</html>
木森林哥哥
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
js代码-手写call
07-14
// 使用手写call const anotherObj = { name: 'Bob' }; obj.greet.myCall(anotherObj, 'Hi'); // 输出：Hi, Bob! ``` 在这个例子中，`anotherObj.greet`不存在，所以我们借用`obj.greet`并使用`myCall`将`this`指向...
【JavaScript】手写call
wangjiakang12306的博客
01-19 988
Function.prototype.call = function(context) { // 判断传入的context是不是null或者undefined，如果是的话，将context设置为全局对象 if(!context) { context = typeof window === 'undefined' ? global : window; } context.fn = this// this是指向当前函数 let res = [...arguments].sl.
JavaScript 手写call 函数
qq_46679991的博客
06-21 111
【代码】JavaScript 手写call 函数。
【JS】手写call
最新发布
owo_ovo的博客
04-10 354
js手写call
JS手写代码：apply、call、bind，认识arguments，箭头函数中没有arguments，纯函数，slice纯函数，splice不是纯函数
米儿的博客
11-08 861
一、call函数实现 // 给所有的函数添加一个hycall的方法 Function.prototype.hycall = function(thisArg, ...args) { // 在这里可以去执行调用的那个函数(foo) // 问题: 得可以获取到是哪一个函数执行了hycall // 1.获取需要被执行的函数 var fn = this // 2.对thisArg转成对象类型(防止它传入的是非对象类型) thisArg = (thisArg !== null &
js需要掌握手写的方法
Dayer的博客
03-06 648
1、手写深拷贝 function deepClone(obj = {}) { if (typeof obj != "object" || obj == null) { return obj; } let result; if (obj instanceof Array) { result = []; } else { result = {}; } for (let .
js手写call
qq_44066732的博客
09-01 74
【代码】js手写call。
JS进阶第一篇：手写call apply bind
qq_49900295的博客
11-28 607
一定要弄清楚谁是这个被执行的方法，就是调用call的函数，而fn2现在的身份是替代window作为fn1的直接调用者，这是理解call和apply的关键，也可以运行下。如果 newTest 是我们 new 出来的 man 实例，那根据原型链的知识，定义在man的原型对象上的方法肯定会被继承下来，所以我们通过 newTest.sayHi 调用能正常输出 hello 么？在实现手写bind方法的过程中，看了许多篇文章，答案给的都很统一，准确，但是不知其所以然，所以我们就好好剖析一下bind方法的实现过程。
原生JS手写实现call方法
qq_38017118的博客
03-07 198
在本篇文章中，我们手写实现了JavaScript中的 call 方法，并讨论了如何使用它来调用函数。假设我们有一个函数 foo，并且我们想要使用 call 方法来调用它，同时将 this 绑定到一个新的上下文对象 context 上，同时还要传入参数 arg1, arg2, ...。需要注意的是，虽然手写实现 call 方法可以帮助我们更好地理解其底层实现原理，但在实际开发中，建议使用JavaScript内置的 call 方法，因为它已经被广泛测试和优化，并具有更好的性能和可靠性。// 输出 'Toms'
手写js中的call 方法（原理分析）
qq_48959471的博客
04-03 741
我们通常使用call 来 修改某个对象的指向，但是你了解其中的原理吗？ 1.首先所有构造函数都能使用，说明什么？ 其实call 本身是构造函数原型上的一个方法 即（Function.prototype上的方法） 2.为什么能使用传入的对象中的属性呢？ 实则是在传入的对象中，又声明了此构造函数（函数），则构造函数中就能使用此对象中的属性啦 明白了这两点，我们就开始实现咯，上代码！ Function.prototype.newCall =function(obj,...args){
JS学习笔记—手写封装call、apply 、 bind 函数和new的实现
阿周的博客
04-25 863
一、实现call函数 Function.prototype.myCall = function(context) { if (typeof this !== 'function') { throw new TypeError('Error') } //当传入的context为基础类型时，直接挂载fn会报错 if(typeof context !== 'object') ...
JS手写实现call、apply、bind(超详细)
CreatorRay的博客
02-22 2813
好久不更新了哦，最近又在找工作。复习一下JS中非常重要的一部分内容，关于this指向的问题 常规的this指向可以简单总结为谁引用就指向谁，找不到谁引用就指向window。 this指向中还有非常重要的一部分，就是改变this指向的方法。原生JS提供了call、apply、bind三种方式来修改this指向，三种方式各有特点，各有应用场景。 在如今的前端面试中，会用call、apply、bind已经达不到要求了，要能够知道原理并手写实现。 原生call的使用 先看一下原生call的使用方式。 funct.
JavaScript常见手写方法
Dimuzero的博客
09-10 285
1.手写instanceof function myInstanceof(A, B) { a = A.__proto__; b = B.prototype; while (true) { if (a == b) { return true; } else { return false; } a = A.__proto__; } } 2.手写
JS常见手写代码汇总
qq_40022256的博客
06-14 301
二、lazyman 三、LRU 最近最少使用 四、数组扁平化 //数组深度扁平化 五、获取数据类型 六、深拷贝考虑到 Map Set WeakMap WeakSet等特殊类型 七、数组转树 /* const arr = [ { id: 1, name: ‘部门A’, parentId: 0 }, // 0 代表顶级节点，无父节点 { id: 2, name: ‘部门B’, parentId: 1 }, { id: 3, name: ‘部门C’, parentId: 1 }, { id: 4, na
js 手写 call,apply,bind
qq_40868156的博客
11-30 245
js手写call,apply,bind，手写，js，面试题
手写call、apply、bind及相关面试题解析
weixin_34194702的博客
01-18 831
它们有什么不同？怎么用？ call 接收多个参数，第一个为函数上下文也就是this，后边参数为函数本身的参数。 let obj = { name: "一个" } function allName(firstName, lastName) { ...
前端知识体系(4)-js手写函数篇
weixin_39818813的博客
07-13 2113
毕业4年了，今年5月20号跟谈了7年的女朋友回老家领了结婚证。谈得确实久了，领证的时候两人都很平淡。结婚证拿到手，我们相视而笑，是的，我们结婚了，7年，幸好没有遇上人们常说的七年之痒。 同年毕业的很多对情侣，如今大多各奔东西了。那些说好要走一辈子的人，大多在毕业的时候已经忘记彼此的承若，而那些平平淡淡的反而在一起更长久。 15年10月份，我们来到了深圳龙华的一家房地产公司实习，那时候学校来了40多个人，如今还剩下3个，剩者为王，可能说的就是他们。如果他们都在深圳买了房子，是的，毕业4年就在深圳买了房..
Javascript系列(六)：手写call/apply/bind函数
今天的我还菜嘛
03-07 505
简单介绍 共同点： call apply bind 三个函数是Function对象中自带的方法，都是用来改变函数的this对象指向。 不同点： 第一个参数都是this要指向的对象，也就是想指定的上下文； call的第二个参数以逗号隔开，apply传入的是数组，bind第二个参数以逗号隔开； bind 是返回对应函数，便于稍后调用；apply 、call 则是立即调用； 手写call函数 Function.prototype.myCall = function(thisArg, ...args) {
【JS】手写实现call、apply
m0_57946086的博客
04-14 1139
目录 1、call、apply作用、区别 2、实际开发中call、apply的应用场景 3、手写_call函数 4、手写_bind函数 1、call、apply作用、区别 作用：改变this指向。 区别：参数的区别。call传数据，apply传数组 2、实际开发中call、apply的应用场景 js的继承：1）原型链继承；2）构造函数继承-call实现； js的数据类型-Object.prototype.toString.call()； es5把伪数组转化成数组-Array
js手写call bind apply
05-09
好的，以下是手写 `call`、`bind` 和 `apply` 的实现： ```javascript // 手写 call Function.prototype.myCall = function(context, ...args) { context = context || window; const fn = Symbol(); context[fn...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值