TS 中的参数不能有问号和初始值设定项

作者

参数在 TS 中不能有问号和初始值设定项

Parameter cannot have question mark and initializer in TS

为解决 TypeScript 中“Parameter cannot have question mark and initializer”错误，在使用等号提供默认值时，不要使用问号将参数设置为可选。

具有默认值的参数暗示是可选的。

下面是错误如何发生的示例。

索引.ts
// ⛔️ Error: Parameter cannot have question mark and initializer.ts(1015)
function sum(a: number, b? = 10) {
  return a + b;
}

问题是我们为参数提供默认值并将其标记为可选，这是隐含的。

去掉问号解决错误

要解决该错误，请删除参数名称旁边的问号。

索引.ts
function sum(a: number, b = 10) {
  return a + b;
}

console.log(sum(5)); // 👉️ 15
console.log(sum(5, 5)); // 👉️ 10

// ✅ With object parameter
function getPerson({
  name = 'Boby Hadz',
  age,
}: {
  name?: string;
  age: number;
}) {
  return { name, age };
}

console.log(getPerson({ age: 30 }));

该b参数的默认值为10。TypeScript 已经知道该参数是可选的，因为我们提供了一个初始化程序。

索引.ts
function sum(a: number, b = 10) {
  return a + b;
}

console.log(sum(5)); // 👉️ 15

如果在sum没有参数值的情况下调用该函数b，则会为其分配默认值10。

请注意，我们也不必指定b 参数的类型。TypeScript 可以根据提供的默认值的类型来推断它。

将参数标记为可选而不提供默认值

如果需要在不提供默认值的情况下将参数标记为可选，请使用问号。

索引.ts
function sum(a: number, b?: number) {
  // 👉️ b is number or undefined here
  if (b !== undefined) {
    return a + b;
  }

  return a + a;
}

console.log(sum(5)); // 👉️ 10
console.log(sum(5, 5)); // 👉️ 10

我们将b参数标记为可选。这意味着它
在函数体中可以是 anumber或具有值。undefined

在必填参数之后声明可选参数

请注意，必需参数不能跟在
可选参数之后，因此您还应该将可选参数声明为最后。

索引.ts
// ⛔️ Error
function sum(a?: number, b: number) {
  if (b !== undefined) {
    return a + b;
  }

  return a + a;
}

另一方面，您可以
在函数参数列表的开头有一个默认参数。

索引.ts
function sum(a = 10, b: number) {
  return a + b;
}

console.log(sum(undefined, 10)); // 👉️ 20

console.log(sum(15, 10)); // 👉️ 25

如果要使用位于函数参数列表开头的默认参数的默认值，请undefined为其传递一个值。

将对象的属性标记为可选

如果您有对象参数并使用默认值，则必须在类型声明中将属性标记为可选。

索引.ts
// ✅ With object parameter
function getPerson({
  name = 'Bobby Hadz',
  age,
}: {
  name?: string;
  age: number;
}) {
  return { name, age };
}

console.log(getPerson({ age: 30 }));

Note that even though we provided a default value for the name property, we
still had to mark it as optional when typing the object.

If you want to set a default value for an entire object, you can type the object
and provide a default value after.

index.ts
function sum({ a, b }: { a: number; b: number } = { a: 10, b: 5 }) {
  return a + b;
}

console.log(sum()); // 👉️ 15

Notice that we provided a default value for the object parameter as a whole and
not for each property.

When providing a default value for the object parameter, you should do it by
using an equal sign = right after the parameter’s type.

# Additional Resources

You can learn more about the related topics by checking out the following
tutorials: