1. 原始数据类型
布尔值: let isDone: boolean = false
数值: let decLiteral: number = 6
字符串: let myName: string = 'Tom'
空值: void
Null和Undefined: 和`void`的区别是,`null`和`undefined`是所有类型的子类,比如 `number` 类型的变量
可以赋值给`undefined`
2. 任意值any
[1] 普通类型 被改变类型是不允许的
let name = 'Tom'
name = 7 //编译错误
[2] 如果是`any`类型,则允许赋值任意类型
[3] 可以这样认为,声明一个变量后,对他的任何操作,返回的内容类型都是任意值
3. 类型推导
let myFavoriteNumber
如果定义的时候没有赋值,不管之后有没有赋值,都会被推断成any类型,而完全不被类型检查
4. 联合类型
联合类型表示可以取值多种类型,比如:
let myFavoriteNumber: string | number
5. 对象的类型 --- 接口
interface Persion {
name : string;
age : number;
sex? : number; // 可选属性
[propName: string]: any; // 任意属性
readonly id : number; // 只读属性
}
// 赋值的时候,变量的形状和接口的形状必须保持一致
let tom: Persion = {
name : 'Tom',
age : 25
};
6. 数组类型
// 类型 + [] 表示法
let fibonacci: number[] = [1, 1, 2, 3, 5];
// 数组泛型
let szArray<number> = [1,3,4,5];
// 类数组, arguments 是一个类数组
let args:number[] = arguments
// any 在3数组中的试用
let list: any[] = ['xcatliu', 25, { website: 'http://xcatliu.com' }];
7. 函数类型
//不要混淆了 typescript 和 es6 中的 => 箭头函数
Typescript 中 => 用来表示函数的定义,左边是输入类型,需要用括号括起来,右边是输出类型
let mySum: (x: number, y: number) => number = function (x: number, y: number): number {
return x + y;
};
ES6中的 => 是箭头函数,应用十分广泛
(x,y) => return x+y
// 可选参数,lastName? 表示可选参数
function buildName(firstName: string, lastName?: string) {}
// 默认参数,lastName 是默认参数
function buildName(firstName: string, lastName: string = 'Cat') {}
// 剩余参数
function push(array, ...items) {
items.forEach(function(item) {
array.push(item);
});
}
let a: any[] = [];
push(a, 1, 2, 3);
// 重载函数
8. 断言
interface cat{ run() : void; }
interface fish{ swim() : void; }
// 假设 animal 是 Fish 判断 swim 是不是函数
function isFish(animal: Cat | Fish) {
if (typeof (animal as Fish).swim === 'function') return true;
return false;
}
// 这样会报错,断言只是欺骗编译器,无法避免运行时的错误
function swim(animal: Cat | Fish) {
(animal as Fish).swim();
}
// 如果 ApiError 是一个接口时,就不能使用 instanceof 判断了
// 因为接口类型,在编译之后会删除,因此这样判断就是编译错误
// 因此需要使用断言判断更为稳妥
if (error instanceof ApiError)
if (typeof (error as ApiError).code === 'number')
// 将任何类型断言为 any, 最好不要这样乱用,容易出现意想不到的错误
(window as any).foo = 1
9. 类型别名
type Name = string;
type NameResolver = () => string;
type NameOrResolver = Name | NameResolver;
function getName(n: NameOrResolver): Name {
if (typeof n === 'string') {
return n;
} else {
return n();
}
}
10. 字符串字面量类型
// 字符串字面量类型用来约束取值只能是某几个字符串中的一个
// 注意,类型别名与字符串字面量类型都是使用 `type` 进行定义
type EventNames = 'click' | 'scroll' | 'mousemove';
function handleEvent(ele: Element, event: EventNames) { // do something}
handleEvent(document.getElementById('hello'), 'scroll'); // 没问题
handleEvent(document.getElementById('world'), 'dblclick'); // 报错,event 不能为 'dblclick'
11. 元组
let tom: [string, number] = ['Tom', 25];
12. 枚举
enum Days {Sun, Mon, Tue, Wed, Thu, Fri, Sat};
13. 查看插件是否安装
1、`npm -v` 查看npm版本
2、使用npm命令安装模块
`npm install Module Name`
例如安装jquery模块
`npm install jquery`
3、卸载模块 `npm uninstall Module Name`
4、查看当前目录下已安装的node包
`npm list`
5、查看安装模块的版本
`npm info Module Name`
例如查看jquery版本:
`npm info jquery`
6、安装制定版本,例如安装jquery指定版本
`npm install jquery@1.8.0`
// 虽然 TypeScript 不限制加号两侧的类型,但是我们可以借助
// TypeScript 提供的类型系统,以及 ESLint 提供的代码检查功能,
// 来限制加号两侧必须同为数字或同为字符串[5]。这在一定程度上使得
// TypeScript 向「强类型」更近一步了——当然,这种限制是可选的