当我将接口的任何属性设置为可选时,并将其成员分配给其他变量,如下所示:

interface Person {
  name?: string,
  age?: string,
  gender?: string,
  occupation?: string,
}

function getPerson() {
  let person = <Person>{name:"John"};
  return person;
}

let person: Person = getPerson();
let name1: string = person.name; // <<< Error here 

我得到如下错误:

TS2322: Type 'string | undefined' is not assignable to type 'string'.
Type 'undefined' is not assignable to type 'string'.

如何避免这个错误呢?


当前回答

你试图设置变量name1,女巫类型设置为严格的字符串(它必须是字符串),值从对象字段名,女巫值类型设置为可选字符串(它可以是字符串或未定义,因为问题符号)。如果你真的需要这种行为,你必须像这样改变name1的类型:

let name1: string | undefined = person.name;

一切都会好的;

其他回答

也有同样的问题。

我发现react-scrips添加了“strict”:true到tsconfig.json。

在我移除它之后,一切都很好。

Edit

需要警告的是,更改此属性意味着:

不再对潜在的运行时错误发出警告。

正如保罗在评论中指出的那样!谢谢!

只有在你完全理解它的影响时才使用"strict": false !

你试图设置变量name1,女巫类型设置为严格的字符串(它必须是字符串),值从对象字段名,女巫值类型设置为可选字符串(它可以是字符串或未定义,因为问题符号)。如果你真的需要这种行为,你必须像这样改变name1的类型:

let name1: string | undefined = person.name;

一切都会好的;

为了避免我使用的编译错误

let name1:string = person.name || '';

然后验证空字符串。

一种更适合生产环境的处理方法是实际确保存在名称。假设这是一个由一组人参与的大型项目的最小示例,您不知道getPerson将来会发生怎样的变化。

if (!person.name) {
    throw new Error("Unexpected error: Missing name");
}

let name1: string = person.name;

或者,您可以将name1键入为字符串| undefined,并进一步处理未定义的情况。但是,最好尽早处理意外错误。

你也可以让TypeScript通过省略显式类型来推断类型:let name1 = person.name这仍然可以防止name1被重新分配为一个数字,例如。

你可以使用NonNullable实用程序类型:

例子

type T0 = NonNullable<string | number | undefined>;  // string | number
type T1 = NonNullable<string[] | null | undefined>;  // string[]

文档。