TS的基本操作

Ts开始
	1.安装全局ts
    	npm i typescript -g
	2.tsc --init 初始化配置文件
    3.创建ts文件和js文件
    4.打开配置文件tsconfig.json
	5."target":"es5" 将Ts文件转化为js的那个版本
    6."modolue":"amd" 模块化
    7."rootDir":"./ts"文件夹 将js转换文ts文件夹的路径
    8."outDir":"./js"目标输出的路径 将ts转化为js文件路径
    9."declaration": "true" 针对代码的提示功能，可以解析项目中的 ts 文件，得到 js 文件和 *.d.js 声明文件
    10."sourceMap" 映射源码和目标代码的代码位置
    10."declarationMap": true 描述应映射，为映射回原始源文件的文件生成源映射。这将允许VS Code等编辑器在使用“转到定义”等功能时转到原始文件。.d.ts.ts.ts，如果您使用的是项目引用，则应强烈建议您启用此功能。
    11.var n:number=2是属于数值型
    12.var n:Number=2数值对象型
    13.var n:string = "a"
    14.var n:Sting = "a"
    15.var n:boolenan = true
    16.var n:Boolenan = false
数组类型
 	1.<>是泛型
	2.var arr:Array<number> = [1,2,3,4]//(推荐这个一个写法)
    3.var arr1:number=[]=[1,2,3,4]
二维数组
    1.var arr:Array<Array<number>>=[[1,2,3],[4,5,6]]
    2.var arr1:number[][]=[[1,2,3],[4,5,6]]
    3.var arr:Array<number|string> =['1',2,'3']//(不推荐使用)
元组
 	//值与类型必须一一对应的
  	1.var list:[string,number] = ["a",3]
    2.var str:sting=list[00]
    3.var num:number=list[1]
枚举
	1.enum COLOR{RED,GREEN,BLUE}->console.log(COLOR.RED)//只读属性是个常量，没有给值的时候默认是索引的值，如果给值了就不是默认的值了
	2.enum COLOR{RED="red",GREEN="pink",BLUE="bing"}->console.log(COLOR.RED)//给值的值就是对应的数值 不能设置Symbol
type类型
	//可以用type给出限定值范围的值
	1.type action = "walk"|"jump"|"run"|"play"//定义了一种Ttype类型
	2.var actior:Action = "run"//给对应的值就可以进行判断
    3.if(actior === "可以选中你定义的数值"){}
any类型
	1.var a:any= 3;->a="a"(禁止部分时候any类型)
void类型
	不返回类型,当函数时候，如果函数使用了return 返回一个值，函数后必须使用：返回值的类型
	没有返回值或者return 仅跳出
    1.function fn():number{
        return 1;
    }
	2. 	function fn():void{
        return 1;//没有值返回值或者return仅跳出
    }

注意: ? 的用法

var a:number|undefnd
在类型种描述，或者在函数中给描述类型的时候，需要使用undefin类型 可以使用？代替
function fu(a:number,b:number|undefinf=undefinde){}
function fn(a:number,b?:number):number|undefind{return undefind}



never类型
	抛出异常
    1.function fn():never{throw new Error('aaa')}
对象类型
	1.var o:object={a:1,b:2}
    2.var o1:Object={a:1,b:2}
    3.o.a=10,0.c=10
断言类型
	1.var n:number|string=3; console.log(n)//不能直接转换 断言
	2.var n:any=3;console.log((n as string).length)
	泛型断言
    3.console.log(<string>n.lengtxh)     1.readonly是只读属性
                    

```typescript
真正的类如下

export default class Box{}导出类

public 共有的
​		public a:number= 1
实例化对象可以调用的，在子类的方法中可以调用这个，共有方法在子类中可以重写（重构）

private私有的
​		privete b:number =2
实例化对象不能调用，在子类的中方法中不能调用，私有方法在子类中不能出现重名，不能重构

protecated受保护的
​			protected c:number=3
实例化对象不能调用，在子类的方法中可以调用，受保护的
1.先将索引属性和方法设置为私有的
2.当子类需要继承父类的时候，需要重构方法或者在子类中，需要调用的属性和方法需要在父类中设置受保护的
3.当需要实例化暴露出去的可以调用的才能这只为公有的
-------------------------------------------
class Box{
   	不能写:void的属性
    private _CHECKED:BOOLENAN=FALSE 私有的
    public set checked(value:boolean){
        this._chaeck = value
    }
    
}
------------------------------------------
class BOX{
    constrouctor 不能写返回类型的
    public constrouctor(){
        
    }
    1.私有的构造函数不能实例化，也不能继承
    private constrouctor(){
        
    }
    
    2.受保护不能实例化
    proteced constrouctor(){
        
    }
}
    class Ball extends Bxo{
        constrouctor(){
            super()
        }
        pulic play()void
        {
            
        }   
}
3.所有的受保护类型的构造函数不能实例化
var b:Box = new Box()
-------------------------------------
 静态的属性
	1.class Bxo{
        public static a:number= 1
        privete static a:number= 2
        public static a:number= 1        
    }
   1.实例化属性定义后必须赋初始值，静态属性定义后可以用赋初始值
   2、赋初始值可以在两个部分某一个在定义时候赋值，另一个在构造函数中赋值
   3.继承的时候静态属性和方法也会被继承到
   
   
接口和类的关系
	1.所有的定义到类接口中的都是public公有的属性
    2.public不能赋值初始值，类接口中不允许赋值，不允许实现方法内容
    3.implements实现接口,可以使用两个接口
    4.写自身的方法，public a:number= 2
    4.写自身的方法，public a:number= 2
	5.constructor(){}
	6


----------------------------------------
接口的继承
	1.可以同时继承多个
    2.接口还能继承类
    3.私有 受保护的都不要继承，所有的接口方法必须式公有的方法
    	class Ball{
            public a:number=1
            public b:number=2
        }
	


抽象类不能实例化，一般作为基类的使用  用来及继承
absteact class Box{
    public a:number = 1;
    public abstract c:number;
	public abstract play():void
    proteced run()：void(){
        this.jump()
    }
private jump():void{
    vonsole.log("jump")
}
}

class Ball exends Box{
public a:number =1;
  public abstrat a:number;
   public abstract play():void
    constructor(){
        super()
    }
    public play():void{
        super();
    }
}

1.npm init -y
2.安装nodemon  types/node 18.0.1
3.创建两个文件夹一个TS一个JS
4.进入TSjson文件进行配置
5.分两个命令框框
6.监听转换tsc-w npm server
7.创建一个ServerC.ts Main.ts Server.ts文件
8.

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-wSVEfPUC-1657291378426)(C:\Users\26029\AppData\Roaming\Typora\typora-user-images\image-20220705165911468.png)]

笔记
1.重载
	就是函数或者方法有相同的名称，但是参数列表不相同的情形，这样的同名不同参数的函数或者方法之间，互相称之为重载函数或者重载方法。在TS中同一个类中的2个或2个以上的方法可以有同一个名字，只要它们的参数声明不同即可。这种情况下，该方法就被称为重载，也可以使用any数据进行提换上面的fn定义的数据名称
    function fn(a: number): number;
function fn(a: string): string;
function fn(a: any): any {
    if (typeof a === "number") {
        return a + 1;
    } else if (typeof a === "string") {
        return a + "a";
    }
}
var s: number = fn(3);
console.log(s);
var s1: string = fn('a');
console.log(s1);
2.any的类型表示是任意属性，就比如你生明了多个属性名a:number，b:string，any就可以以上a，定义的数据类型，然后你在if里面可以进行判断，是不是你想要的number或者数值型
function fn(a: any): any {
    if (typeof a === "number") {
        return a + 1;
    } else if (typeof a === "string") {
        return a + "a";
    }
}
var s: number = fn(3);
console.log(s);
var s1: string = fn('a');
console.log(s1)
3.<>泛型
泛型是 <> 一对尖叫好包裹在里面的数据是泛型的类型，T可以理解为变量，T就是传参的类型，T也可以认为是一个占位符，T可以自己想放入的值比如W，D，G等，当你调用你这个函数的时候带如你想传入的参数，比如fn<sting>('a')
function fn<T>(a: T): T {
    console.log(a);
    return a;
}
fn<string>('a')

// 这个就是自动的类型D，然后主力a1，调用传过去的事一个属性型
function fn1<D>(a1: D): D {
    console.log(a1);
    return a1;
}
fn1<number>(5)

// 带如多个值 输出结果就是数值型1字符型2
function fn2<A, B>(a: A, b: B): void {
    console.log(a, b)
}
fn2<number, string>(1, "2")
// 也可以入多条语句用。。。yufa
function fn4<T>(...arg:Array<T>):void
{
    console.log(arg);
}
fn4<number>(1,2,3,4);
fn4<string>("a","b","c");
4.接口泛，interface把你定义属性之间定义到这个接口里面，通过给定的属性名来进行调用，相当于T里面事个空值，通过你调用函数传进来的数来进行调用,下传入的的m和传入T的结果是一样的
interface IUpdate<T> {
    n: T;
    update(m: T): void;
}

class Box implements IUpdate<number>{
    public n: number = 1;
    public update(m: number): void {

    }
}

class Ball implements IUpdate<string>{
    public n: string = "a";
    public update(m: string): void {

    }
}
var ball = new Ball();
var box = new Box();
console.log(ball, box);

6.类泛型,可以使用，不太理解
class Rect<T>{
    private n: T;
    constructor(_n: T) {
        this.n = _n;
    }
}

var c: Rect<string> = new Rect("a");
var d: Rect<number> = new Rect(4);


class Cicle<T, Y>{
    private n?: T;
    public m?: Y;

    public run(_m: Y): Y {
        this.m = _m;
        return _m;
    }

}

var a: Cicle<string, number> = new Cicle();
a.run(5)
console.log(a);
7.泛型里面使用类型里面
var b: Box = new Box();
function createObj<T>(className: { new(): T }): void {
    var b: T = new className();
    console.log(b);
}
createObj<Box>(Box)

// 交叉类型
// <T, U > 是给他设置的空参，通过调用a，b能获取到的对用的属性据
function fn<T, U>(a: T, b: U): T & U {
    var result = <T & U>{};
    for (var key in a) {
        (result as any)[key] = a[key];
    }
    for (var prop in b) {
        (result as any)[prop] = b[prop];
    }
    return result;
}

interface IA {
    a: number;
    b: number;
}
interface IB {
    c: string;
    d: string;
}
var o: IA = { a: 0, b: 0 };
var o1: IB = { c: "a", d: "b" };
console.log(o, o1);


    

(b);
}
createObj(Box)

// 交叉类型
// <T, U > 是给他设置的空参，通过调用a，b能获取到的对用的属性据
function fn<T, U>(a: T, b: U): T & U {
var result = <T & U>{};
for (var key in a) {
(result as any)[key] = a[key];
}
for (var prop in b) {
(result as any)[prop] = b[prop];
}
return result;
}

interface IA {
a: number;
b: number;
}
interface IB {
c: string;
d: string;
}
var o: IA = { a: 0, b: 0 };
var o1: IB = { c: “a”, d: “b” };
console.log(o, o1);