TypeScript class

TypeScript class

TypeScript extends JavaScript with type. Compile and generate JavaScript. Typescript can be speed up to develop

TypeScript has class, the details are (Handbook)

Sample

In this entry, cover following topic

• class, constructor
• access level (public, protected, private)
• extend
• abstract
• static, readonly
• getter / setter
• interface

class, constructor

class Hello {
    name: string;

    constructor(name: string) {
        this.name = name;
    }

    greet() {
        return "Hello, " + this.name;
    }
}


// How to use
let hello = new Hello("Taro");
console.log(hello.greet());

This is class example and how to use it.

method, property does not have any prefix, constructor is used constructor attr.

Usage is just new Xxx and call method with dot

access level (public, protected, private)

TypeScript supports public, protected, private. Meaning is almost same as other languages like java, C++ etc..

// public
class Member {
    public name: string;

    constructor(name: string) {
        this.name = name;
    }
}


// protected
class Member2 {
    protected name: string;

    constructor(name: string) {
        this.name = name;
    }
}

class ProtectedMember2 extends Member2 {

    constructor(name: string) {
        super(name);
    }

    greet() {
        return "Hello, " + this.name;
    }
}


// private
class Member3 {
    private name: string;

    constructor(name: string) {
        this.name = name;
    }
}

// check
let member1 = new Member("Taro");
console.log(member1.name);

let member2 = new Member2("Jiro");
// console.log(member2.name);   No cannot use
let pmember2 = new ProtectedMember2("Hiro");
console.log(pmember2.greet());

let member3 = new Member3("Saburo");
// console.log(member3.name);    No cannot use

extend

// extend
class Person {
    protected name: string;
    constructor(name: string) {
        this.name = name;
    }

    greet() {
        return "Hello, " + this.name;
    }
}

class Employee extends Person {


    constructor(name: string) {
        super(name);
    }

    greet() {
        return "Nice to meet you, " + this.name;
    }
}

var person = new Person("Jack");
var employee = new Employee("Cacao");

console.log(person.greet());
console.log(employee.greet());

abstract

// abstract
abstract class AbstractPerson {
    constructor(public name: string) {}

    printName(): void {
        console.log("Name: " + this.name);
    }

    abstract printFullMessage(): void; // must be implemented in derived classes
}

class ActualPerson extends AbstractPerson {

    printFullMessage() {
        console.log("I am " + this.name);
    }
}

static, readonly

// static
// readonly
class Shape {
    static origin = { x: 0, y: 0 };

    readonly z: number;

    constructor(z: number) {
        this.z = z;
    }
}

let shape = new Shape(1);
console.log(Shape.origin.x);
Shape.origin = {x: 1, y: 1};
console.log(Shape.origin.x);

console.log(shape.z);
// shape.z = 3;   No

getter / setter

// getter/setter
class Group {
    private _gname: string;

    get gname(): string {
        return this._gname;
    }

    set gname(newName: string) {
        if (newName && newName.length > 10) {
            throw new Error("group name has a max length of " + 10);
        }
        this._gname = newName;
    }
}

var group = new Group();
group.gname = "Amari";
console.log(group.gname);
group.gname = "Swap";
console.log(group.gname);

We can define original getter and setter instead of public attr.

interface

One of surprising for typescript is to extend class with interface. interface takes class function into it.

// interface
interface BGroup extends Group {
    secret: number;
}