typescript知识点

typescript

1.在typescript中，数字都是浮点型。

1
let octNum: number = 0o677; // 八进制

2.typescript相比于JavaScript所新引入的类型是：元组(tuple),枚举(enum),任意值(any),void,never。

3.元组：元素数量确定，元素类型确定，元素类型顺序确定（可以有多种类型）。

1
2
let x: [string, number] = ['angular', 2];
let x2: [string, number] = [2, 'angular']; // wrong

4.枚举：下标默认从0开始，可修改默认值，从头开始递增1.

1
2
enum Color {Red = 2, Blue, Green = 6};
let c: Color = Color.Blue; // => c === 3

5.多类型检查

1
2
3
4
5
6
7
8
let n: number = 20;
n = null; // 报错
n = undefined; // 报错

let n2: number | null | undefined;
n2 = 20;
n2 = null;
n2 = undefined;

6.void以及any在不返回值的函数中的运用

1
2
3
4
function fun(foo: () => void) {
  let temp = foo();
  temp.doSth(); // 报错，如果foo返回类型改成any的话则不会报错
}

7.never类型是其他类型的子类型，也就是说never可以赋值给其他类型，而其他类型无法赋值给never类型。never类型表示为会抛出异常或者无法执行到终止点。

1
2
3
4
5
6
7
8
9
let ne: never = (() => { throw new Error('i need never') })();
function error(message: string): never {
  throw new Error(message);
}
function loop(): never {
  while(true) {

  }
}

8.let,const不存在变量提升；在同一个块级作用域中，let只能声明一个变量一次，多次声明报错。

9.变量交换： [a, b] = [b, a];

10.在JavaScript中，函数声明的参数可以和函数在调用时候所传参数出现参数个数不匹配的情况，但是在typescript里面是不允许出现这种情况的，如果想要希望出现可选参数的话，那么可以通过下面几种方法：1.声明是可选参数；2.给参数设置默认值

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
function fun1(a: number, b: number): number {
  return a + b;
}
let result1 = fun1(1); // 报错，漏传参数

/* 1.方式一：声明参数是可选的 */
function fun2(a: number, b?: number): number {
  return a + b;
} // 注意这种写法是不对的，更加正确一点的写法应该是需要判断b是否存在
fun2(1); // NaN

function fun3(a: number, b?: number): number {
  if (b) {
    return a + b;
  } else {
    return a;
  }
}
fun3(1); // 1

/* 方式二：给参数设置一个默认值 */
function fun4(a: number, b:number=2): number {
  return a + b;
}
fun4(1); // 3

以上方法都可以达到声明的参数的长度和实际传参的长度可以不一致的目的，都有着对应的适用场景。

11.函数带有默认值参数，且这个带有默认值的参数不在末位的话，那么应该显示传入undefined

1
2
3
4
function fun5(a:number=1, b:number): number {
  return a + b;
}
fun5(undefined, 1);

12.剩余参数

1
2
3
4
5
6
7
8
function fun(x: number, ...restNumber: number[]): number {
  let result: number = x;
  for (let i = 0; i < restNumber.length; i++) {
    result += restNumber[i];
  }
  return result;
}
let result = fun(1, 2, 3, 4, 5); // 15

13.类修饰符有三个，分别为public，private，protected，默认是public的，private表明该成员只能在所属类中被访问，protected和private类似，但是用它规定的成员不仅能够在所属类中被访问，而且还能够在其派生类中被访问。但是也只是限于在类中，也不能做外部被访问。

14.static静态属性表明该属性是类的，非static属性那就是实例属性了。

15.抽象类：abstract抽象类，抽象类不能用来实例化对象，它是被用来给其他类继承的。抽象类里面可以包含抽象方法，其中抽象方法必须被子类给实现，普通方法可以不被子类实现（也可以进行重载），下面是抽象类的一个例子：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
abstract class Person {
  abstract speak(): void {}; /* 这是一个抽象方法，必须被实现 */
  walking(): void {console.log('walk');
}

class Male extends Person {
  speak(): void {console.log('how are you');}
}

class Mj extends Person {
  speak(): void {console.log('long');};
  walking(): void {console.log('mj-moonwalk');};
}

let person: Person; /* 抽象类无法用来实例化对象 */
person = new Male();
person.speak();
person.walking();

需要注意的地方：抽象类是必须具有抽象方法的，同时也可以具有普通属性。

16.interface，interface属于自定义类型，用法如下所示：

1
2
3
4
5
6
7
8
9
interface FullName {
  firstName: string;
  lastName: string;
}
function printLabel(name: FullName): void {
  console.log(name.firstName, name.lastName);
}
let param = {age: 20, firstName: 'he', lastName: 'didi'};
printLabel(param);

函数类型接口：

1
2
3
4
5
6
7
8
9
interface I_f {
  (val: string, salt: string): string
}

let md5: I_f;
md5 = function(p1: string, p2: string): string {
  return p1 + p2;
}
console.log(md5('hello, ', 'world'));

可索引类型接口：

1
2
3
4
5
6
7
8
9
interface UserArray {
  [index: number]: string;
}
interface UserObject {
  [index: string]: string;
}
let userArray: UserArray = ['a', 'b'];
let userObject: UserObject = {name: 'lisa'};
console.log(userArray[0], userObject['name'], userArray['0']);

当使用数字类型作为索引时，也可以使用字符串作为索引。如上所示。

类类型接口：

1
2
3
4
5
6
interface Animal {
  name: string;
}
class Dog implements Animal {
  name: string; /* 实现一个接口的话，那么就必须要实现接口所声明的属性 */
}

接口扩展：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
interface Animal {
  eat(): void;
}
interface Person {
  talk(): void;
}
class Programmer {
  coding(): void {console.log('I CODE');}
}
class TSProgrammer extends Programmer implements Person {
  eat(): void {console.log('eat');}
  talk(): void {console.log('talk');}
  coding(): void {console.log('enjoy ts');}
}
let tsp = new TSProgrammer();
tsp.eat();
tsp.talk();
tsp.coding();