TypeScript 2.7 - [ 1小時快速入門]

基本數據類型

基本數據類型

 - boolean,number,string,any,void

基本結構類型

 - Array,enum

TS函數類型

• 函數類型聲明

  function add(x: number, y: number): number {
      return x + y;
  }
  
  var myAdd = function (x: number, y: string): string {
      return "hello ts"
  }
  // 函數參數的意義:  看下圖詳解
  var myAddts: (name: string, age: number) => number = function (n: string, a: number): number {
      return a;
  };

• 可選參數

function buikdName(first: string, last?: string) {
    return first + "" + last;
}

var result1 = buikdName("hello", "world");
var result2 = buikdName("你好");

console.log(result1)//helloworld
console.log(result2)//你好undefined

• 默認參數

function build(first:string,last="hello"){
    return first+""+last;
}
var result1 = build("hello", "world");
var result2 = build("你好");

console.log(result1)//helloworld
console.log(result2)//你好hello

• 可變參數
  

lambads和this關鍵字

// lambads可千萬不能理解成ES6裏的鉤子函數.函數語法意思截然不同
var man={
    name:["h","e",1,false],
    getName:function () {
        return ()=>{
            var i=Math.floor(Math.random()*4)
            return {
                n:this.name[i]
            }
        }
    }
}
var myName=man.getName();
console.log(myName().n);

重載

function attr(name:string):string;
function attr(age:number):number;

function attr(nameorage:any):any{
    if(nameorage && typeof nameorage==="string"){
        console.log("name")
    }else {
        console.log("age")
    }
}

attr("nihao");
attr(11);

類Class

類的創建

class Person {
    name: string;
    age: number;

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

    print() {
        return this.name + ":" + this.age;
    }
}
var p=new Person('ime',18);
console.log(p.print())

類的繼承

class Person {
    name: string;
    age: number;

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

    tell() {
        return this.name + ":" + this.age;
    }
}

class Student extends Person {
    school: string;

    constructor(name: string, age: number, school: string) {
        super(name, age);
        this.school = school;
    }

    tell() {
        return this.name + ":" + this.age + ":" + this.school;
    }
}

var s = new Student("deng",8,"##區小學");
console.log(s.tell())

訪問修飾符

//public private

class People {
    private _name: string;
    private _age: number;

    get name(): string {
        return this._name;
    }

    set name(value: string) {
        this._name = value;
    }

    get age(): number {
        return this._age;
    }

    set age(value: number) {
        this._age = value;
    }

    print() {
        return `${this._name}:${this._age}`
    }

    constructor(name: string, age: number) {
        this._name = name;
        this._age = age;
    }
}

class Teacher extends People {
    school: string;

    constructor(name: string, age: number, school: string) {
        super(name, age);
        this.school = school;
    }

    print() {
        return `${this.name}:${this.age}:${this.school}`
    }
}

var p = new Teacher("chenjing", 19, "xiaoxue");
console.log(p.print());

封裝

class Hello {
    private _name: string;

    get name(): string {
        return this._name;
    }

    set name(value: string) {
        this._name = value;
    }

    toString() {
        return this._name;
    }
}
var h=new Hello();
h.name="chenjing";
console.log(h.toString());

static和使用技巧

//TODO:我本來Person name 但是會報錯.所以修改了變量名字;
// 這可能是和TS語法機制有關
class Person1 {
    static name1: string;

    toString() {
        console.log(`名字:${Person1.name1}`)
    }
}

var pp = new Person1();
Person1.name1 = 'chenjing';
pp.toString()

class Greeter{
    greetering:string;

    constructor(greetering: string) {
        this.greetering = greetering;
    }
    greet(){
        return `hello${this.greetering}`
    }
}
// 聲明引用的數據類型;
var green:Greeter;
green=new Greeter('chenjing');
console.log(green.greet())