美文网首页
js中 call apply bind的区别

js中 call apply bind的区别

作者: 幻影道哥 | 来源:发表于2024-08-07 09:57 被阅读0次

最近在回顾以前的知识,整理下这三位this指向的使用。
在 JavaScript 中,call()apply()bind() 是函数原型上的方法,它们可以用来改变函数的 this 指向。

  1. call() 方法用于调用一个函数,并将第一个参数作为 this 的值,后续参数作为函数的参数。
  2. apply() 方法与 call() 类似,但第二个参数是一个数组,该数组包含要传递给函数的参数。
  3. bind() 方法创建一个新的函数,并将第一个参数作为 this 的值,后续参数作为新函数的参数。

下面是一个使用这些方法的示例代码片段:

function greet(greeting, punctuation) {
  console.log(`${greeting}, ${this.name}${punctuation}`);
}

const person = { name: 'John Doe' }; // 假设这是一个对象

// 使用 call() 方法调用函数,并设置 this 为 person 对象
greet.call(person, 'Hello', '!'); // 输出 'Hello, John Doe!'

// 使用 apply() 方法调用函数,并设置 this 为 person 对象
greet.apply(person, ['Hi', '.']); // 输出 'Hi, John Doe.'

// 使用 bind() 方法创建一个新的函数,并设置 this 为 person 对象
const boundGreet = greet.bind(person, 'Hey', '?');
boundGreet(); // 输出 'Hey, John Doe?'

在这个示例中,我们定义了一个名为 greet 的函数,它接受两个参数:greetingpunctuation。然后,我们定义了一个名为 person 的对象,其中包含一个 name 属性。

我们使用 call() 方法调用 greet 函数,并将 person 对象作为 this 的值,同时传递 'Hello''!' 作为参数。这会输出 'Hello, John Doe!'

我们还使用 apply() 方法调用 greet 函数,并将 person 对象作为 this 的值,同时传递一个包含 'Hi''.' 的数组作为参数。这会输出 'Hi, John Doe.'

最后,我们使用 bind() 方法创建一个新的函数 boundGreet,并将 person 对象作为 this 的值,同时传递 'Hey''?' 作为参数。然后,我们调用 boundGreet 函数,它会输出 'Hey, John Doe?'

相关文章

  • js中 call apply bind的理解

    js中的call apply bind都是用来改变this指向的 call apply bind都是用来改...

  • call apply

    js基础知识---call,apply,bind的用法 call,apply详解 javascript中,call...

  • 理解JS中的 call, apply, bind方法

    call, apply, bind 方法的目的和区别 我们常说,call(), apply(),bind()方法的...

  • this_原型链_继承

    this相关问题 apply、call 、bind的作用以及区别 call、apply和bind方法的用法以及区别...

  • this&原型链&继承

    this 1. apply、call 、bind有什么作用,什么区别? apply、call 、bind 都是用来...

  • 关于 this_原型链_继承 相关问题总结

    关于this 1- apply、call 、bind的作用和区别 apply、call 、bind都有改变thi...

  • js小知识

    1. call、apply和bind的区别 call、apply和bind方法都是函数对象中的方法,用来动态地改变...

  • this_原型链_继承

    this 相关 1. apply、call 、bind有什么作用,什么区别 apply、call、bind可以改变...

  • this_原型链_继承

    问题1: apply、call 、bind有什么作用,什么区别? apply和call call apply,调用...

  • this_原型链_继承

    问题1: apply、call 、bind有什么作用,什么区别 在JavaScript中, call和apply都...

网友评论

      本文标题:js中 call apply bind的区别

      本文链接:https://www.haomeiwen.com/subject/cpwxkjtx.html