JS 手写 bind( )

太过爱你忘了你带给我的痛 2022-10-31 12:23 205阅读 0赞

### JS 手写 bind( ) ###

<!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.myBind = function (thisArg) { 
                //这个位置的this指向的是上下文对象fn
                var _this = this;
                var argArr = Array.from(arguments).slice(1);
                return function () { 
                    //当返回的函数一旦调用 就改变fn的this指向 并调用fn
                    //这里的this指向要看返回的这个函数是怎么被调用的
                    // 所以这里不能直接使用this
                    return _this.apply(thisArg, argArr);
                }
            }
    
            var obj = { 
                name: "laowang"
            }
    
            function fn(a, b) { 
                console.log(this, a + b)
                return "hello"
            }
    
            //返回了改变this指向的fn函数（调用了reFn1 就相当于调用了改变this指向的fn）
            var reFn1 = fn.bind(obj, 1, 2);
            console.log(reFn1()) //最终的结果就是改变了fn的指向 并调用了fn
    
            var reFn2 = fn.myBind(obj, 1, 2);
            //只要调用了reFn函数，那么就代表 fn的this指向了obj，并且fn调用了
            // console.log(reFn2);
            console.log(reFn2());
        </script>
    </body>
    
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，205人围观）

还没有评论，来说两句吧...

相关阅读

相关 JS 面试问题: 手写 apply/call/bind ️♀️

这是比较经典的面试题, 要明白考点就是函数调用时this究竟是谁的问题, 明白了这点一切就好说了.

秒速五厘米/ 2024年05月24日 03:20/ 0 赞/ 61 阅读

相关手写call,apply,bind实现

call,apply,bind函数其本质是实现改变函数上下文环境,即改变this call实现 Function.prototype._call = f...

待我称王封你为后i/ 2024年04月17日 13:53/ 0 赞/ 70 阅读

相关手写apply-call-bind

文章目录 1.回顾函数对象的原型关系 2.手写apply函数 3.手写call函数 4.封装函数实现apply和ca

r囧r小猫/ 2023年10月02日 19:56/ 0 赞/ 1 阅读

相关 [JavaScript]深入理解arguments，aplly，call，bind，手写bind

此文为进阶理解，如果不熟悉标题中的arguments，aplly，call，bind，先去看他们的作用与基本用法这里将简易版的手写bind放在开头，方便快速查阅

以你之姓@/ 2022年12月10日 11:26/ 0 赞/ 209 阅读

相关手写实现bind()

> 逐步实现js的`bind`方法 > > 1. 原函数无参数版 `bind` > 2. 原函数带参数版 `bind` > 3. 区分原函数是否作为构造函数一.

淩亂°似流年/ 2022年11月21日 09:45/ 0 赞/ 197 阅读

相关 JS 手写 bind( )

JS 手写 bind( ) <!DOCTYPE html> <html lang="en"> <head> <

太过爱你忘了你带给我的痛/ 2022年10月31日 12:23/ 0 赞/ 206 阅读

相关手写 call、apply 及 bind 函数

手写 call、apply 及 bind 函数一、介绍 1）call apply bind 功能：重定义 this 对象 bind 返回的是一个新函数，必须调

川长思鸟来/ 2022年09月08日 06:20/ 0 赞/ 187 阅读

相关 js手写bind

首先解释一下bind： > bind() 方法会创建一个新函数。当这个新函数被调用时，bind() 的第一个参数将作为它运行时的 this，之后的一序列参数将会在传递的实参前

布满荆棘的人生/ 2022年05月05日 14:58/ 0 赞/ 250 阅读

相关 JS手写代码Call、apply、bind

call 一句话介绍 call： > call() 方法在使用一个指定的 this 值和若干个指定的参数值的前提下调用某个函数或方法。举个例子： var

r囧r小猫/ 2022年01月26日 07:49/ 0 赞/ 263 阅读

相关 JavaScript系列—手写bind()函数

本人在一次面试中，当面试官小姐姐让我重写一下bind函数的时候，一下子蒙圈了，所以特来研究一下。在手写bind函数之前，我们先来回顾一下三剑客 1.call,apply

迈不过友情╰/ 2022年01月05日 12:23/ 0 赞/ 268 阅读