Basics
Challenges
Classes
Debugging
Events
External Files
Flow Control
Forms
Functions
Html Elements
Installation
Interfaces
Keywords
Modules
Namespaces
Operators
Reference Files
String
Types
This is a good example of how to use an interface. Like c#, it helps establish a contract. Notice that:
IEmployee
, have Name, Title, and Type.IManager
extends (inherits)IEmployee
so managers have everything an Employee has but can also schedule meetings.BossMan
implements (defined by)IManager
so when you instantiate a new BossMan, he will have all the IManager powers
namespace TypeScriptDemos.Interfaces
{
// If I ever want to use employee, here's what it looks like:
interface IEmployee
{
Name: string;
Title: string;
Type: string;
}
// If I ever want to use manager, here's what it looks like:
interface IManager extends IEmployee
{
Department: string;
NumberOfEmployees: number;
ScheduleMeeting: (topic: string) => void;
}
class Employee implements IEmployee
{
Name: string;
Title: string;
Type: string
}
class BossMan implements IManager
{
Name: string;
Title: string;
Type: string
Department: string;
NumberOfEmployees: number;
ScheduleMeeting(topic: string): void
{
// code that does stuff
}
}
window.onload = function ()
{
let bossMan = new BossMan();
bossMan.Name = "Boss Man";
bossMan.Title = "Boss"
bossMan.Type = "FTE";
bossMan.Department = "Service"
bossMan.NumberOfEmployees = 10;
bossMan.ScheduleMeeting("My Meeting")
let bossManLabel: HTMLElement = <HTMLElement>document.getElementById("boss-label");
bossManLabel.innerHTML = `${bossMan.Name} ${bossMan.Title} of ${bossMan.Department}`
let employee = new Employee();
employee.Name = "Nameless Employee";
employee.Title = "Pee On"
employee.Type = "PTE"
let employeeLabel: HTMLElement = <HTMLElement>document.getElementById("employee-label");
employeeLabel.innerHTML = `${employee.Name} ${employee.Title} : ${employee.Type}`
};
}