javascript - function.apply(argument1, array) 不从数组中获取所有值

Question

function.apply 未在我的数组中注册第一个参数(索引 0)。

我尝试过剩余/扩展语法，并且 下面的代码似乎工作正常:

let sayName = function (object, ...languages) {
    console.log(`My name is ${this.name} and I speak ${languages.join(', ')}`);
};

let stacy = {
    name: 'Stacy',
    age: 34
};

let languages = ['Javascript', 'CSS', 'German','English', 'Spanish'];
sayName(stacy, ...languages);

但是下面的代码不起作用，显式绑定(bind)function.apply:

let languages1 = ['Javascript', 'CSS', 'German','English', 'Spanish'];
sayName.apply(stacy, languages1) 

结果总是遗漏数组中的 0 索引，即“Javascript”不包含在输出中。

我做错了什么？

Answer 1

您的函数似乎需要一个 object 参数，但从您如何使用 apply 调用它来看，这是不正确的。当您调用 apply 或 call 时，该方法的第一个参数用于设置函数执行上下文的 this 值。它不会作为参数传递。

当您的函数引用 this 时，正确设置 this 非常重要，因此使用 apply 或 call 是不错的选择。

所以改变:

let sayName = function (object, ...languages) {

至:

let sayName = function (...languages) {

请注意，您在函数代码中无论如何都没有使用 object。

在不调用 apply 而是直接调用该函数的版本中，您可以:

sayName(stacy, ...languages);

...但是这里的 this 对象不会被正确设置。您应该使用 call 来确保 this 引用 stacy:

sayName.call(stacy, ...languages);

查看 apply 的文档:

Syntax

function.apply(thisArg, [argsArray])

Parameters

thisArg

Optional. The value of this provided for the call to func. [...]

argsArray

Optional. An array-like object, specifying the arguments with which func should be called. [...]

面向对象编程，一种更好的方法

现在，退一步来说，您确实应该将 sayName 定义为原型(prototype)方法，并像这样构造 stacy:

class Person {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }
    sayName(...languages) {
        console.log(`My name is ${this.name} and I speak ${languages.join(', ')}`);
    }
}

let stacy = new Person('Stacy', 34);
let languages = ['Javascript', 'CSS', 'German','English', 'Spanish'];
stacy.sayName(...languages);

...为什么不实际将一个人所说的语言也存储为属性，并从方法中删除 console.log ，因为应该由调用者决定将应进行输出(可能输出到文件或 HTML 元素):

class Person {
    constructor(name, age) {
        this.name = name;
        this.age = age;
        this.languages = [];
    }
    speaks(...languages) {
        this.languages = languages;
    }
    introduction() {
        return `My name is ${this.name} and I speak ${this.languages.join(', ')}`;
    }
}

let stacy = new Person('Stacy', 34);
stacy.speaks('Javascript', 'CSS', 'German','English', 'Spanish');
console.log(stacy.introduction());