关于javascript:Typescript中具有Null和Nullable Object声明的联合类型之间的区别

Difference between Union Types with Null and Nullable Object declaration in Typescript

最近,我在一个更大的角度项目中发现了一些打字稿代码,该项目的对象声明中包含Bitwise-OR / Pipe-Symbol。
像这样:

1
dataSource: FileSource | null;

以我的理解,它是FileSource类型的对象,也可以为空。

1
2
3
dataSource = null; // Works
dataSource = new FileSource... // Works
dataSource = 32; // Error


我还发现,您可以像这样声明带有完整数据类型集的对象:

1
myVariable: number | string | null;

现在到我的实际问题:
我也可以将带有问号的对象声明为可为空的符号。
这两个声明之间有什么区别吗?

1
2
myVariable: FileSource | null;
mySecondVariable?: FileSource;

如果这两者之间没有区别,您会认为这是一种不好的做法,因为这在其他语言中并不常见,并且没有有效的JavaScript代码?

顺便说一句:在Javascript中:

1
2
myVariable: Number | null;
myVariable ="Hello World";

会没事的。

我的重点是对象的可空性以及这些声明的不同之处


Is there any difference between these two declarations?

是的,尤其是对于严格的空检查。 必须提供具有联合类型(|符号)的属性,并且其值必须与这些类型之一匹配。

可选属性(用?声明)就是:可选。 完全不需要该对象。 虽然如此,但至少在目前,TypeScript对待prop?: X的方式与prop: X | undefined完全相同。 请参见jcatz指出的这个问题。

如果没有严格的null检查,这很好:

1
2
3
4
5
6
7
8
9
type A = {
    dataSource: Date | null
};
type B = {
    dataSource?: Date
};

const a: A = { dataSource: null }; // Works
const b: B = { dataSource: null }; // Also works

使用严格的空检查,第二个错误:

1
2
3
4
5
6
7
8
9
type A = {
    dataSource: Date | null
};
type B = {
    dataSource?: Date
};

const a: A = { dataSource: null }; // Works
const b: B = { dataSource: null }; // Error: Type 'null' is not assignable to type 'Date | undefined'.

操场上的现场例子

类似地,如果没有严格的null检查,则分配undefined会很好,但是使用它们,在联合类型的情况下是错误的:

1
2
3
4
5
6
7
8
9
type A = {
    dataSource: Date | null
};
type B = {
    dataSource?: Date
};

const a: A = { dataSource: undefined }; // Error: Type 'undefined' is not assignable to type 'Date | null'.
const b: B = { dataSource: undefined }; // Works

操场上的现场例子


有一个很大的不同。 ?修饰符实际上等效于| undefined

这些是完全等效的:

1
2
myVariable: FileSource | undefined;
mySecondVariable?: FileSource;