[ TypeScript入门 | 青训营笔记 ]

这是我参与「第五届青训营 」伴学笔记创作活动的第 4 天

今日学习Typescript语言

什么是typescript语言：所谓ts就是js的超集，它是在js语言的基础上进行类型推导的拓展，是一个强类型语言，方便程序猿进行业务编写代码

---

ts语法

无论整数还是浮点，任何类型的数字都属于number类型。在TypeScript中，所有的数字都是用浮点数表示的，这些数字的类型就是number：

var age ：number =36;

布尔类型 布尔类型（boolean）以true（真）和false（假）为值。

var married : boolean =true;

数组用Array类型表示，然而，因为数组是一组相同类型的集合，所以我们还需要为数组中的条目指定一个类型。

var jobs : Array<number> = [1,2,3]; 
var jobs : number[] = [4,5,6];

类似还有Person类

class Person {
first_name : string;
last_name : string;
age : number;
}

ts语言之泛型

泛型（Generics）是指在定义函数、接口或类的时候，不预先指定具体的类型，而在使用的时候再指定类型的一种特性。

function createArray(length: number, value: any): Array<any> {
    let arr = [];
    for (var i = 0; i < length; i++) {
        arr[i] = value;
    }
    return arr;
}

createArray(3, 'x'); // ['x', 'x', 'x']

*定义泛型的时候，可以一次定义多个类型参数：*
function swap<T, U>(tuple: [T, U]): [U, T] {
    return [tuple[1], tuple[0]];
}

swap([7, 'seven']); // ['seven', 7]

泛型约束

interface Lengthwise {
    length: number;
}

function loggingIdentity<T extends Lengthwise>(arg: T): T {
    console.log(arg.length);
    return arg;
}
//对泛型T进行约束，只允许传入的形参必须要包含length属性，否则就报错

泛型类

class GenericNumber<T> {
    zeroValue: T;
    add: (x: T, y: T) => T;
}

let myGenericNumber = new GenericNumber<number>();
myGenericNumber.zeroValue = 0;
myGenericNumber.add = function(x, y) { return x + y; };

---

等等ts的高级语法特性，再次不详细解释了，好奇的同学可以百度搜索下

---

Typescript工程应用

如何配置？

1. 配置webpack loader的相关配置
2. 配置tsconfig.js文件
3. 运行webpack打包/启动
4. loader处理ts文件的时候，会自动进行汇编和类型检测