TypeScript

一、概念：

  是JavaScript的一个超集,主要提供了类型系统和对ES6的支持,它由Microsoft开发

二、介绍

  1、类型检查

   运行赋值语句时,知道变量的数据类型

  2、支持ES6语法

三、运行环境

  1、手动编译

    安装下载:npm i typeScript -g

    版本:4.7.14

    编译:tsc ts文件

  2、自动编译

    -安装下载:

      npm i typeScript -g    可将ts文件编译为js文件

      npm i live-server -g   live-server命令,直接启动内置web服务

      npm i npm-run-all -g   npm-run-all 实现多个任务同时并发或按顺序执行

    -创建项目

    -初始化项目 npm init -y

    -生成ts的项目描述文件 tsc --init

    --手动配置命名

      在"script"中定义:

      "a":"live-server",               //启动内置web服务

      "b":"tsc -w",                    //将ts文件编译为js文件

      "start":"npm-run-all -p a b "   //多个任务同时并发或按顺序执行

四、基础语法

  1、数据类型

    -就是JavaScript中的数据类型

    -v0id:表示空值

  2、声明变量

    --定义类型

      let 变量名:变量类型 = 赋值

    --任意值

      any用来表示允许赋值为任意类型

    --当为指定类型时，会自动识别为任意值类型

    --类型推论

    --联合类型

      概念:表示取值可以为多种类型中的一种

      语法:let 变量名:string | number

    --对象类型

       使用interface来定义对象的类型

       语法:

         1、声明接口

          interface Person(

            //定义对象属性

            变量名1:数据类型1,

            变量名2:数据类型2,

          )

         2、

          const tome:Person = {

            变量名1:变量值1,

            变量名2:变量值2,

          }

    --数组类型

      语法:let 变量名:数据类型[] = [值]

      含义:表示数组元素只能是指定的数据类型

    --函数类型

      语法:

      -有返回值:

        function fun(形参1:数据类型1,形参2:数据类型2):返回值数据类型{

          return x + y

        }

        function fun(x:number,y:number):number{

          return x + y

        }

      -无返回值

       function fun(形参1:数据类型1,形参2:数据类型2):void{

        return x + y

       }

      -函数可选参数

       在参数名后加上?号,表示

       function fun(形参1:数据类型1,形参2?:数据类型2):void{

          return x + y

       }

    --类型断言

      语法:值 as 数据类型

    --声明文件

       使用第三方库时,需要声明文件

    --内置对象

      语法:let 变量名:Date = new Date()

五、进阶

  1、类型别名

   语法:

       type str = string

       let s:str = 'hello'

  2、字符串字面量类型

  3、元组

    概念:数组合并了相同类型的对象,而元组合并了不同类型的对象

    语法:

      let tom:[number,string] = [100,'hello']

  4、枚举

    语法:enum num {red,green,yellow}

    可以根据值得到序号,也可根据序号得到值  

  5、类

    1、概念

    2、修饰符

       放在类和属性和方法前,表示类方法的使用范围

       private : 私有的

       public : 公共的

       protected : 受保护的

    3、语法

    4、static:修饰的属性为静态属性

  6、类与接口

  7、泛型

   含义:指在定义函数,接口或类的时候,不预先指定具体的类型,在使用的时候再指定

   语法:

    函数中:在函数名与括号之间定义<T>

    函数使用传参:在函数名与括号之间定义类型,如<number>

    --一个参数时

      function fun<T>(x:T):T{

        return

      }

      fun<number>(10)

    --两个参数时

      function fun<T,E>(x:T,y:E):E{

        return

      }

      fun<number,string>(10,'hello')