JavaScript的this、call、apply、bind方法概述

2023-11-25 03:52:54

this在JavaScript中的作用

在JavaScript中，this代表当前函数的执行上下文。
执行上下文是指函数在执行时所处的环境，包括函数本身、函数的参数、局部变量和全局变量。
this关键字指向执行上下文中的当前对象。

改变this指向

call、apply和bind方法都可以改变函数的执行上下文，从而改变this指向。
call和apply方法直接调用函数，而bind方法返回一个新的函数，这个函数的this指向被固定为bind方法的第一个参数。
这三个方法的语法格式如下：

call(thisArg, arg1, arg2, ...)
apply(thisArg, [args])
bind(thisArg, arg1, arg2, ...)

thisArg参数指定要将this指向的对象。
arg1、arg2等参数是传递给函数的实参。

call和apply方法

call和apply方法直接调用函数。
call方法将this指向设置成thisArg，并将后续参数作为实参传递给函数。
apply方法将this指向设置成thisArg，并将第二个参数作为数组形式的实参传递给函数。

bind方法

bind方法返回一个新的函数，这个函数的this指向被固定为bind方法的第一个参数。
当调用bind返回的函数时，this指向被固定为bind方法的第一个参数，并且bind方法的后续参数作为实参传递给函数。

示例

function greet(name) {
  console.log(`Hello, ${name}!`);
}

const person = {
  name: 'John Doe',
  greet: greet
};

person.greet('Jane Doe'); // Hello, Jane Doe!

greet.call(person, 'Jane Doe'); // Hello, Jane Doe!

greet.apply(person, ['Jane Doe']); // Hello, Jane Doe!

const greetJane = greet.bind(person, 'Jane Doe');

greetJane(); // Hello, Jane Doe!