博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

TypeScript学习笔记

Posted on 2023-06-29 17:20  卡卡Kk  阅读(22)  评论(0编辑  收藏  举报

一、类型

① 可以使用  |  来连接多个类型(联合类型)

 ② 类型断言,可以用来告诉解析器变量的实际类型

 ③ {} 用来指定对象中可以包含哪些属性

 ④ 函数结构的类型声明

 ⑤ 数组的类型声明

⑥ 元组,元组就是固定长度的数组

 ⑦ enum 枚举

⑧ 类别的别名

 二、编译选项

 ① 自动编译文件

  编译文件时,使用 -w 指令后,TS编译器会自动监视文件的变化,并在文件发生变化时对文件进行重新编译。

  示例:

tsc xxx.ts -w

② 自动编译整个项目

  如果直接使用 tsc 指令,则可以自动将当前项目下的所有 ts 文件编译为 js 文件;

  但是能直接使用 tsc 命令的前提时,要先在项目根目录下创建一个ts的配置文件 tsconfig.json;

  tsconfig.json 是一个JSON文件,添加配置文件后,只需 tsc 命令即可完成对整个项目的编译。

  配置选项:

       

       

   ☆ compilerOptions 编译器的选项

  编译选项是配置文件中非常重要也比较复杂的配置选项
  在 compilerOptions 中包含多个子选项,用来完成对编译的配置

       

      

      

      

       

  对编译器检查的配置:如果设置  “strict”:true,底下四个都为true,就不用分别设置了,即所有严格模式的总开关。

       

 三、使用 webpack 打包 ts 代码

      ① 对项目进行初始化: 

                        生成 package.json 管理项目。

      ② 安装使用 webpack 的一些依赖

                   

    ③ 编写 webpack 的配置文件  (与  package.json  同级目录下)

                    

                    

                    

   ④ 编写 TS 的配置文件 tsconfig.json

                    

    在 package.json 中加一条命令:通过“build”命令直接执行 webpack

                   

  ⑦ 执行 webpack

                    

   一些配置

  ① 配置插件,自动生成 html 文件

 

                 

   引入

                

   配置      template: "./src……" 根据提供的模板来生成 html 文件

    

   ② 配置插件,webpack 开发服务器

              

              

     npm  start

 

  ③ 配置插件,清除 dist 目录

 

                 

                 

                 

   ④ 设置引用模块

 

 

                 

   babel 解决兼容问题

 

  安装

 

               

 

  在 webpak 里的 module 里配置

                

                

   在 webpak 里的 output 里配置

               

 

四、一些琐碎知识点

             ① 类

              

    ② 构造函数和this :this就表示当前对象

             

    ③ 继承

              

     super 关键字:代表当前类的父类,在子类的构造函数中必须得再调一下父类的构造函数。

              

    ④ 抽象类

              

              

    ⑤ 接口

    接口用来定义一个类结构,用来定义一个类中应该包含哪些属性和方法;
   同时接口也可以当成类型声明去使用。接口可以重复声明,取和。

              

    接口可以在定义类的时候去限制类的结构:
    接口中的所有的属性都不能有实际的值;
    接口只定义对象的结构,而不考虑实际值;
    在接口中所有的方法都是抽象方法。

                 

                

    ⑥ 属性的封装

    现在属性是在对象中设置的,属性可以任意的被修改,
   属性可以任意被修改将会导致对象中的数据变得非常不安全。

 

      public 修饰的属性可以在任意位置访问(修改)默认值;

   private 私有属性,私有属性只能在类内部进行访问(修改);

    protected 受包含的属性,只能在当前类和当前类的子类中访问(修改)

    -通过在类中添加方法使得私有属性可以被外部访问。

                 

    getter方法用来读取属性    setter方法用来设置属性
      -它们被称为属性的存取器

                

                

     下面两种写法一样

               

    ⑦ 泛型

    在定义函数或是类时,如果遇到类型不明确就可以使用泛型