迹忆客 专注技术分享

当我们调用一个带有 1 个参数但没有传递任何参数的函数时，会出现错误“Expected 1 argument, but got 0”。 要解决该错误，请将所需参数传递给函数，为其提供默认值或将参数标记为可选。

看下面的代码

function getMessage(message: string) {
  return message || '';
}

// ⛔️ Error: Expected 1 arguments, but got 0.ts(2554)
// index.ts(1, 21): An argument for 'message' was not provided.
getMessage();

getMessage 函数接受 1 个参数，但我们试图在不传递任何参数的情况下调用它，这导致了错误。

解决错误的一种方法是将正确类型的参数传递给函数。

function getMessage(message: string) {
  return message || '';
}

// 👇️ call function with parameter
getMessage('hello world');

如果我们不想在调用函数时总是必须提供参数，请为其设置一个默认值。

function getMessage(message = 'hello world') {
  return message || '';
}

getMessage();

我们为 message 参数提供了默认值，因此现在我们可以调用 getMessage 函数而不向其传递任何参数。

这隐式地将消息参数标记为可选并将其类型设置为字符串。 TypeScript 能够根据默认值的类型推断出参数的类型。

如果没有适合您的用例的默认值，您可以将该参数标记为可选。

function getMessage(message?: string) {
  return message || '';
}

getMessage();

我们使用问号将消息参数设置为可选。

这意味着我们可以调用 getMessage 函数而无需向其传递消息参数，这会将其值设置为未定义。

如果你的函数接受一个对象作为参数，你可以为整个对象提供一个默认值。

type Person = {
  name: string;
  age: number;
};

function getPerson(person: Person = { name: '', age: 0 }) {
  return person;
}

getPerson();

如果在没有 person 参数值的情况下调用 getPerson 函数，它将默认为指定的对象。

我们还可以使用解构来不必访问 person 对象的属性。

type Person = {
  name: string;
  age: number;
};

function getPerson({ name, age }: Person = { name: '', age: 0 }) {
  return { name, age };
}

getPerson();

如果我们不想为对象中的每个属性设置默认值，可以将部分或全部属性标记为可选。

type Person = {
  name?: string; // 👈️ optional
  age?: number; // 👈️ optional
};

function getPerson(person: Person = {}) {
  return person;
}

getPerson();

Person 类型中的所有属性都标记为可选，因此我们可以将空对象设置为 person 参数的默认值。

如果我们有一个包含函数属性的接口，则语法非常相似。

interface Employee {
  increaseSalary: (salary?: number) => number;
}

const emp: Employee = {
  increaseSalary(salary = 100) {
    return salary + 123;
  },
};

console.log(emp.increaseSalary()); // 👉️ 246

我们定义了一个 Employee 接口，它有一个函数类型的 increaseSalary 属性。

我们将 salary 属性标记为可选，因此函数的调用者不需要提供它。

我们在 increaseSalary 函数中为 salary 属性设置默认值 100。

如果我们使用类型别名来键入您的函数，则可以使用相同的语法。

type Greet = (name?: string) => string;

const greet: Greet = (name = 'James Doe') => {
  return `Hello ${name}`;
};

console.log(greet()); // 👉️ "Hello James Doe"

greet 函数有一个标记为可选的名称参数。

我们已经为参数设置了一个默认值，因此调用者不需要提供它。