typescript 学习教程（2）

微软开发typescript是为了让我们写javascript更加的清晰的代码构造，相对于javascript中的js满天飞的时代，使用typescript的模块儿话更加的清晰，更加的明确。对于javascript，具有面向对象的特性，而typescript则更是面向对象的一种语言，虽说最后还是会编译成javascript。

我们学习语言先学习的是变量的定义，对于typescript的定义，我们的定义方法（var 变量名：变量类型=变量值），具体的定义如下，

var a:string = 'a';
var n:number = 123;
var b:boolean = false;

javascript的变量是弱变量，正是因为这个原因，才会导致javascript维护起来比较复杂。所以，微软在开发typescript的时候，已经替我们考虑到了这个问题，所以，在typescript中引入了五种基本的数据类型，也可以说这是5种数据的使用范围。当然数据类型也可以是自定义的类，或者是接口，或者是别的。

number：整数和符点数类型。
string：字符串类型。
boolean：布尔类型。
undefined：未定义类型。
null：空值类型。

接着就是关于面向对象的一下内容，就是类，首先我们使用typescript定义一个类，然后编译成js。如下所示：

class persion {
    name: string;
    age:number;

    getName():string{
        return this.name;
    }
    eat(): void{
        console.log(this.name+ 'eat!');
    }
    setName(n:string):void {
        this.name = n; 
    } 
}

编译后：

var persion = (function () {
    function persion() {
    }
    persion.prototype.getName = function () {
        return this.name;
    };
    persion.prototype.eat = function () {
        console.log(this.name + 'eat!');
    };
    persion.prototype.setName = function (n) {
        this.name = n;
    };
    return persion;
}());

对于面向对象，我们常说，面向具有三大属性，封装、继承、多态、，上面得写的列子则是关于typescript的基本的封装，然后呢，关于typescript继承。

class Animai {
    name: string
    eat(): void {
        alert(this.name + '吃');
    }
    sleep(): void {
        alert(this.name + '睡觉')
    }
    breath(): void {
        alert(this.name + '呼吸');
    }
    constructor(name: string) {
        this.name = name;
    }
}
class Fish extends Animai {
    constructor(name: string) {
        super(name);
    }
    breath(): void {
        alert(this.name + '吐泡');
    }
}

var fi:Fish;

编译之后的则生成如下代码。

var __extends = (this && this.__extends) || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
var Animai = (function () {
    function Animai(name) {
        this.name = name;
    }
    Animai.prototype.eat = function () {
        alert(this.name + '吃');
    };
    Animai.prototype.sleep = function () {
        alert(this.name + '睡觉');
    };
    Animai.prototype.breath = function () {
        alert(this.name + '呼吸');
    };
    return Animai;
}());
var Fish = (function (_super) {
    __extends(Fish, _super);
    function Fish(name) {
        _super.call(this, name);
    }
    Fish.prototype.breath = function () {
        alert(this.name + '吐泡');
    };
    return Fish;
}(Animai));
var fi;

在typescript中，我们继承，我们使用关键字extends来实现类的继承。typescript的派生类中，使用super来调用基类的构造函数。

当然面向对象不还有一个属性就是多态，对于多态的是实现就挺简单了。下面又是一个例子，这个例子中的两个类是上面方法中的类。来进行实现的。


function Breath(f: Fish) {
    f.breath();
}

var fish = new Fish('小雨');
Breath(fish);

整个编译过后就是成如下内容。

var __extends = (this && this.__extends) || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
var Animai = (function () {
    function Animai(name) {
        this.name = name;
    }
    Animai.prototype.eat = function () {
        console.log(this.name + '吃');
    };
    Animai.prototype.sleep = function () {
        console.log(this.name + '睡觉');
    };
    Animai.prototype.breath = function () {
        console.log(this.name + '呼吸');
    };
    return Animai;
}());
var Fish = (function (_super) {
    __extends(Fish, _super);
    function Fish(name) {
        _super.call(this, name);
    }
    Fish.prototype.breath = function () {
        console.log(this.name + '吐泡');
    };
    return Fish;
}(Animai));
function Breath(f) {
    f.breath();
}
var fish = new Fish('小雨');
Breath(fish);

上面就是一关于type的第二次学习内容。

来源：oschina

链接：https://my.oschina.net/u/261347/blog/751034

标签

typescript

string

alert

typescript 学习教程 （2）

typescript 学习教程（2）