call、apply&bind

最新推荐文章于 2024-11-02 12:42:04 发布

进击阿文

最新推荐文章于 2024-11-02 12:42:04 发布

阅读量120

点赞数

分类专栏： JavaScript 文章标签： javascript

本文链接：https://blog.csdn.net/weixin_43565079/article/details/120291196

版权

JavaScript 专栏收录该内容

21 篇文章 0 订阅

订阅专栏

本文详细讲解了JavaScript中bindThis函数的三种实现方式，包括call、apply和bind，并通过实例说明它们在改变函数上下文中的作用。理解这些概念有助于在实际编程中灵活操控函数行为，如让Bob.up方法在Allen对象上调用。

摘要由CSDN通过智能技术生成

封装函数 f，使 f 的 this 指向指定的对象

function bindThis(f, oTarget) {
    return function(){
       return f.call(oTarget, ...arguments)
    }
}

function bindThis(f, oTarget) {
    return function(){
       return f.apply(oTarget, arguments)
    }
}

function bindThis(f, oTarget) {
    return f.bind(oTarget)
}

解释call、apply和bind，举个例子

    <script>
        const Bob = {
            name: 'Bob',
            score: 90,
            up: function (num){
                this.score = num
            }
        }
        const Allen = {
            name: 'Allen',
            score: 60,
        }
        console.log(Bob) /* {name: "Bob", score: 90, up: ƒ} */
        Bob.up(100)
        console.log(Bob);/* {name: "Bob", score: 100, up: ƒ} */
        console.log(Allen);/* {name: "Allen", score: 60} */

        Bob.up.call(Allen, 70)
        console.log(Allen);/* {name: "Allen", score: 70} */

        Bob.up.apply(Allen, [80])
        console.log(Allen);/* {name: "Allen", score: 80} */
        
        const upup = Bob.up.bind(Allen)
        upup(90)
        console.log(Allen);/* {name: "Allen", score: 90} */
    </script>

现在有Bob和Allen两个同学，Bob成绩好score，他有一个刷题秘籍up，只要想要多少分通过那个up就可以实现。但是Allen没有那个up刷题秘籍，他想提分，就只能找Bob借刷题秘籍，Bob也愿意借给他，然后Allen就可以使用Bob的刷题秘籍up了。

Bob.up.call(Allen,70),Bob把up秘籍借给Allen，Allen将分数提到了70分。

Bob.up.apply(Allen,[80]),同样借出去了，但是通过apply借出去分数得用【】包起来（）这是规定。

const upup = Bob.up.bind(Allen)；upup(90). 通过bind的方式借出去，Allen珍惜这次机会，可以灵活地在想刷分的时候刷分即可。