类型“null”不可分配给 TypeScript 中的类型
Type ‘null’ is not assignable to type in TypeScript
使用联合类型解决 TypeScript 中的“Type ‘null’ is not assignable to type”错误,例如name: string | null
. 特定值的类型必须接受null
,因为如果它不接受并且您已strictNullChecks
启用 in
tsconfig.json
,则类型检查器会抛出错误。
以下是错误发生方式的 2 个示例。
// 👇️ Function return value set to object function getObj(): Record<string, string> { if (Math.random() > 0.5) { // ⛔️ Error Type 'null' is not assignable to type // 'Record<string, string>'.ts(2322) return null; } return { name: 'Tom' }; } interface Person { name: string; // 👈️ name property set to string } const obj: Person = { name: 'Tom' }; // ⛔️ Type 'null' is not assignable // to type 'string'.ts(2322) obj.name = null;
第一个示例中的函数返回一个null
值或一个对象,但我们没有指定该函数可能返回null
。
第二个示例中的对象string
的属性类型为name
,但我们试图将属性设置为null
并得到错误。
您可以使用
联合类型
来解决错误。
// 👇️ using union function getObj(): Record<string, string> | null { if (Math.random() > 0.5) { return null; } return { name: 'Tom' }; } interface Person { // 👇 using union name: string | null; } const obj: Person = { name: 'Tom' }; obj.name = null;
我们使用联合类型将函数的返回值设置为具有字符串键和值的对象或null
.
这种方法允许我们从函数返回一个对象或一个null
值。
在第二个示例中,我们将name
对象中的属性设置为string
or类型null
现在我们可以将属性的值设置为 ,null
而不会出现错误。
如果您必须访问该name
属性,例如调用其toLowerCase()
上的方法,则必须使用类型保护,因为该属性可能是
null
.
interface Person { // 👇 using union name: string | null; } const obj: Person = { name: 'Tom' }; // ⛔️ Error: Object is possibly 'null'.ts(2531) obj.name.toLowerCase();
您可以使用简单的
类型保护来解决这个问题。
interface Person { // 👇 using union name: string | null; } const obj: Person = { name: 'Tom' }; if (obj.name !== null) { // ✅ Now obj.name is string console.log(obj.name.toLowerCase()); }
“类型‘null’不可分配给类型”错误可以通过
在文件中设置strictNullChecks
为来抑制。false
tsconfig.json
{ "compilerOptions": { "strictNullChecks": false, // ... 👇️ rest } }
当strictNullChecks
设置为false
,null
并且undefined
被语言忽略。
这是不可取的,因为它会在运行时导致意外错误。
当您设置strictNullChecks
为true
,null
并undefined
拥有自己的类型时,当需要不同类型的值时使用它们时会出现错误。
结论
使用联合类型解决 TypeScript 中的“Type ‘null’ is not assignable to type”错误,例如name: string | null
. 特定值的类型必须接受null
,因为如果它不接受并且您已strictNullChecks
启用 in
tsconfig.json
,则类型检查器会抛出错误。