类型“未知”不可分配给 TypeScript 中的类型

Type ‘unknown’ is not assignable to type in TypeScript

当我们尝试将类型为unknown的值分配给不同类型的值时，会发生“Type ‘unknown’ is not assignable to type”错误。要解决该错误，请在赋值之前使用类型断言或类型保护来验证两个值是否具有兼容的类型。

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

索引.ts


const a: unknown = 'James';

// ⛔️ Error: Type 'unknown' is
// not assignable to type 'string'.ts(2322)
const b: string = a;

该a变量的类型为
unknown。

这通常发生在从远程 API 获取数据时，因为 TypeScript 不知道我们正在使用的值的形状。

该unknown类型是的类型安全对应物any。

如果您确定特定值具有兼容类型，但 TypeScript 不知道，请使用
类型断言，例如value as RightType。

索引.ts


const a: unknown = 'James';

const b: string = a as string;

当我们有关于 TypeScript 不知道的值类型的信息时，使用类型断言。

我们有效地告诉 TypeScript 该a变量将是一个字符串，不用担心。

现在左侧和右侧的值具有兼容的类型，赋值不会导致错误。

另一种解决方案是使用
类型保护。

索引.ts


const a: unknown = 'James';

let b = '';

if (typeof a === 'string') {
  b = a;
}

console.log(b); // 👉️ "James"

在进行赋值之前，我们明确检查变量是否a存储类型值。string

TypeScript 知道一旦我们进入if块中，变量就保证是一个字符串。 a

在处理unknown类型时，我们基本上告诉 TypeScript——我们将获得这个值，但我们不知道它的类型。我们只是要检查几个if语句来跟踪它并安全地使用它。在if
块中，为我们提供对检查的特定类型的支持。

下面是一个在处理对象时如何使用类型保护的例子。

索引.ts


const person: unknown = {
  name: 'James',
  country: 'Chile',
};

type Person = {
  name: string;
  country: string;
};

// 👇️ checks if obj has properties of Person
function isPerson(obj: any): obj is Person {
  return (
    typeof obj === 'object' &&
    obj !== null &&
    'name' in obj &&
    'country' in obj
  );
}

let james: Person;

if (isPerson(person)) {
  // 👉️ person has type of Person here
  james = person;
} else {
  james = { name: '', country: '' };
}

console.log(james); // 👉️ {name: 'James', country: 'Chile'}

我们使用
用户定义的类型保护
来检查对象是否具有该Person类型的所有属性。

obj is Person语法是类型谓词，其中必须是函数采用的参数的名称。 obj

如果isPerson函数返回true，TypeScript 知道传入的值是类型的Person，并允许我们将其分配给变量。

上面的示例只是简单地检查传入的值是否为对象并包含name和country属性。

我们还必须检查null，因为在 JavaScript（和 TypeScript）中，
typeof null返回"object"。

如果person变量不存储兼容类型的值，我们将使用默认值。

您还可以在初始化变量时设置默认值。

索引.ts


const person: unknown = {
  name: 'James',
  country: 'Chile',
};

type Person = {
  name: string;
  country: string;
};

// 👇️ set defaults upon initialization
let james: Person = {
  name: '',
  country: '',
};

// 👇️ checks if obj has properties of Person
function isPerson(obj: any): obj is Person {
  return (
    typeof obj === 'object' &&
    obj !== null &&
    'name' in obj &&
    'country' in obj
  );
}

if (isPerson(person)) {
  // 👉️ person is type Person here
  james = person;
}

// 👇️ {name: 'James', country: 'Chile'}
console.log(james);

您是否能够使用此方法取决于您的用例。

目标是确保分配的左侧和右侧的值具有兼容的类型。

Here is an example of how to use a type guard to check if a value of type
unknown is an array.

index.ts


const data: unknown = [
  {
    name: 'James',
    country: 'Chile',
  },
  {
    name: 'Alice',
    country: 'Germany',
  },
];

type Person = {
  name: string;
  country: string;
};

let people: Person[] = [];

if (Array.isArray(data)) {
  people = data as Person[];
}

// [
//   { name: 'James', country: 'Chile' },
//   { name: 'Alice', country: 'Germany' }
// ]
console.log(people);

We used the Array.isArray() method to check if the data variable stores an
array before the assignment.

You might have to be more strict and check if the array has any elements and whether they contain specific properties, etc.

Conclusion #

To solve the “Type ‘unknown’ is not assignable to type” TypeScript error, use
a type assertion or a type guard to verify that the two values have compatible
types before the assignment. The error is caused when a value of type unknown
is assigned to a value that expects a different type.

–