TypeScript 基础知识

前言：

        只是一篇学习笔记！！！

正文：

// 1、字符串声明
let message: string = "message";
// 2、数字
let age: number = 25;
// 3、布尔值
let isResult: boolean = false;
// 4、数组---- 可以使用 type[] 或 Array<type> 两种方式表示。
let numbers: number[] = [1, 2, 3]; //方式1
let numbers2: Array<number> = [4, 5, 6]; //方式2
let strs: string[] = ["Lee", "Yu", "Fan"];
let strs2: Array<string> = ["Lee_", "Yu_", "Fan"];
// 5、元组 表示已知数量和类型的数组
let p: [string, number] = ["Lee_YU_Fan", 25];
// 6、枚举 用来定义一组命名常量。默认情况下枚举的值是从0开始递增
enum Sex {
  "male" = "男",
  "famale" = "女",
}
let mine: Sex = Sex["male"]; // 输出内容 男
// 7、对象类型 表示非原始类型的值，适用于复杂的对象结构
let user: object = { name: "Lee_YU_Fan", age: 25 };
// 8、联合类型，表示一个变量可以是多种类型之一
let id: string | number;
id = "123";
id = 456;
/* 
9、类型断言 可以让开发者明确告诉编译器变量的类型
   常用于无法推断的情况。可以使用as或尖括号语法
   <类型> 值
   值 as 类型
*/

let value: any = "this id a setring";
let strLength: number = (value as string).length;
let strLen: number = (<string>value).length;
/*
10、字面量类型 可以让变量只能拥有特定的值 
*/
let direction: "up" | "down" | "left" | "right";
direction = "down";

# 数组

//多维数组
let multi:number[][] = [[1,2,3],[4,5,6]]

# Map 对象

//创建Map
let map = new Map()

//初始化Map可以以数组的格式来传入键值对
let map = new Map([["key1","value1"],["key2","value2"]])

//移除Map对象的所有键值对
map.clear()

//设置键值对
map.set("key","value")

// 根据键名获取值
let value = map.get("key")

// 返回一个布尔值，用于判断Map中是否包含键对应的值
let result = map.has("key")

// 删除指定键的键值对，成功删除返回true否则返回false
let res = map.delete("key")

//返回Map中键值对的数量
let len = map.size

// 迭代方法
//1、输出所有的键
for(let k of map.keys()){
    console.log(k)
}
//2、输出所有键对应的值
for(let v of map.values()){
    console.log(v)
}
//3、输出所有键值对
for(let [key,value] of map.entries()){
    console.log(key,value)
}

map.forEach((value,key)=>{
console.log(value,key)
})

  # 元组 

//元组是一种特殊类型的数组，允许在数组中存储不同类型的元素，
//与普通数组不同，元组中的每个元素都有明确的类型和位置。
//元组可以在很多场景下用于表示固定长度，且个元素类型已知的数据结构

//创建元组
let tuple: [number, string, boolean];
tuple = [123, "Lee", false];
console.log(tuple[1]); // "Lee"

//通过push方法可以向元组的末尾添加一个元素，类型必须符合元组定义中的类型约束
//如果超出元组的类型约束，会报错
tuple.push(356);
tuple.pop();

//更新元组
let tup1 = [121, "110"];
tup1[0] = 345;
console.log(tup1); //[345,'110']

//使用标签元组，ts运行为元组中的每个元素添加标签
let tuple2: [id: number, name: string] = [1, "Lee"];
console.log(tuple2); // [1, "Lee"]

//转换为普通数组 -- 元组是一个固定长度、固定类型的数组。但是可以通过Array.prototype
//的方法将其转换为普通数组
let tup3:[number,string,boolean] = [42,'hello',true]
let arr = Array.from(tup3)
console.log(arr)

//元组可以使用数组的concat方法进行连接，但是连接后的结果是一个普通数组而不是元组
//还可以使用数组的slice方法对元组进行切片操作，返回一个新的数组
//还可以使用for...of循环或者forEach方法遍历元组中的元组

# 接口  

//定义一个接口 IPerson
interface IPerson {
  firstName: string;
  lastName: string;
  age: number | string;
  sayHi: () => string;
}
let customer: IPerson = {
  firstName: "Lee",
  lastName: "Yu_Fan",
  sayHi: (): string => {
    return "hi";
  },
};
console.log(customer.firstName);
console.log(customer.lastName);
console.log(customer.sayHi());
let employee: IPerson = {
  firstName: "Cui",
  lastName: "Meng_Jie",
  sayHi: (): string => {
    return "hi";
  },
};
console.log(employee.firstName);
console.log(employee.lastName);
console.log(employee.sayHi());

//接口继承
interface Person {
  age: number;
}
interface Sex {
  sex: string;
}
interface Musician extends Person, Sex {
  instrument: string;
}
let drummer = <Musician>{};
drummer.age = 26;
drummer.instrument = "Drums";
drummer.sex = "male";
console.log(drummer);

# 类

//创建一个Person类
class Person{}
//通过编译得到javascript代码
var Person = (function(){
    function Person(){}
    return Person 
}())

//创建类的数据成员
class Car{
    //字段
    engine:string;
    //构造函数
    constructor(engine:string){
        this.engine = engine
    }
    //方法
    disp():void{
        console.log("发动机为：",this.engine)
    }
}
//创建一个对象
var obj = new Car("XXSY1")
//访问字段
console.log(obj.engine)
//访问方法
obj .disp()

//----------编译代码-----------
var Car = (function{
    //构造函数
    function Car(engine){
        this.engine = engine
    }
    //方法
    Car.prototype.disp = function(){
       console.log("发动机为：",this.engine)
    }
    return Car;
}())
//创建一个对象
var obj = new Car("XXSY1")
//访问字段
console.log(obj.engine)
//访问方法
obj .disp()

/*
    typescript 一次只能继承一个类，不支持继承多个类，但支持多重继承（A继承B,B继承C）
*/
class Shape{
    Area:number;
    constructor(a:number){
        this.Area = a
    }
}
class Circle extends Shape{
    disp():void{
        console.log("圆的面积："+ this.Area)
    }
}
var obj = new Circle(223)
obj.disp()

//多重继承
class Root{
    str:string;
}
class Child extends Root{}
class Leaf extends Child{}
var obj = new Leaf()
obj.str = "hello"
console.log(obj.str)

/*
    继承类的方法重写
    类继承后，子类可以对父类的方法重新定义，通过super关键字可以对父类进行直接引用，该关键字
    可以引用父类的属性和方法
*/

class PrinterClass{
    doPrint():void{
        console.log("父类的doPrint()方法")
    }
}
class StringPrinter extends PrinterClass {
    doPrint():void{
        super.doPrint()//调用父类的函数
        console.log("子类的doPrint()方法")
    }
}

/*
    static 关键字
    用于定义类的数据成员（属性和方法）为静态的，静态成员可以直接通过类名调用
*/
class StaticMem{
    static num:number;
    static disp():void{
        console.log(StaticMem.num)
    }
}
StaticMem.num = 12 //初始化静态变量
StaticMem.disp() //调用静态方法
let s = new StaticMem()
s.disp() //这中方式是访问不到的

/*
    类和接口
        类可以实现接口
*/
interface ILoan{
    interest:number
}
class AgriLoan implements ILoan{
    interest:number
    rebate:number
    constuctor(interest:number,rebate:number){
        this.interest = interest
        this.rebate = rebate
    }
}
var obj = new AgriLoan(10,1)