TypeScript Object-Oriented programming

Object-oriented programming-declaration and use of classes

The advent of classes allows the front-end programmer to abstract levels, increase maintainability, and reuse. Of course, this series of classes of operations, we call him object-oriented programming. Typescript is a class-based object-oriented programming language.

A class is an abstraction of a specific transaction of an object, which is the concrete manifestation of the class.

Class specification, first letter capital-Big Hump named Class xiaojiejie{//different from objects, do not need to separate name:stringage:number//constructors with commas// The main function of the constructor is to assign values to the encapsulated properties in the class constructor (Name:string, Age:number) {//Use this assignment this.name = Namethis.age = Age}say () { Console.log (' nihaoa! ')}} There are classes that declare objects let Jiejie:xiaojiejie = new Xiaojiejie (' fanbingbing ', 18)//print out the resulting object look like Console.log (Jiejie)// Call class Method Jiejie.say ()

The use and definition of classes is very simple, the key is to understand the idea of the class. The ability to have abstract logic in order to reuse and enhance maintainability.

Object-oriented programming-modifier access modifiers

• Public modifier, which can be used within a class or outside of a class to use the property or behavior of the publicly adornment, the default modifier.
• Protected: Protected modifiers, which can be used in this class and subclasses with protected-decorated properties and behaviors.
• Private: Property and behavior that can only be used within a class by using the proprietary modifier.

Class xiaojiejie{public    sex:string    protected name:string    private Age:number public    constructor (sex : String, name:string, Age:number) {        this.sex = sex        this.name = name        This.age = Age    } public    SayHello () {        console.log (' HELLO ')    }    protected Saylove () {        console.log (' ILOVEYOU ')    }}var Jiejie: Xiaojiejie = new Xiaojiejie (' NV ', ' DLLB ', 16)//Print out object properties See Effect Console.log (jiejie.sex)//Error: Property "Name" is protected, only in class "Xiaojiejie" and its subclasses Access Console.log (jiejie.name)//Error: Attribute "Age" is a private property, only access Console.log (Jiejie.age) in class "Xiaojiejie"// Call Method Jiejie.sayhello ()//Error: Property "Age" is a private property and can only be accessed in class "Xiaojiejie" Jiejie.saylove ()

Read-only property modifiers

Use the ReadOnly modifier to set the property to read-only, and the read-only property must be initialized in life or in the constructor (note).

Class man{public    readonly sex:string = ' nan '}var man:man = new Man ()//Error: Unable to assign to "sex" because it is a constant or read-only property Man.sex = ' NV '

Object-oriented programming-inheritance and overriding of classes

Inheritance: Allows us to create a class (subclass) that inherits all the properties and methods from the existing class (the parent Class), and the subclass can create new properties and methods that are not in the parent class.

Parent class nloong{Public    name:string public    age:number public    skill:string    Constructor (name:string , Age:number, skill:string) {        this.name = name        This.age = Age        This.skill = skill    } public    interest () {        console.log (' Zhaonimei ')    }}let loongobj:nloong = new Nloong (' Baiye ', ' coding ')// Test Parent class Method Loongobj.interest ()//subclass Inherits parent class properties and methods extends//But one thing we need to note is that Typescript does not support multiple inheritance. Class Xloong extends nloong{    //subclasses extend their own properties and methods public    xingxiang:string = ' Shuaiqi ' public    Zhuangqian () { C14/>console.log (' yitianyigeyi ')    }}let Shuai = new Xloong (' Shuai ', 5, ' Daren ')//subclasses can use the method of the parent class, through inheritance Shuai.interest ()//Sub-class can use the parent class to find the method without its own extension Shuai.zhuangqian ()

overriding of class methods

Parent class nloong{Public    name:string public    age:number public    skill:string    Constructor (name:string , Age:number, skill:string) {        this.name = name        This.age = Age        This.skill = skill    } public    interest () {        console.log (' Zhaonimei ')    }}let loongobj:nloong = new Nloong (' Baiye ', ' coding ') loongobj.interest ()// Subclass class Xloong extends nloong{public    xingxiang:string = ' Shuaiqi '    //Override public    interest () {        // Super calls the method of the parent class in the subclass, implements the method of saving the parent class when overriding        Super.interest ()        console.log (' chuangjiangs ')    }        Public Zhuangqian () {        console.log (' yitianyigeyi ')    }}let Shuai = new Xloong (' Shuai ', 5, ' Daren ') shuai.interest () Shuai.zhuangqian ()

Object-oriented programming-Interface Understanding interface

Interface interface husband{    sex:string    interset:string    //interface Optional Parameters add question mark    Maibaobao?:boolean}let Myhusband: Husband = {sex: ' Nan ', Interset: ' Kanshu '}console.log (Myhusband)

Object-oriented programming-use of namespace namespaces

Dehua is a class of the same name and can be distinguished using different namespaces

Namespaces namespace shuaige{    //export exposed    export class dehua{public        name:string = ' Liudehua ' talk        () {            console.log (' Woshishuaigeliudehua ')}}}    Namespace bdjie{    Export class dehua{public        name:string = ' Madehua ' talk        () {            Console.log (' Woshiershixiongmadehua ')        }    }}let Dehua1:shuaiGe.Dehua = new Shuaige.dehua () let Dehua2:bdjie. Dehua = new Bdjie. Dehua () Dehua1.talk () Dehua2.talk ()

Original address: Http://jspang.com/post/typescript.html?tdsourcetag=s_pcqq_aiomsg

TypeScript Object-Oriented programming