[Typescript] Excess property checking
typescript Property checking
2023-09-14 08:59:12 时间
TypeScript helps us catch a particular type of problem around the use of object literals. Let’s look at the situation where the error arises:
// @errors: 2345
function printCar(car: {
make: string
model: string
year: number
chargeVoltage?: number
}) {
// implementation removed for simplicity
}
printCar({
make: "Tesla",
model: "Model 3",
year: 2020,
chargeVoltage: 220,
color: "RED", // <0------ EXTRA PROPERTY
})
The important part of this error message is:
Object literal may only specify known properties, and ‘color’ does not exist in type <the type the function expects>
In this situation, within the body of the printCar
function, we cannot access the color
property since it’s not part of the argument type. Thus, we’re defining a property on this object, that we have no hope of safely accessing later on!
Try fixing this three ways in the TypeScript playground:
- Remove the
color
property from the object - Add a
color: string
to the function argument type - Create a variable to hold this value, and then pass the variable into the
printCar
function
相关文章
- [Typescript] Write clean Type 1 - Generic slots, using built-in types as much as possible
- [Typescript] Builder pattern - 03
- [Typescript] getProp<T, P extends PathKeys<T>>(obj: T, path: P): PropType<T, P>
- [Typescript] 117. Hard - ClassPublicKeys
- [Typescript] 85. Medium - IsInteger
- [Typescript] 71. Medium - Trunc
- [Typescript] TypeScript module Augmentation
- [Typescript] Get a TypeScript package ready for release to NPM
- [Typescript challenge] 19. Medium - Tuple to Union
- [Typescript] 25. Medium - Trim Left
- [Typescript] Recursive types (JSONValue)
- [Typescript] Filtering properties out
- [Typescript] Making TypeScript Stick - 3
- [React Typescript 2022] Use TypeScript to Type a React Class Component
- [Typescript] Prevent Type Widening of Object Literals with TypeScript's const Assertions
- [Typescript] Extend Functionality of a TypeScript Class with Decorators
- [Typescript] Make your optional fields required in TypeScript
- [Typescript] Make TypeScript Class Usage Safer with Strict Property Initialization
- [Typescript] Generics using TypeScript
- [TypeScript] Function Overloads in Typescript
- [Typescript Challenges] 144 Hard - Transpose
- [Typescript] The partial Inference Problem
- [Typescript] Using Extract type until to get the value from Union type
- [Typescript] @typescript-eslint/unbound-method
- [Typescript] Get All of an Object’s Values
- [Typescript 4.9] Auto-Accessors in Classes
- [Typescript] 92. Medium - PathParams
- [Typescript] Get a TypeScript package ready for release to NPM
- [Typescript] Making TypeScript Stick - 3
- [Typescript] Excess property checking
- [Typescript] Narrow the unknown Type with TypeScript's Assertion Functions
- [Typescript] Simplify iteration of custom data structures in TypeScript with iterators (backwards iteration with for ... of.. loop)
- [TypeScript] Transform Existing Types Using Mapped Types in TypeScript
- [VueJS + Typescript] Decouple Dependencies Using IoC Containers in Vue with TypeScript and InversifyJS
- [Vue + TS] Use Properties in Vue Components Using @Prop Decorator with TypeScript
- [TypeScript] Type check JavaScript files using JSDoc and Typescript 2.5
- [TypeScript] Union Types and Type Aliases in TypeScript
- [TypeScript] Avoid any type
- TypeScript class 的访问控制
- Vue+TS/Typescript:Property does not exist on type ‘(() => any) | ComputedOptions<any>‘