Here are two Typescript tricks to make your life as a software developer easier.
Make an interface that has any number of attributes of a specific type
Ever wondering if you can find a middle ground between the any
type and of a specific type/interface ?
The answer is yes!
You can make an interface that contains any number of attributes of a specific type while having the ability to have any attribute name:
interface Person { name: string; age: number; } interface FlexInterface { [index: string]: Person; } // now you can use it like const Group: FlexInterface = { alice: { name: 'Alice Byers', age: 24 }, brian: { name: 'Brian Sanders', age: 16 } }; // still this will fail! const Group2: FlexInterface = { alice: { name: 'Alice Byers', age: 24 }, brian: { name: 'Brian Sanders', age: 16 }, // Type 'string' is not assignable to type 'Person' matt: 'Mathew' };
Taking advantage of this technique you can create flexible types without using type any
!
Create a type that has a partial match of another type
This effectively means that we can match any number of properties of a given type:
interface Person { name: string; age: number; } type PartialPerson = Partial<Person>; function updatePerson(personToUpdate: Person, attributes: PartialPerson) { return { ... personToUpdate, ...attributes }; } let person: Person = { name: 'John Doe', age: 8 }; // this works as expected const attrs1: PartialPerson = { age: 38 }; // this will fail const attrs2: PartialPerson = { hobbies: ['chess', 'swimming', 'coding'] }; person = updatePerson(person, attrs1);
I you have some tips and tricks of your own feel free to share them in the comments below!
Happy coding :)
Credits
Photo by Yogendra Singh from Pexels
Top comments (1)
If I'm not wrong,
Partial
transforms all the type properties into optional properties. I prefer using thePick
utility. That way, I get the types I need but also keeping all the properties required.