call、apply、bind应用题型

发布时间:2023年12月29日

这道题,考察的是修改this指向,延申到call,apply和bind的作用和区别。

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <style>
       /* 填写样式 */
    </style>
</head>

<body>
    <!-- 填写标签 -->
    <script type="text/javascript">
        // 填写JavaScript
    function bindThis(f, oTarget) {   
        //题目要求我们封装函数f,所以返回的是一个function,封装后的f
        return function(){
            //函数的call方法指定函数内部this的指向
            return f.call(oTarget,...arguments)
            //也可以使用apply,如下
            //return f.apply(oTarget,arguments)
        }
        //或者使用bind(bind函数返回的就是一个function),直接绑定this指向
        //return f.bind(oTarget)
        
    }
    </script>
</body>

</html>

使用call,apply和bind都可以通过这道题。

1.使用call:

call是函数改变this指向的一个方法,题目要求我们封装函数f,所以返回的是一个function,封装后的f,所以在方法中要返回一个function

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

(注意这里的参数调用方法)

2.使用apply?

同理,和call的区别是参数调用是传入一个数组,参数调用方法不一样。

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

(注意这里的参数调用方法)

3.使用bind

函数的bind方法返回的是一个function,所以直接返回bind结果即可。

function bindThis(f, oTarget) {   
        //使用bind(bind函数返回的就是一个function),直接绑定this指向
        return f.bind(oTarget)  
    }

这里多说一句,总结一下考察点: call,apply和bind的作用和区别

call、apply和bind都是JavaScript中Function对象的原型方法,它们的主要作用是改变函数的执行call、apply和bind都是JavaScript中Function对象的原型方法,它们的主要作用是改变函数的执行上下文,即修改函数运行时的this指向

三者之间的主要区别体现在以下几个方面:

1. 传参方式不同:call和bind采用的是列表传参,而apply则可以接受数组或伪数组作为参数。

2. 执行机制有所区别:call和apply是一次性传入参数并立即执行,而bind则是返回绑定了特定this之后的函数,可以在以后的某个时间点进行调用。

3. 应用场景不同:例如,当我们需要在一个对象的方法中使用另一个对象的属性时,就可以利用call、apply或bind来改变方法内部的this指向。

应用场景不同,这里我们用一个例子来辅助理解。

假设我们有一个Person对象和一个sayHello方法,我们希望在调用sayHello方法时,能够将当前对象作为this传入到方法中。

function Person(name) {
? this.name = name;
}

Person.prototype.sayHello = function() {
? console.log('Hello, my name is ' + this.name);
};

现在,我们想要在一个名为john的Person对象上调用sayHello方法,并将当前对象作为this传入到方法中。我们可以使用call、apply或bind来实现这个需求。

1. 使用call:

var john = new Person('John');
john.sayHello.call(john); // 输出:Hello, my name is John

2. 使用apply:

var john = new Person('John');
john.sayHello.apply(john); // 输出:Hello, my name is John

3. 使用bind:

var john = new Person('John');
var boundSayHello = john.sayHello.bind(john);
boundSayHello(); // 输出:Hello, my name is John

在这个例子中,我们可以看到,无论是使用call、apply还是bind,都可以实现将当前对象作为this传入到方法中的目的。

但是,它们的应用场景略有不同:

- call和apply通常用于需要立即执行函数的场景,而bind则通常用于需要将函数绑定到某个对象上,并在以后的某个时间点进行调用的场景。

文章来源:https://blog.csdn.net/m0_62742402/article/details/135281236
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。