{"id":59662,"date":"2018-05-02T16:41:39","date_gmt":"2018-05-02T11:11:39","guid":{"rendered":"https:\/\/www.vskills.in\/certification\/tutorial\/?p=59662"},"modified":"2024-04-12T14:13:21","modified_gmt":"2024-04-12T08:43:21","slug":"typescript-interfaces","status":"publish","type":"page","link":"https:\/\/www.vskills.in\/certification\/tutorial\/typescript-interfaces\/","title":{"rendered":"TypeScript Interfaces"},"content":{"rendered":"

TypeScript Interfaces<\/h1>\n

One of TypeScript\u2019s core principles is that type-checking focuses on the shape that values have. This is sometimes called \u201cduck typing\u201d or \u201cstructural subtyping\u201d. In TypeScript, interfaces fill the role of naming these types, and are a powerful way of defining contracts within your code as well as contracts with code outside of your project.
\nOur First Interface<\/p>\n

The easiest way to see how interfaces work is to start with a simple example:<\/p>\n

function printLabel(labelledObj: { label: string }) {
\nconsole.log(labelledObj.label);
\n}<\/p>\n

let myObj = {size: 10, label: “Size 10 Object”};
\nprintLabel(myObj);<\/p>\n

The type-checker checks the call to printLabel. The printLabel function has a single parameter that requires that the object passed in has a property called label of type string. Notice that our object actually has more properties than this, but the compiler only checks that at least the ones required are present and match the types required. There are some cases where TypeScript isn\u2019t as lenient, which we\u2019ll cover in a bit.<\/p>\n

We can write the same example again, this time using an interface to describe the requirement of having the label property that is a string:<\/p>\n

interface LabelledValue {
\nlabel: string;
\n}<\/p>\n

function printLabel(labelledObj: LabelledValue) {
\nconsole.log(labelledObj.label);
\n}<\/p>\n

let myObj = {size: 10, label: “Size 10 Object”};
\nprintLabel(myObj);<\/p>\n

The interface LabelledValue is a name we can now use to describe the requirement in the previous example. It still represents having a single property called label that is of type string. Notice we didn\u2019t have to explicitly say that the object we pass to printLabel implements this interface like we might have to in other languages. Here, it\u2019s only the shape that matters. If the object we pass to the function meets the requirements listed, then it\u2019s allowed.<\/p>\n

It\u2019s worth pointing out that the type-checker does not require that these properties come in any sort of order, only that the properties the interface requires are present and have the required type.<\/p>\n

IT Professionals, Web Developers, Web Programmers, IT students can Apply for the certification course to move ahead in their careers.<\/strong><\/p>\n

\"\"<\/a><\/p>\n