[Typescript] Prevent Type Widening of Object Literals with TypeScript's const Assertions

const assertion is a special type assertion that uses the const keyword instead of a specific type name. When using a const assertion on an object literal expression, all properties will become readonly properties and no literal types within the expression will be widened.

 

const ORIGIN = {
    x: 0,
    y: 0
}

// works
ORIGIN.x = 1

 

If you don't want user able to change it:

const ORIGIN: {
    readonly x: number,
    readonly y: number
} = {
    x: 0,
    y: 0
}
// Typescript complian
// Cannot assign to 'x' because it is a read-only property.
ORIGIN.x = 1

 

Better way:

const ORIGIN = {
    x: 0,
    y: 0
} as const
// Typescript complian
// Cannot assign to 'x' because it is a read-only property.
ORIGIN.x = 1

[Typescript] Prevent Type Widening of Object Literals with TypeScript's const Assertions

 

But `as const` doesn't enforce in runtime. If we do want to prevent mutate the object, we can do:

const ORIGIN = Object.freeze({
    x: 0,
    y: 0
} as const)
// Typescript complian
// Cannot assign to 'x' because it is a read-only property.
ORIGIN.x = 1

 

上一篇:vue中事件修饰符,stop,prevent,capture,self,once


下一篇:jianyong面试简答题