TypeScript基础语法
安装TS
-
使用npm工具安装TS
-
安装后查看tsc版本
TS数据类型
原始数据类型
- number(数值类型)
- boolean(只有true和false)
- string
- null
- undefined(未定义,只有一种取值)
- void
- any(任意类型)
联合类型
- 具有多种类型的变量
- 联合类型的变量取值可以是联合类型中的其中一种
联合类型作用
function sayHello(student: string | string[]): void {
if(typeof student ===
'string') {
console.log("Hello,
" + student + "!");
} else {
for(let val of student) {
console.log("Hello,
" + val + "!");
}
}
}
sayHello('Alice');
sayHello(['Alice'
,
'Bob'
,
'Tom']);
函数
-
函数的参数和返回值明确类型
-
函数的返回值可以是void类型
-
可选参数
- 可选参数只能出现在参数列表的右侧
-
参数默认值
function dispChar(count: number, ch: string =
'*'): void {
for(let i=0;i<count;i++) {
console.log(ch);
}
}
dispChar(3);
dispChar(3,
'A');
- 剩余参数
function sum(...values): number {
let result = 0;
for(let val of values) {
result += val;
}
return result;
}
console.log(sum(1,2,3,4)); // 输出10
console.log(sum(1,2,3,4,5)); // 输出15
数组
TS定义数组
let names: string[] = ['Alice','Bob','Tom']; // 定义字符串数组
let names: string[] = ['Alice', 5,'Tom']; // 字符串数组中不能有数值型
let names: any[] = ['Alice', 5,'Tom']; //正确
多维数组
- n维数组是每个元素是n-1维数组的一维数组
- 多维数组可以是不规则的
接口
TS中用接口定义对象的类型
- 是对象的原型,与java的接口不一样
interface Student {
sid: string,
sname: string,
age: number
}
let alice: Student = {
sid: '1083710314',
sname: 'Alice',
age: 18
};
console.log(alice.sid); // 输出1083710314
console.log(alice.sname); // 输出Alice
console.log(alice.age + 1); // 输出19
可选属性
interface Student {
sid: string,
sname: string,
age?: number//加个问号
}
只读属性
interface Student {
readonly sid: string,
sname: string,
age: number
}
元组
- 可存放不同类型元素的集合
let alice: [number, string, string] = [1083710314,
'Alice','CS'];
console.log(alice[0]); // 输出1083710314
console.log(alice[1]); // 输出Alice
console.log(alice[2]); // 输出CS
console.log(alice.slice(1)); // 输出[ 'Alice','CS' ]
alice[2] ='SE';
console.log(alice); // 输出[ 1083710314,'Alice','SE' ]
枚举
- 限制了范围
enum Level {
EXCELLENT ='A',
GOOD ='B',
MEDIUM ='C',
PASS ='D',
FAILED ='E'
};
类
抽象类和访问权限
- abstract
- public、private、protected
abstract class Person {
protected _name: string;
public get name(): string {
return this._name;
}
public set name(name: string) {
this._name = name;
}
public abstract sayHello(): void;
}
class Student extends Person {
private _sid: number;
private _major: string;
public constructor(name: string, sid: number, major: string) {
super(); // 调用父类构造器
this._name = name; // 可访问父类的protected成员
this._sid = sid;
this._major = major;
}
public get sid(): number { return this._sid; }
public set sid(sid: number) { this._sid = sid; }
public get major(): string { return this._major; }
public set major(major: string) { this._major = major; }
public sayHello(): void {
console.log(`I am ${this.name} from ${this.major} major.`);
}
}
let p: Person = new Student('Alice', 1083710314, 'CS');
p.sayHello(); // 输出I am Alice from CS major.
let s: Student = <Student>p; // 强制类型转换
s.major = 'SS'; // 调用setter方法
s.sayHello(); // 输出I am Alice from SS major.
泛型
什么是泛型
- 泛型是将类型作为参数,为不同类型的输入重用相同的代码
- 函数、类和接口都可以使用泛型
function max<T>(a: T, b: T): T { // 泛型函数
if(a > b) return a;
return b;
}
console.log(max(3, 7)); // 输出7
console.log(max('Alice','Bob')); // 输出Bob
- 可以有多个泛型参数
function swap<T, U>(tuple: [T, U]): [U, T] {
return [tuple[1], tuple[0]];
}
console.log(swap(['Nine', 9])); // 输出[9,'Nine']
泛型约束
- 泛型继承接口,接口中的方法和属性用来约束泛型
interface Lengthwise {
length: number;
}
function split<T extends Lengthwise>(arg: T): void {
for(let i=0;i<arg.length;i++) {
console.log(arg[i]);
}
}
split('Hello');
// split(9527); 这样的调用会出错,因为数值类型没有length属性
- 约束泛型方法
interface CharAtable {
charAt(index: number): string;
}
function getfirstChar<T extends CharAtable>(arg: T): void {
console.log(arg.charAt(0));
}
getfirstChar('Hello'); // 输出H
泛型类
class MaxClass<T> {
list: T[] = [];
add(value: T): void {
this.list.push(value);
}
max(): T {
let maxValue = this.list[0];
for(let value of this.list) {
if(value > maxValue) {
maxValue = value;
}
}
return maxValue;
}
}
- 可以在里面放任意类型的数组,比较大小
let mcNumbers = new MaxClass<number>();
mcNumbers.add(3);
mcNumbers.add(5);
mcNumbers.add(2);
mcNumbers.add(9);
mcNumbers.add(6);
console.log(mcNumbers.max()); // 输出9
let mcNames = new MaxClass<string>();
mcNames.add('Alice');
mcNames.add('Tom');
mcNames.add('Bob');
console.log(mcNames.max()); // 输出Tom