最新消息: 你生产环境的Composer是怎么样的?
您现在的位置是:群英 > 服务器 > 系统运维 >
TypeScript 教程分享,适合新手的教程
CSDN发表于 2020-09-22 15:55 次浏览
TypeScript已经出来很久,Vue3 beta版也使用了TypeScript进行开发,那么你对TypeScript了解多少,一起来学习一下这个TypeScript入门课程吧。

1.全局安装

  1. npm install -g typescript

2.使用

  1. 将 ts文件 转换为 js文件
    tsc xxx.ts
  2. 将转换好的 js文件进行执行
    node xxx.js

由于这样比较麻烦,我们可以借助 ts-node 来帮我们编译执行

  1. 全局安装 ts-node
    npm install -g ts-node
  2. 直接执行 ts文件
    ts-node xxx.ts

这样相对于直接执行 js文件会久一些,但是比较方便,不用自己去转为 js文件进行执行

3. 静态类型

所谓的静态类型,就是一旦定义了什么类型(比如 string、number),
就不允许你去改变为其他类型。(当然有特殊情况,这个暂不考虑)

一旦定义了什么类型,会继承该类型上的原型方法

4. 类型推断和类型注解

  • 如果 ts 能够自动分析变量类型(类型推断),我们就不需要做什么了
const a = 1;
  • 1
  • 如果 ts 无法分析变量类型,我们就需要使用类型注解
// (num1: number, num2: number): number  类型注解
function getTotal(num1: number, num2: number): number{
  return num1 + num2;
}
let num3 = getTotal(1, 2);

5. 元组

ts 提供了 元组的概念,这个概念是 js 中没有的。 一般只在数据源是 csv 这 种文件的时候,才会使用元组。个人理解,可以把元组看成数组的一个加强版, 他可以更好的控制或者说规范里边的类型

const jiejie: [string, string, number] = ['xiaofang', 'doctor', 20];
  • 1

6. 类的访问类型

  1. public  一般默认的 访问类型
  2. protected  不允许在外部使用,但是继承中的类是能使用
  3. private  只能在当前类使用,不允许去别的地方进行使用,继承也不行

7. tsconfig.json

  1. 自动生成一个 tsconfig.json文件  tsc -init
  2. 记录一下几个比较实用的配置项,
{
  "compilerOptions": {
    "module": "commonjs",
    "target": "es5",
    "sourceMap": true, // 让源文件跟生成的文件有对应关系,利于以后排错
    // "noImplicitAny": true, // 为true时,强类型检查;为 false 时,如果编译器无法根据变量的使用来判断类型时,将用 any 类型代替
    "removeComments": true, // 去除注释
    "strictNullChecks": true, // 不允许有 null值出现
    "strict": true, // 启动严格模式
    "rootDir": "./src", // 入口文件夹
    "outDir": "./bulid", // 编译出来后,放入的文件夹
    "noUnusedLocals": true, // 若有未使用的局部变量则抛错
    "noUnusedParameters": true // 若有未使用的参数则抛错。
  },
//  "exclude": [ // 除了下面的文件外。其他都要编译
//    "node_modules"
//  ],
  "include": [ // 只编译下面这些文件
    "./src/00Hello.ts"
  ]
}

 
  1. 剩下的配置请参考 官方中文配置文档
标签:TypeScript
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
相关信息推荐