apply和call在Javascript中的使用与区别

apply和call在js中的使用与区别：

字符串格式化：

${占位符}

name='小帅'
console.log(`我是${name}`) //我是小帅

在这里插入图片描述

apply:

语法：function.apply(thisArg, [argsArray])
thisArg：可选参数，指定函数执行时的上下文（即函数内部的this值）。
argsArray：可选参数，是一个类数组对象，包含传递给函数的参数列表。
作用：将一个对象作为函数的上下文（this值），并以数组形式传递参数，然后调用该函数。
参数一：对象参数二：数组

function greet(name) {
  console.log(`Hello, ${name}!`);
}
const person = {
  name: 'Alice'
};

greet.apply(person, ['Bob']);
// 输出：Hello, Bob!
greet(person.name)
//Hello, Alice!

分析：

person调用greet函数但是并没有使用自身的参数，而是使用外部的.

person.greet 参数就是自身的name值.

call:

语法：function.call(thisArg, arg1, arg2, ...)
thisArg：可选参数，指定函数执行时的上下文（即函数内部的this值）。
arg1, arg2, ...：可选参数，是按顺序传递给函数的参数列表。
作用：将一个对象作为函数的上下文（this值），然后按参数列表传递参数，调用该函数。
参数一：对象，参数二、参数三、参数四

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

const person = {
  name: 'Alice'
};

greet.call(person, 'Bob');
// 输出：Hello, Bob!

总结：

function greet() {
  console.log(`Hello, ${this.name}!`);//不传递参数
}

const person1 = { name: 'Alice' };
const person2 = { name: 'Bob' };

//
// 使用apply()调用greet()，并指定执行上下文为person1
greet.apply(person1); // 输出：Hello, Alice!

// 使用call()调用greet()，并指定执行上下文为person2
greet.call(person2); // 输出：Hello, Bob!