跳到主要內容

TypeScript(5) 類別

前言

JavaScript使用函式和prototype-based的方式去實現元件化，但是會造成以後維護災難的發生，日前ES6也開始加入類別的特性，但是TypeScript一開始就有以物件導向語言去做發展．我目前覺得TypeScript發展模組開發會好管理．

類別函式宣告

語法：

class 類別名稱{
    //屬性 private|public|protect 
    修飾子  屬性名稱;

    //建構子
    constructor(){
        //內容
    }

    函式名稱(參數名稱：參數類型）：回傳類型{
        //內容
    }
}

說明：
private : 私人修飾子宣告讓外面無法直接存取該屬性
public : 公用修飾子讓外面可以直接存取該屬性
protect : 保護修飾子只能讓有繼承的類別可以存取該屬性

範例：類別宣告

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

    sayHi() {
        return `The person's name is ${this.name}`;
    }
}

let person = new Person('Jack');
console.log(person.sayHi());

輸出結果：

The person's name is Jack

繼承(Default Parameters)

TypeScript有時我們需要可以利用繼承方法來建構元件，元件的可用性更好使用．

範例：

//預設參數
class Robot extends Person{
    public talk(){
        console.log('I am a robot');
    }
}

let robot = new Robot('robot 1 ');
robot.talk() ;

輸出結果：

I am a robot

抽象(abstract)

抽象類別跟介面很像，最大部分不同地方是抽象類別只需要實作部分需告方法，如果有類別大部分方法的行為相同，但是有少部分的不同，就可以定義為抽象類別．例如：我們定義一個抽象類別為動物(Animal)，所有的動物都會靠嘴巴覓食(forage)所以可以實作相同方法，走路(walk)或是跑(run)這個方法，每個動物實作的方法不同，我們可以定義成抽象函式，舉例狗是用四隻腳走路，跑也是，但是鳥走路可能是用跳;跑步可能是用飛．

範例：

abstract class Animal{
    type:string ;
    forage():void{
        console.log(this.type+"吃飯")
    }

    abstract walk(); //抽象函式
    abstract run();  //抽象函式
}

class Bird extends Animal{
    constructor(type:string){
        super();
        this.type = type;
    }

    walk() {
        console.log(this.type+"用跳的")
    }    
    run() {
        console.log(this.type+"用飛")
    }
}

class Dog extends Animal{
    constructor(type:string){
        super();
        this.type = type;
    }

    walk() {
        console.log(this.type+"用四隻腳走路")
    }    
    run() {
        console.log(this.type+"用四隻腳跑步")
    }
}
let dog = new Dog("狗");
dog.walk();
dog.run();
let bird = new Bird("鳥");
bird.walk();
bird.run();

輸出結果：

狗用四隻腳走路
狗用四隻腳跑步
鳥用跳的
鳥用飛

介面(Interface)

在typeScript的介面是一種規格，其定義屬性和方法，跟其他語言的interface
使用情境相同，通常用來定義前端元件的介面，例如表格的欄位定義成介面，可以依照不同的需求去實作表格欄位定義，這個好處是對表格欄位來說比較好維護．

範例：

interface ICar {
    color:string; //顏色
    engine:string;//引擎
    type:string;  //型號
    speed:number; //速度

    setSpeed(speed:number) ; //設定引擎速度
}

在實作介面中，TypeScript需要重新宣告屬性一次，然後實作這個介面所定義的規格．

範例：

class HRV implements ICar{
    color: string;    
    engine: string;
    type: string;
    speed: number;
    constructor( color:string, engine:string, type:string){
        this.color = color ;
        this.engine =engine;
        this.type = type ;
    }

    setSpeed(speed: number) {
        this.speed = speed;
    }
}

var hrv :ICar = new HRV("blue","SOHC 直列 4 汽缸 i-VTEC 智慧型可變汽門正時與揚程電子控制系統","一般");

hrv.setSpeed(100);
console.log(hrv.engine);
console.log(hrv.speed);

介面繼承

介面繼承又稱介面擴充，他可以像類別一樣延展介面功能，增加元件介面的可用性．由範例知道有一個介面為Shape定義基本的顏色，Square就是延伸Shape功能增加長度和寬度．

範例：

interface Shape{
    color:string;
}

interface Square extends Shape{
    width:number;
    height:number;
}

let square = {};
square.color="blue" ;
square.width=100;
square.height=10;

參考

  1. typescript class introduction
  2. https://codeday.me/bug/20170629/33692.html
  3. https://www.youtube.com/watch?v=KXc7PzE0FZM

留言

張貼留言

這個網誌中的熱門文章

淺談機器學習原理-Nonlinear Transform

Nonlinear Transform 淺談機器學習原理-Nonlinear Transform Nonlinear Transform *通用能力 gerneralization : 就是將訓練好的模型，放到正式環境可以正常的運作，通常Linear Model的gerneralization會比較好，因為線性模型解決的問題比較單純。缺點是應用侷限比較大。 參考Chih-Chung Chang老師的範例:縣性與非線性分類範例 https://www.csie.ntu.edu.tw/~cjlin/libsvm/ 非線性問題 當如果今天假設要圈出裡面小圈圈的資料，我們就無法使用線性的模型，我們可以用非線性解像圈圈的方程式 s i g n ( − x 1 2 − x 2 2 + r ) sign(-x1^2-x2^2+r) s i g n ( − x 1 2 − x 2 2 + r ) 來解決，在演算法我們利用reduce來將不會的問題透過已知的問題來解決，所以在這個問題 我們將圈圈的方程式(非線性模型)reduce成線性模型來解決。 Reduce 方法論 我們調整圓形的方程式改為 z 0 z_0 z 0 ​ , z 1 z_1 z 1 ​ , z 2 z_2 z 2 ​ 來轉換線性方程式， { ( x n , y n ) } \{{(x_n,y_n)}\} { ( x n ​ , y n ​ ) } => { ( z n , y n ) } \{{(z_n,y_n)}\} { ( z n ​ , y n ​ ) } 在這空間資料中只要能找線，就可將不同的分類區分，圖中可以線性可以線去做分類。 透過向量方式來轉換成線性方程式 我們找到一個方式將非線性資料X透過向量轉換為Z後，希望透過線性方程式方式來學習，得到正解。 當我們Nonlinear transform轉換成線性方程式，當有新的資料進來我們無法使用invertiable(逆向工程)的方式去轉回非線...
張貼留言
閱讀完整內容

Python AI-問題集

Python AI-問題集 問題集 Jupyter Notebook執行ipywidgets會出現kernel死掉的錯誤發生(The kernel appears to have died) 解決方法 (1) 根據log檔來判斷問題： 例如：log訊息出現OMP: Error #15: Initializing libiomp5.dylib, but found libiomp5.dylib already initialized. (2) 根據問題關鍵字找出問題所在： 利用google查詢所遭遇到的問題，例如我把上面的問題上google查詢可以找到這篇的解法 https://blog.csdn.net/bingjianIT/article/details/86182096 (3)實作解法： 我實作下面解法後，就可以順利執行手寫辨識的程式． //在Python宣告時加入 import os os.environ["KMP_DUPLICATE_LIB_OK"]="TRUE" 參考 https://blog.csdn.net/bingjianIT/article/details/86182096
1 則留言
閱讀完整內容

淺談機器學習原理-Linear Model

Linear Regession 淺談機器學習原理-Linear Model Linear Regession 需要預測數值，輸出為實數的數值，我們就稱為它是regession的任務。 範例:Netflix百萬獎金比賽，有100萬筆的rating資料與480K的使用者給17.7k的電影來評分，預測使用者評分電影的星星*數量。 (1) 定義問題是否需要使用ML : 預測使用者評分電影的星星*數量，算是一個複雜的問題。且知道評分結果為1~5星，可以知道這是一個regression的任務 (2) 收集資料 : Netflix有100萬筆的rating資料與 (3) 定義模型 :假設它是regession問題，我們可以知道hypothesis: h(x) = w T ∗ x w^T *x w T ∗ x 的方程式。我們可以與分類Perceptron的公式來比較。 Linear Regession :用來找到最接近實際目標值，也就是最小誤差error的值 (4) 測量誤差 : squared error : ( 預測值 − 真實的值 ) 2 (預測值-真實的值)^2 ( 預測值 − 真實的值 ) 2 ，我們算出誤差值後，如何得到最小的誤差min(Error(x)) 理想化的誤差值 我們可以假設誤差接近於0值為球體的位置，是在曲線的最下方也就是偏微分等於0的位置，我們要找的讓W偏微分等於零。 Statistics vs Machine Learning Statistics: 統計比較著重在數學的推論 Machine Learning: 機器學習比較著重在資料計算，統計工具對機器學習領域是很有幫助 Logistic Regression 邏輯回歸 需要預測機率，輸出為小數點，我們就稱為它Logistic Regression任務。資料輸出為+1,-1的值，可以預測為機率發生，可以由公式可以知道x在發生+1的機率是多少。範例: 疾病預測、鐵達尼的死完的機率 機...
張貼留言
閱讀完整內容