├── .gitignore ├── README.md ├── basicTypes ├── basicTypes.js ├── basicTypes.js.map └── basicTypes.ts ├── class ├── classKitchensink.js ├── classKitchensink.js.map └── classKitchensink.ts └── interface ├── basic-interface.js ├── basic-interface.js.map ├── basic-interface.ts ├── class-interface.js ├── class-interface.js.map └── class-interface.ts /.gitignore: -------------------------------------------------------------------------------- 1 | .idea 2 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Typescript Summary 5 | ================== 6 | 7 | First question goes down to is whats Typescript (TS) ? 8 | 9 | Introduced by Microsoft, TS is basically an extension of Javascript. Its whole purpose is to let JS programmers write better and managed code. 10 | 11 | By managed code, what I mean is - since JS is not a compiled lanaguage like C#/Java, programmers dont get to know about the errors in their code at the compile time. Also in JS, you can change the data type of your variable anytime - this makes JS an open ground to make mistakes. 12 | 13 | TS does the work of compiling (transpiling) the code and providing a better code writing environment to the programmer. 14 | 15 | *Writing environment*? Yes TS code will eventually be transpiled to JS when you want to run it on a browser. 16 | 17 | 18 | Look at the following example: 19 | 20 | ![Writing environment](http://i.imgur.com/M5LNx8v.png) 21 | 22 | The left is the TS code, and the right side is the transpiled JS code. 23 | 24 | You will see that we have made an abstract class Encryption and a normal class NormalEncrytion in the example. 25 | 26 | There is no difference in the generated JS code for the two classes. You will notice that there is not restriction made for keeping the class abstact in the transpiled JS. 27 | But the TS compiler will not let you instantiate the abstract class Encryption as abstract classes are meant to be (see the error near the red underline). 28 | 29 | So the point I am trying to make is - Many of the features will not be available in the generated JS code; but still the TS compiler will let you *write better and error free code*. 30 | 31 | So advantages of TS: 32 | 33 | - **Type checking** - Gives you ability to define type for a variable and check for errors 34 | - **Syntatic sugar** - Just define a class by using TS' keyword. The compiler will take care of everything. 35 | - **OOPS language goodies** - TS brings the goodness of Interfaces, Abstract class, Generics, etc to JS 36 | 37 | ---------- 38 | 39 | 40 | ### Basic Types 41 | TS has these eight basic data types - 42 | 43 | ![Types](https://s18.postimg.org/wl3etj589/tstypes.png) 44 | 45 | 1- **Number** - ```public amount : number = 123;``` 46 | 47 | 2- **String** - ```let color: string = "blue";``` 48 | 49 | Strings also support template syntax - 50 | ``` 51 | let age: number = 37; 52 | let sentence: string = `Hello, my name is ${ fullName }. 53 | ``` 54 | 55 | 3- **Boolean** - ```let isDone: boolean = false;``` 56 | 57 | 4- **Array** - 58 | 59 | ``` let list: number[] = [1, 2, 3];``` 60 | 61 | ``` 62 | // Array can be defined like this 63 | let list: Array = [1, 2, 3]; 64 | ``` 65 | 66 | 5- **Tuple** - *Basically an array which can have different data types* 67 | ``` 68 | // Declare a tuple type 69 | let x: [string, number]; 70 | // Initialize it 71 | x = ["hello", 10]; // OK 72 | // Initialize it incorrectly 73 | x = [10, "hello"]; // Error 74 | ``` 75 | 6- **Enum** - *A way to assign numeric values to a set of values* 76 | ``` enum Status { Processing, Accepted, Rejected} ``` 77 | 78 | 7- **Any** - *This type works exactly like the normal variables in JS. TS compiler doesnt perform its type checking on these ones.* 79 | 80 | ``` 81 | let notSure: any = 4; 82 | notSure = "maybe a string instead"; 83 | ``` 84 | 8- **Void** - 85 | For functions, it tells that the function doesnt return anything. 86 | ``` 87 | function warnUser(): void { 88 | alert("This is my warning message"); 89 | } 90 | ``` 91 | 92 | For variables, a void type variable can only be null or undefined. 93 | 94 | ``` let unusable: void = undefined; ``` 95 | 96 | ### Union of Types 97 | 98 | There are situations in which a function can accept a parameter which can be of different type of data type. 99 | Using Union, you can set a restriction for a function to accept a parameter of given range of data types. 100 | 101 | ``` 102 | function alertGender(gender: boolean | string){ 103 | if (typeof gender === "boolean") { 104 | alert("You are " + (gender ? "male" : "female" )); 105 | } 106 | if (typeof gender === "string") { 107 | alert("You are " + gender); 108 | } 109 | } 110 | // the parameter gender could have been set as any. 111 | // But that leaves scope for error, as in you wont be able 112 | // to get the strict type checking of TS 113 | 114 | ``` 115 | 116 | ---------- 117 | 118 | 119 | ---------- 120 | 121 | 122 | Interfaces 123 | ------------- 124 | 125 | Interfaces are like a contract. A class/function which implements an interface should have the properties defined in the interface. 126 | 127 | ``` 128 | interface IFlyable{ 129 | heightLimit : number; 130 | numberEngines? : number; //optional property 131 | fly() : void; 132 | } 133 | 134 | class Vehicle implements IFlyable{ 135 | public name: string; 136 | public heightLimit : number; 137 | fly() : void{}; 138 | } 139 | // Vehicle needs to have properties specified in the IFlyable 140 | // Compiler will throw an error if the implementing class doesnt have all the properties 141 | // Properties suffixed with ? are optional 142 | ``` 143 | 144 | ### Interface for functions 145 | 146 | ``` 147 | interface SearchFunc { 148 | (source: string, subString: string): boolean; 149 | } 150 | 151 | // This is an interface for function that do search operation. 152 | // It sets a guideline for functions to take two string inputs and return a bool 153 | 154 | 155 | let Search : SearchFunc; 156 | 157 | Search = function(a,b):boolean { // no need to reiterate that a and b are string 158 | return true; 159 | } 160 | ``` 161 | 162 | ### Using Interface to restrict input parameter to a function 163 | 164 | ``` 165 | interface Square{ 166 | side : number; 167 | } 168 | 169 | 170 | function calculateArea(sq : Square){ 171 | return (side * side); 172 | 173 | // The input parameter sq implements the Interface Square 174 | // This puts a condition that the input parameter 175 | // needs to have the property side 176 | } 177 | 178 | 179 | calculateArea({side:20}); // valid 180 | calculateArea({side:'20'}); // error - This is one common problem when working on JS 181 | 182 | calculateArea({side:1, color: 'red' }) // error - This is because of extra property 183 | // TS treats this as error 184 | 185 | // If your object will have extra properties, then pass like this - 186 | calculateArea({ side: 1, color: 'red' } as Square); 187 | 188 | 189 | ``` 190 | 191 | > **Note:** 192 | 193 | > - Properties suffixed with ? are optional to implement in the class. 194 | > - Interface can inherit from other Interfaces, Classes 195 | 196 | 197 | ---------- 198 | 199 | 200 | ---------- 201 | 202 | 203 | Classes 204 | ------------- 205 | 206 | TS classes have public, private and protected members. Members are public by default. 207 | Classes can also be defined as Abstract classes and they can have Static properties. 208 | Derived classes need to call the ```super``` function to execute the constructor of the base class. 209 | 210 | #### Key points #### 211 | 212 | **Abstract classes** - These are meant to be inherited, but cannot be instantiated. 213 | **Static properties** - These properties describe the class not the instances of it. See the property population in the Class kitchensink code. 214 | 215 | 216 | ### TS Class Kitchensink code ### 217 | 218 | Lets see the example below: 219 | 220 | We want to model classes for Employees. 221 | 222 | Now every employee will have a gender, name, etc. These properties are bound to be there in every human. **As a thumb rule, keep the inherent properties in the abstract class** 223 | 224 | Now properties like Gender, Name are public in nature. 225 | Properties which are private to oneself like Salary should be kept as private so that they are not accessible publically. 226 | 227 | 228 | 229 | 230 | ``` 231 | // Put all inherent properties in the abstract clss 232 | 233 | abstract class Employee{ 234 | 235 | static headCount : number; // make this property static to count the population. The property population doesnt belong to the instance, it rather belongs to the class itself 236 | 237 | public name: string; // default public 238 | gender : number; 239 | 240 | putAttendance() : void{ 241 | console.log("punch in card"); 242 | // this function can be put into abstract clss because every employee will put attendance 243 | } 244 | 245 | abstract work() : void; 246 | // every employee has their own role and work - so its better to make it abstract and not put any implementation fr ths function 247 | 248 | private salary : number; // private because its private to the employee and it should not be accessible outside 249 | } 250 | 251 | 252 | class DeveloperEmployee extends Employee{ 253 | 254 | constructor(company : string){ 255 | Employee.headCount++; 256 | super(); 257 | } 258 | 259 | work(){ 260 | console.log('develop IT systems'); // had to implement this function 261 | } 262 | 263 | } 264 | 265 | class ManagerEmployee extends Employee{ 266 | 267 | constructor(company : string){ 268 | Employee.headCount++; 269 | super(); 270 | } 271 | 272 | work(){ 273 | console.log('managing other employees'); // had to implement this function 274 | } 275 | 276 | } 277 | 278 | Employee.headCount = 0; 279 | let dev = new DeveloperEmployee('EY'); 280 | let manager = new ManagerEmployee('EY'); 281 | 282 | console.log(Employee.headCount); 283 | ``` 284 | 285 | 286 | ---------- 287 | 288 | 289 | ---------- 290 | 291 | 292 | Functions 293 | ------------- 294 | 295 | TS functions check the input parameters and give error on compile time if there is any mismatch. 296 | 297 | There are also Default and Optional parameters for functions. 298 | 299 | ``` 300 | function buildName(firstName: string, lastName = "Smith", middleName? : string) { 301 | } 302 | 303 | ``` 304 | 305 | 306 | ###Rest Parameters 307 | 308 | Rest parameters are treated as a boundless number of optional parameters. When passing arguments for a rest parameter, you can use as many as you want; you can even pass none. The compiler will build an array of the arguments passed in with the name given after the ellipsis (...), allowing you to use it in your function. 309 | 310 | ``` 311 | 312 | function buildName(firstName: string, ...restOfName: string[]) { 313 | return firstName + " " + restOfName.join(" "); 314 | } 315 | 316 | let buildNameFun: (fname: string, ...rest: string[]) => string = buildName; 317 | 318 | ``` 319 | 320 | 321 | 322 | # Namespaces 323 | 324 | Namespaces are used to avoid naming collisions in the global scope. There can be situations where your code uses libraries LibraryX and LibraryY. It is possible that these libraries have classes with same name. It can make the code really messy. 325 | 326 | Thats why its a good practice to structurize the code using Namespaces. 327 | 328 | A Namespace can ```export``` only the properties which are required, and can keep the inner implementations within itself. 329 | 330 | A namespace can be splitted across different files. 331 | 332 | ``` 333 | namespace Encryption { 334 | 335 | const bit_mode = 64; 336 | 337 | export class AES { 338 | encrypt(s: string) { 339 | return s; 340 | } 341 | decrypt(s: string) { 342 | return s; 343 | } 344 | } 345 | 346 | export class DES { 347 | encrypt(s: string) { 348 | return s; 349 | } 350 | decrypt(s: string) { 351 | return s; 352 | } 353 | } 354 | } 355 | 356 | ``` 357 | 358 | # Decorators 359 | 360 | Decorators are a way to perform extra activities like logging, manipulating , restricting whenever a class is declared, or a function is run 361 | 362 | For example - 363 | 364 | ``` 365 | @sealed 366 | class ABC {} 367 | 368 | function sealed(constructor: Function) { 369 | Object.seal(constructor); 370 | Object.seal(constructor.prototype); 371 | } 372 | 373 | // the function sealed will run when the class is declared, and seal the class' constructor and prototype 374 | 375 | ``` 376 | 377 | More on Decorators coming soon.... 378 | 379 | -------------------------------------------------------------------------------- /basicTypes/basicTypes.js: -------------------------------------------------------------------------------- 1 | /* 2 | There are seven basic types of data types in Typescript 3 | */ 4 | // Number 5 | var counter = 1; 6 | // Boolean 7 | var isDone = false; 8 | // Array 9 | var list = [1, 2, 3]; 10 | var list1 = ['abc', 'cde']; 11 | // string 12 | var str = 'abc'; 13 | var str1 = "ABC"; // works with double and single quotes 14 | // tuple 15 | var tup = ['abc', 1]; 16 | tup = ['1', 1]; 17 | // Enum 18 | var Color; 19 | (function (Color) { 20 | Color[Color["Red"] = 0] = "Red"; 21 | Color[Color["Blue"] = 1] = "Blue"; 22 | Color[Color["Green"] = 2] = "Green"; 23 | })(Color || (Color = {})); 24 | var blueNumber = Color.Blue; 25 | // Any 26 | // Lets you escape from Typescript's type checking; Any type variables behave like normal JS variables 27 | var anything = 'a'; 28 | anything = 1; // convert it into any type just like you do in JS 29 | anything = true; 30 | // void 31 | // Void data type can be given to functions that dont return anything, and variables 32 | function alertUser() { 33 | alert("YO!"); 34 | } 35 | var voidType = null; 36 | voidType = undefined; 37 | //voidType = 1; This statement will break 38 | //# sourceMappingURL=basicTypes.js.map -------------------------------------------------------------------------------- /basicTypes/basicTypes.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"basicTypes.js","sourceRoot":"","sources":["basicTypes.ts"],"names":["Color","alertUser"],"mappings":"AAAA;;GAEG;AAEH,SAAS;AACT,IAAI,OAAO,GAAY,CAAC,CAAC;AAEzB,UAAU;AACV,IAAI,MAAM,GAAa,KAAK,CAAC;AAE7B,QAAQ;AACR,IAAI,IAAI,GAAc,CAAC,CAAC,EAAC,CAAC,EAAC,CAAC,CAAC,CAAC;AAC9B,IAAI,KAAK,GAAmB,CAAC,KAAK,EAAC,KAAK,CAAC,CAAC;AAE1C,SAAS;AACT,IAAI,GAAG,GAAY,KAAK,CAAC;AACzB,IAAI,IAAI,GAAW,KAAK,CAAA,CAAC,sCAAsC;AAE/D,QAAQ;AACR,IAAI,GAAG,GAAmB,CAAC,KAAK,EAAC,CAAC,CAAC,CAAC;AACpC,GAAG,GAAG,CAAC,GAAG,EAAC,CAAC,CAAC,CAAC;AAEd,OAAO;AACP,IAAK,KAIJ;AAJD,WAAK,KAAK;IACNA,+BAAGA,CAAAA;IACHA,iCAAIA,CAAAA;IACJA,mCAAKA,CAAAA;AACTA,CAACA,EAJI,KAAK,KAAL,KAAK,QAIT;AACD,IAAI,UAAU,GAAW,KAAK,CAAC,IAAI,CAAC;AAGpC,MAAM;AACN,sGAAsG;AACtG,IAAI,QAAQ,GAAO,GAAG,CAAC;AACvB,QAAQ,GAAG,CAAC,CAAC,CAAC,kDAAkD;AAChE,QAAQ,GAAG,IAAI,CAAC;AAGhB,OAAO;AACP,oFAAoF;AAEpF;IACIC,KAAKA,CAACA,KAAKA,CAACA,CAACA;AACjBA,CAACA;AAED,IAAI,QAAQ,GAAU,IAAI,CAAC;AAC3B,QAAQ,GAAG,SAAS,CAAC;AACrB,yCAAyC"} -------------------------------------------------------------------------------- /basicTypes/basicTypes.ts: -------------------------------------------------------------------------------- 1 | /* 2 | There are seven basic types of data types in Typescript 3 | */ 4 | 5 | // Number 6 | let counter : number = 1; 7 | 8 | // Boolean 9 | let isDone : boolean = false; 10 | 11 | // Array 12 | let list : number[] = [1,2,3]; 13 | let list1 : Array = ['abc','cde']; 14 | 15 | // string 16 | let str : string = 'abc'; 17 | let str1: string = "ABC" // works with double and single quotes 18 | 19 | // tuple 20 | let tup:[string,number] = ['abc',1]; 21 | tup = ['1',1]; 22 | 23 | // Enum 24 | enum Color { 25 | Red, 26 | Blue, 27 | Green 28 | } 29 | let blueNumber: number = Color.Blue; 30 | 31 | 32 | // Any 33 | // Lets you escape from Typescript's type checking; Any type variables behave like normal JS variables 34 | let anything:any = 'a'; 35 | anything = 1; // convert it into any type just like you do in JS 36 | anything = true; 37 | 38 | 39 | // void 40 | // Void data type can be given to functions that dont return anything, and variables 41 | 42 | function alertUser() : void{ 43 | alert("YO!"); 44 | } 45 | 46 | var voidType : void = null; 47 | voidType = undefined; 48 | //voidType = 1; This statement will break 49 | -------------------------------------------------------------------------------- /class/classKitchensink.js: -------------------------------------------------------------------------------- 1 | var __extends = (this && this.__extends) || function (d, b) { 2 | for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; 3 | function __() { this.constructor = d; } 4 | d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); 5 | }; 6 | // Put all inherent properties in the abstract clss 7 | var Human = (function () { 8 | function Human() { 9 | } 10 | Human.prototype.walk = function () { 11 | console.log("walking"); // this function can be put into abstract clss because every human walks in the same way 12 | }; 13 | return Human; 14 | }()); 15 | var Employee = (function (_super) { 16 | __extends(Employee, _super); 17 | function Employee(company) { 18 | // the parameters to the constructor - company - becomes the member to the class Employee 19 | _super.call(this); // every derived class needs to make a call to base class 20 | Human.population++; 21 | } 22 | Employee.prototype.doHobbies = function () { 23 | console.log('painting'); // had to implement this function 24 | }; 25 | return Employee; 26 | }(Human)); 27 | // var aHuman = new Human(); // cannot instantiate an abstract class 28 | Human.population = 0; 29 | var anEmployee = new Employee('Ernst & Young'); 30 | var anEmployee1 = new Employee('EY'); 31 | console.log(Human.population); 32 | //# sourceMappingURL=classKitchensink.js.map -------------------------------------------------------------------------------- /class/classKitchensink.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"classKitchensink.js","sourceRoot":"","sources":["classKitchensink.ts"],"names":[],"mappings":";;;;;AAAA,mDAAmD;AACnD;IAWI;IAAc,CAAC;IAPf,oBAAI,GAAJ;QACI,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,wFAAwF;IACpH,CAAC;IAML,YAAC;AAAD,CAAC,AAZD,IAYC;AAED;IAAuB,4BAAK;IACxB,kBAAY,OAAgB;QAChC,yFAAyF;QACjF,iBAAO,CAAC,CAAC,yDAAyD;QAClE,KAAK,CAAC,UAAU,EAAE,CAAC;IACvB,CAAC;IACD,4BAAS,GAAT;QACI,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,iCAAiC;IAC9D,CAAC;IACL,eAAC;AAAD,CAAC,AATD,CAAuB,KAAK,GAS3B;AAEA,sEAAsE;AACvE,KAAK,CAAC,UAAU,GAAG,CAAC,CAAC;AACrB,IAAI,UAAU,GAAG,IAAI,QAAQ,CAAC,eAAe,CAAC,CAAC;AAC/C,IAAI,WAAW,GAAG,IAAI,QAAQ,CAAC,IAAI,CAAC,CAAC;AACrC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC"} -------------------------------------------------------------------------------- /class/classKitchensink.ts: -------------------------------------------------------------------------------- 1 | // Put all inherent properties in the abstract clss 2 | abstract class Human{ 3 | static population : number; // make this property static to count the population. The property population doesnt belong to the instance, it rather belongs to the class itself 4 | name: string; // default public 5 | gender : number; 6 | walk() : void{ 7 | console.log("walking"); // this function can be put into abstract clss because every human walks in the same way 8 | } 9 | abstract doHobbies() : void; // every person has their own hobby - so its better to make it abstract and not put any implementation fr ths function 10 | private sexualOrientation : boolean; // private because its private to the person and it should not be accessible outside 11 | protected DNA : any; // protected because its private to the person itself and available to child classes 12 | 13 | constructor(){} 14 | } 15 | 16 | class Employee extends Human{ 17 | constructor(company : string){ 18 | // the parameters to the constructor - company - becomes the member to the class Employee 19 | super(); // every derived class needs to make a call to base class 20 | Human.population++; 21 | } 22 | doHobbies(){ 23 | console.log('painting'); // had to implement this function 24 | } 25 | } 26 | 27 | // var aHuman = new Human(); // cannot instantiate an abstract class 28 | Human.population = 0; 29 | var anEmployee = new Employee('Ernst & Young'); 30 | var anEmployee1 = new Employee('EY'); 31 | console.log(Human.population); 32 | -------------------------------------------------------------------------------- /interface/basic-interface.js: -------------------------------------------------------------------------------- 1 | // A basic interface can be set like this 2 | function calculateArea(sq) { 3 | return (sq.side * sq.side); 4 | // The input parameter sq implements the Interface Square - This puts a condition that the input parameter 5 | // needs to have the property side 6 | } 7 | calculateArea({ side: 20 }); // valid 8 | calculateArea({ side: 20, color: 'red' }); // valid 9 | //calculateArea({side:'20'}); // error - This is one common problem when working on JS 10 | //# sourceMappingURL=basic-interface.js.map -------------------------------------------------------------------------------- /interface/basic-interface.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"basic-interface.js","sourceRoot":"","sources":["basic-interface.ts"],"names":[],"mappings":"AAAA,yCAAyC;AAQzC,uBAAuB,EAAW;IAC/B,MAAM,CAAC,CAAC,EAAE,CAAC,IAAI,GAAC,EAAE,CAAC,IAAI,CAAC,CAAC;IAExB,0GAA0G;IAC1G,kCAAkC;AACtC,CAAC;AAGD,aAAa,CAAC,EAAC,IAAI,EAAC,EAAE,EAAC,CAAC,CAAC,CAAC,QAAQ;AAClC,aAAa,CAAC,EAAC,IAAI,EAAC,EAAE,EAAE,KAAK,EAAC,KAAK,EAAC,CAAC,CAAC,CAAC,QAAQ;AAC/C,sFAAsF"} -------------------------------------------------------------------------------- /interface/basic-interface.ts: -------------------------------------------------------------------------------- 1 | // A basic interface can be set like this 2 | 3 | interface Square{ 4 | side : number; 5 | color? : string; // optional properties are suffixed with ? 6 | } 7 | 8 | 9 | function calculateArea(sq : Square){ 10 | return (sq.side*sq.side); 11 | 12 | // The input parameter sq implements the Interface Square - This puts a condition that the input parameter 13 | // needs to have the property side 14 | } 15 | 16 | 17 | calculateArea({side:20}); // valid 18 | calculateArea({side:20, color:'red'}); // valid 19 | //calculateArea({side:'20'}); // error - This is one common problem when working on JS -------------------------------------------------------------------------------- /interface/class-interface.js: -------------------------------------------------------------------------------- 1 | // Interface is like a contract which the implementing class/entity needs to conform with. 2 | // A class which implements the Interface will need to have the properties given in the interface 3 | var Vehicle = (function () { 4 | function Vehicle() { 5 | } 6 | Vehicle.prototype.fly = function () { }; 7 | ; 8 | return Vehicle; 9 | }()); 10 | // Vehicle needs to have properties specified in the IFlyable 11 | //# sourceMappingURL=class-interface.js.map -------------------------------------------------------------------------------- /interface/class-interface.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"class-interface.js","sourceRoot":"","sources":["class-interface.ts"],"names":[],"mappings":"AAAA,0FAA0F;AAC1F,iGAAiG;AAOjG;IAAA;IAIA,CAAC;IADG,qBAAG,GAAH,cAAa,CAAC;;IAClB,cAAC;AAAD,CAAC,AAJD,IAIC;AAGD,6DAA6D"} -------------------------------------------------------------------------------- /interface/class-interface.ts: -------------------------------------------------------------------------------- 1 | // Interface is like a contract which the implementing class/entity needs to conform with. 2 | // A class which implements the Interface will need to have the properties given in the interface 3 | 4 | interface IFlyable{ 5 | heightLimit : number; 6 | fly() : void; 7 | } 8 | 9 | class Vehicle implements IFlyable{ 10 | public name: string; 11 | public heightLimit : number; 12 | fly() : void{}; 13 | } 14 | 15 | 16 | // Vehicle needs to have properties specified in the IFlyable 17 | 18 | 19 | 20 | 21 | --------------------------------------------------------------------------------