Interfaces
Interfaces are used to “shape” an object by describing a certain set of members and/or type annotations.
Syntax
Interfaces may be declared by:
- Starting with the
interface
keyword. - Giving the interface a name.
- Creating an object that contains a set of members and/or type annotations.
interface myType {memberOne: string;memberTwo: number;};let myVar: myType = {"My favorite number is ", 42 };
Dog
Interface Example
In this example, the Dog
interface declares fluffy
and woof
members. Any value declared to be of type Dog
is therefore known to have those members:
interface Dog {fluffy: boolean;woof(): string;}function interactWithDog(dog: Dog) {dog.woof();if (dog.fluffy) {console.log('What a floof!');}dog.bark();// Error: Property 'bark' does not exist on type 'Dog'.}
Members that do not exist in the interface, such as bark()
, cannot be accessed and will throw a type error
Optional Members
Here, the Pet
interface uses ?
to set name
as an optional member. The only member that is required is species
. Declaring an object of type Pet
doesn’t need a name
but does need a species
:
interface Pet {name?: string;species: string;}let anonymous: Pet = { // Okspecies: "Dog";};let named: Pet = {name: "Emerald",species: "Budgie",};let invalid: Pet = {name: "My Rock",}// Error: Property 'species' is missing in type// '{ name: string; }' but required in type 'Pet'.
Interface Extensions
Interfaces may be marked as extending another interface. Doing so indicates that the derived child interface (the interface extending others) includes all members from the base parent interfaces (the interface being extended).
To mark an interface as extending other(s), add the extends
keyword after its name followed by any number of interfaces to extend, with ,
commas between interface names.
In this example, the Cat
interface is given a .walk()
method by being an extension of the Animal
interface. However, instance of type Animal
don’t have access to members and methods defined in the Cat
interface:
interface Animal {walk(): void;}interface Cat extends Animal {fluffy: boolean;purr(): string;}function workWithAnimals(animal: Animal, cat: Cat) {animal.walk(); // Ok: defined on Animalcat.walk(); // Ok: Cat extends Animalif (cat.fluffy) {// Ok: defined on Catconsole.log('Floof!!');cat.purr(); // Ok: defined on Cat}animal.purr();// Error: Property 'purr' does not exist on type 'Animal'.}
All contributors
- BrandonDusch580 total contributions
- christian.dinh2476 total contributions
- Anonymous contributorAnonymous contributor3071 total contributions
- Anonymous contributorAnonymous contributor95 total contributions
- BrandonDusch
- christian.dinh
- Anonymous contributor
- Anonymous contributor
Looking to contribute?
- Learn more about how to get involved.
- Edit this page on GitHub to fix an error or make an improvement.
- Submit feedback to let us know how we can improve Docs.