javascript - 在 Flow 中定义子类型的正确方法是什么？

Question

在下面的代码示例中，目的是 scrapeMovies 函数只接受可序列化的对象。

/* @flow */

type SerializableObjectType = {
  [key: string]: string | number | boolean | $ReadOnlyArray<SerializableObjectType> | SerializableObjectType
};

type GuideType = {|
  rid: string
|};

const guide: GuideType = {
  rid: 'foo'
};

const scrapeMovies = async (guide: SerializableObjectType) => {};

scrapeMovies(guide);

https://flow.org/try/#0PQKgBAAgZgNg9gdzCYAoVAXAngBwKZgDKeATgJYCGMZAXhQEYx4Dy9AVngMYYAquBAXjABvVGDABtANZ4sALjABnDOQB2AcwC6C5WvVgAPmFUBXALb1ShsPThwmFVdYAkAJTwUAJs1UwsAQRISCiwAHmJyKloGJlYObj58AD5rCMpqOkYWdi5eflQAXwBudGx8MABxEzJPPETBEQMxMHJPHRUyDVQDYvROOFVlMHVq2oUqmrr+MCFRcVaFAHIoO0XCktR+wYwlTmD8AFk4ADcyPEUZsApFLFVOMAAKEcmFNKjM2JyE-gBKGZThL1UIo9hRDiczoonqM8D8ikA

我不明白是什么原因flowtype提示 scrapeMovies 被喂食 guide 对象，这是对 SerializableObjectType 的不太严格的定义。

在这里定义子类型的正确方法是什么？

Answer 1

传递 GuideType代替 SerializableObjectType是传递更具体类型的实例。流只允许less specific默认情况下，函数中的(逆变/只写)输入。

要使其正常工作，您需要标记 guide参数为 covariant .通过将对象标记为 $ReadOnly<T> ，您实际上会将其标记为协变的:

( Try )

type SerializableObjectType = {
  [key: string]: string | number | boolean | $ReadOnlyArray<SerializableObjectType> | SerializableObjectType
};

type GuideType = {|
  rid: string
|};

const guide: GuideType = {
  rid: 'foo'
};

const scrapeMovies = async (guide: $ReadOnly<SerializableObjectType>) => {};

scrapeMovies(guide);

或者，您可以标记 specific properties as covariant/read-only使用 + checkin 对象类型声明:

( Try )

type SerializableObjectType = {
  +[key: string]: string | number | boolean | $ReadOnlyArray<SerializableObjectType> | SerializableObjectType
};

type GuideType = {|
  rid: string
|};

const guide: GuideType = {
  rid: 'foo'
};

const scrapeMovies = async (guide: SerializableObjectType) => {};

scrapeMovies(guide);

为什么要跳这个舞？为什么输入是协变的/逆变的/无论什么变的都很重要？好吧，如果你试图治疗 guide参数如 SerializeableObjectType (一般对象映射)，你写了一个 number到 rid key ，那个的其他消费者guide对象不会得到他们所期望的。