ts基础类型

基本类型

let isFlag:boolean = false;           //布尔
let num1:number = 1                  //number
let str1:string = "2"                      //string
let var1:null = null                       // null
let var2:undefined = undefined //undefined


//一个变量可以赋值多种类型
let var3:boolean | number = 1
var3 = true

any 任何类型

我们不希望类型检查器对这些值进行检查而是直接让它们通过编译阶段的检查。可以使用 any类型来标记这些变量

let notSure:any = 4

数组

let arr1:number[]=[1,2,3]                  //方式一：元素类型[]
let arr2:Array<string> = ['1','3']         //方式二：Array<元素类型>   

let ro:ReadonlyArray<number> = [1,2,3] //ReadonlyArray<元素类型>  可以确保数组创建后再也不能被修改
ro[0]=4 //报错
ro.push(5); // 报错
ro.length = 100; // 报错
arr1 = ro ;     //报错  就算把整个ReadonlyArray赋值到一个普通数组也是不可以的

arr1 = ro as number[] //可以用类型断言重写

引用对象

接口可以描述对象的shape，也能描述函数类型

interfance接口描述普通对象

• 必含的： age: number；
• 可选的：sex?:string；
• 只读的：readonly x:number；
• 任意数量的其他属性： [propName:string]:any； 如果any换成其他类型的必须是接口上其他数据描述的的集合，否则报错。
  readonly和const区别：属性只读用readonly；变量只读用const

//接口描述：必须包含age,name，x, 并且类型也要对应上；sex为可选属性,x为只读属性
interface Person{
    age: number; //必含的
    name: string;  //必含的
    sex?:string; //可选的
    readonly x:number;  //必含的并且只读的
}

//不能加别的属性,添加别的属性会报错
let person1:Person = {
    age: 10,
    name: 'aa'，
    x:1
}
person1.x = 2  //x是只读属性，报错


interface SquareConfig {
    color?: string;
    width?: number;
    [propName: string]: any; //任意数量的其他类型 此时any不能换为单独的string，number，必须是string和number的集合。
}
let obj1:SquareConfig  = {
	color: 'red',
	aa:1,
	fun: function(){},
}

接口继承：
接口也可以相互继承。 这让我们能够从一个接口里复制成员到另一个接口里，可以更灵活地将接口分割到可重用的模块里。

interface Shape {
    color: string;
}
interface PenStroke {
    penWidth: number;
}
//可继承一个或多个接口
interface Square  extends Shape,PenStroke{
   sideLength: number;
}


let square:Square   = {
	color:'red',
	penWidth: 5,
	sideLength: 10
}
let square1 = <Square>{
    color:'blue',
	penWidth: 8,
	sideLength: 12
}

interfance接口描述函数类型

//定义函数描述接口
interface SearchFunc {
 //参数列表和返回值类型的函数定义。参数列表里的每个参数都需要名字和类型。
  (source: string, subString: string): boolean;
}

let mySearch: SearchFunc;
mySearch = function(source: string, subString: string) {
  let result = source.search(subString);
  return result > -1;
}
mySearch('1','2')

// 对于函数类型的类型检查来说，函数的参数名不需要与接口里定义的名字相匹配。但是类型要和接口定义的类型匹配。
mySearch = function(src: string, sub: string): boolean {
  let result = src.search(sub);
  return result > -1;
}


//必须包含age,name，并且类型也要对应上,可以有别的属性
function printLabel1(person2: Person ) {
    console.log(person2.city);
}
let person2 = {age:10,name:'a',sex:'男',city:'上海'}
printLabel1(myObj1);

interfance接口描述可索引的类型

1.数字下标索引arr[0]

//我们定义了StringArray接口，它具有索引签名。 这个索引签名表示了当用 number去索引StringArray时会得到string类型的返回值。
interface StringArray {
  [index: number]: string; //定义获取下标为数字，每个值为string类型
}

let arr:StringArray  = ["Bob", "Fred"]
console.log(arr[0])

索引签名设置为只读，防止了给索引赋值：

interface ReadonlyStringArray {
    readonly [index: number]: string;
}
let myArray: ReadonlyStringArray = ["Alice", "Bob"];
myArray[2] = "Mallory"; // error! 不能设置myArray[2] ，索引签名是只读的

2.字符串索引声明了 obj.property和obj[“property”]两种形式

interface NumberDictionary {
  [index: string]: number; //定义获取下标为字符串，值为number
  length: number;    // 可以，length是number类型
  //name: string       // 错误，`name`的类型与索引类型返回值的类型不匹配
}
let obj:NumberDictionary  = {'length':2}
console.log(obj.length,obj["length"])

元祖 Tuple

元组类型允许表示一个已知元素数量和类型的数组，各元素的类型不必相同。

let x:[string,number] = ['h',1];

枚举

enum类型是对JavaScript标准数据类型的一个补充。使用枚举类型可以为一组数值赋予友好的名字。

enum Color {Red,Green}
let c:Color = Color.Red //0
console.log(Color)//{0: 'Red', 1: 'Green', Red: 0, Green: 1}

//编译为js文件就是:
var Color;
(function (Color) {
    Color[Color["Red"] = 0] = "Red";
    Color[Color["Green"] = 1] = "Green";
})(Color || (Color = {}));
var c = Color.Red; 

默认情况下，从0开始为元素编号。 你也可以手动的指定成员的数值。

enum Color {Red = 1, Green}

//编译为js文件就是:
var Color;
(function (Color) {
    Color[Color["Red"] = 1] = "Red";
    Color[Color["Green"] = 2] = "Green";
})(Color || (Color = {}));

或者，全部都采用手动赋值：

enum Color {Red = 1, Green =4}

//编译为js文件就是:
var Color;
(function (Color) {
    Color[Color["Red"] = 1] = "Red";
    Color[Color["Green"] = 4] = "Green";
})(Color || (Color = {}));

枚举类型提供的一个便利是你可以由枚举的值得到它的名字。 例如，我们知道数值为2，但是不确定它映射到Color里的哪个名字，我们可以查找相应的名字。