Typescript入门 | 青训营笔记

这是我参与「第四届青训营 」笔记创作活动的第4天
今天学习的内容是Typescirpt,下面从三个方面总结今天的所获所得。

😄what

• 什么是TypeScript
  1. TypeScript是 JavaScript 的超集，扩展了 JavaScript 的语法，因此现有的 JavaScript 代码可与 TypeScript 一起工作无需任何修改，TypeScript 通过类型注解提供编译时的静态类型检查。TypeScript 可处理已有的 JavaScript 代码，并只对其中的 TypeScript 代码进行编译。

😄why

• 为什么我们要使用Typescript

  • 静态输入

    1. 静态类型化是一种功能，可以在进行编写脚本时检测错误。查找并修复错误，对于编写更健壮的代码并对其进行维护，以便使得代码质量更好、更清晰。

  • 大型的开发项目

    2. 有时为了改进开发项目，需要对代码库进行小的增量更改。这些小小的变化可能会产生严重的、意想不到的后果，因此有必要撤销这些变化。而使用TypeScript工具来进行重构更变的容易、快捷。

  • 更好的协作

    3. 当发开大型项目时，进行开发的过程当中乱码和错误的机也会增加。类型安全是一种在编码期间检测错误的功能，而不是在编译项目时检测错误。

😄how

• 如何去使用Typescript

  1. 搭建ts环境

  • 通过npm（Node.js包管理器） npm install -g typescript
  • 安装Visual Studio的TypeScript插件
  • 将ts解析成js，浏览器在执行js文件

  2.基本语法

  // 声明一个变量a 并且a的数据类型为number
   let a : number ;
   // 所以对a的值赋为字符串就会出现报错
   // a = "hello"
   a = 10;
  
   let b : string ;
   b = "hello"
   b = 3
  
   // 可以看到我们这里的let会编译成var，在这里我们编译后的js是ES3的版本
  
   // 声明变量直接赋值
   let c : boolean = true
  
   // 变量的声明和赋值时同时进行，会自动对变量进行制定数据类型
   let d = true;
   d = "123"
  
   // js不考虑参数的数据类型和个数
   function sum(a,b){
           return a+b
   }
  
   console.log(sum(41,"41"))
  
   // 其中这里的类型也可以进行给到参数，返回值
   function sum1(a:number,b:number){
           return a+b
   }
  
   console.log(sum1(41,"”47"))
   // 并且对参数的个数进行限制
   console.log(sum1(41,41,100))
  
   // 返回值指定类型
   function sum2(a:number,b:number):number{
           return a+"hello"
   }
   console.log(sum2(1,2))