TypeScript-01-数据类型

10/25/2020 TS

# TypeScript-01-数据类型

# 基础数据类型

TypeScript的原始类型(number、string、bigint、boolean、symbol、null、undefined、object) 对应JavaScript8 种内置类型:Number、String、BigInt、Boolean、Symbol、Null、Undefined、Object TypeScript还定义了:unknown、never、void、数组、元组、函数等

tsconfig.json指定了"strictNullChecks":true, null 和 undefined 只能赋值给 void 和它们各自的类型

number和bigint都表示数字,但是这两个类型不兼容,不能互相赋值

let str: string = "jimmy";
let num: number = 24;
let bool: boolean = false;
let u: undefined = undefined;
let n: null = null;
let obj: object = { x: 1 };
let big: bigint = 100n;
let sym: symbol = Symbol("me"); 

// ***********  定义数组 **********************
let arr:string[] = ["1","2"];
let arr2:Array<string> = ["1","2"];
// 定义联合类型数组
let arr:(number | string)[];
// 定义指定对象成员的数组
interface Arrobj{ name:string,  age:number }
let arr3:Arrobj[]=[ { name:'jimmy', age:22 } ]

// ***********  Tuple元组:表示已知元素数量和类型的数组,长度已指定 ************
let x: [string, number]; 
//  x = ['hello', 10]; // OK      x = [10, 'hello']; // Error
//  解构赋值
let employee: [number, string] = [1, "Semlinker"];
let [id, username] = employee;
//  可选元素  --  ?号声明可选元素
type Point = [number, number?, number?];
const xy: Point = [10, 20]; // 二维坐标点
// 剩余元素
type RestTupleType = [number, ...string[]];
let restTuple: RestTupleType = [666, "Semlinker", "Kakuqo", "Lolo"];
//  只读的元组类型
const point: readonly [number, number] = [10, 20];

// ***********  void  **********************
let a: void;
let b: number = a; // Error
// strictNullChecks未指定为true, void类型只能赋予null和undefined
function fun(): undefined {   console.log("this is TypeScript"); };
fun(); // Error,方法没有返回值得到undefined,但是需定义成void类型

//  ***********  never  ********************** 
// never类型表示的是那些永不存在的值的类型
// 函数执行时抛出了异常,该函数永远不存在返回值
//  函数中执行无限循环的代码--死循环
// never类型同null和undefined一样,是任何类型的子类型,可赋值给任何类型
//  任何类型都不能赋值给never类型,除了never本身,any也不行

// ***********  any  ********************** 
//  允许被赋值为任意类型,在any上访问任何属性都是允许的,也允许调用任何方法
let anyThing: any = 'Tom';
anyThing.setName('Jerry');
anyThing.setName('Jerry').sayHello();
//  无法使用 TypeScript 提供的保护机制

// ***********  unknown  ********************** 
// unknown与any的最大区别是:任何类型的值可以赋值给any,any类型的值也可赋值给任何类型。
//   任何类型的值都可以赋值给unknown,但它只能赋值给unknown和any


//  ***********   object、Object 和 {}  **********************    
// object 是一个宽泛的通用的非基本类型
let foo: { [key: string]: string } = {};
let bar: object = {};
bar = foo; // OK
// 不能将类型 object 分配给类型 { [key: string]: string; }
foo = bar; // Error

//  Object 接口(类型) 用于定义 JS Object 的原型对象Object.prototype
// ObjectConstructor 用于定义 Object 自身的属性,如Object.create()
// Object 的所有实例都继承了 Object 接口的所有属性/方法
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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
  • object 是TypeScript v2.2引入的一种非基本类型,表示任何非原始值类型,包括对象、函数、数组等;不能被赋予原始值。

  • Object 是对TypeScript对JavaScript Object.prototype原型对象的定义,是所属对象类型的顶层类型,即所有对象类型都继承了Object中定义的属性/方法。 JavaScript的装箱拆箱机制,基本类型有能力访问Object.prototype原型对象上的属性。。

  • {} 是一个没有任何成员的对象类型,它可以访问Object中定义的属性/方法,也可以被赋予原始值。 虽然 Object 和 {} 都可以接受基本类型的值,但并不包括 null 和 undefined

# 函数

//  函数声明
function sum(x: number, y: number): number { return x + y; }

//  函数表达式:限制等号左侧的类型,对函数名赋值时保证参数个数和类型、返回值类型不变。
let mySum: (x: number, y: number) => number = function (x: number, y: number): number { return x + y; };

// 用接口定义函数类型
interface SearchFunc{ (source: string, subString: string): boolean; }

// 可选参数--可选参数后面不允许再出现必需参数
function buildName(firstName: string, lastName?: string) { 
    lastName ? return firstName + ' ' + lastName : return firstName;   
}
let tomcat = buildName('Tom', 'Cat');
let tom = buildName('Tom');

// 参数默认值
function buildName(firstName: string, lastName: string = 'Cat') {   
    return firstName + ' ' + lastName;
}

// 剩余参数
function push(array: any[], ...items: any[]) {
    items.forEach(function(item) { array.push(item); });
}
let a = [];
push(a, 1, 2, 3);

// 函数重载或方法重载----使用相同名称和不同参数数量或类型创建多个方法
function add(a: number, b: number): number;
function add(a: string, b: string): string;
function add(a: string, b: number): string;
function add(a: number, b: string): string;
function add(a: Combinable, b: Combinable) {  // type Combinable = string | number;
  if (typeof a === 'string' || typeof b === 'string') { 
      return a.toString() + b.toString(); 
  }
  return a + b;
}
class Calculator {
  add(a: Combinable, b: Combinable) {
    if (typeof a === 'string' || typeof b === 'string') {
      return a.toString() + b.toString();
    }
    return a + b;
  }
}
const calculator = new Calculator();
const result = calculator.add('Semlinker', ' Kakuqo');
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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49