TypeScript在学习（0）_typsscript-优快云博客

本文链接：https://blog.youkuaiyun.com/xvzhengyang/article/details/136918517

1.什么是TypeScript?

答:TypeScript 是一种由微软开发的自由和开源的编程语言。它是 JavaScript 的一个超集，而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。

个人浅见，我一直把ts简单理解成，其实就是javascript上多了的类型限制；

2.优势和缺点

答：优点可以简单概括为一下几个方面；

1.增强代码的可维护性

2.友好地在编辑器里提示错误，编译阶段就能检查类型发现大部分错误

3.支持最新的JavaScript新特特性

4.周边生态繁荣，vue3已全面支持 typescript

缺点：

1.需要一定的学习成本

2.和一些插件库的兼容并不是特别完美，如以前在 vue2 项目里使用 typescript就并不是那么顺畅

3.增加前期开发成本,毕竟你要多写代码(但是便于后期维护)

3.如何安装TypsScript

npm install -g typescript // 全局安装 ts

安装成功后，可以执行tsc -v查看版本

执行tsc --lint 指令，可以看到生成了一个tsconfig.json的文件，里面有些配置信息

{
  "compilerOptions": {
    // 指定目标 ECMAScript 版本，如 "es5", "es6"（等同于 "es2015"）, "esnext"
    "target": "es5",
    // 指定模块系统，例如 "commonjs", "amd", "esnext", "umd" 等
    "module": "es6", // 或commonjs等根据需要选择模块系统
    //生成 source map 文件以方便调试
    "sourceMap": true,
    // 输出目录，编译后的 JavaScript 文件存放位置
    "outDir": "./dist",
    // 基本 URL，用于解析非相对模块名称
    "baseUrl": "./src",
    // 控制 JSX 的处理方式，如 "preserve", "react", "react-native"
    "jsx": "preserve",
    // 启用实验性的 ES 装饰器支持
    "experimentalDecorators": true,
    // 允许使用 import 的默认导出与 CommonJS 的 require() 结合
    "esModuleInterop": true
  },
  // 包含哪些文件或 glob 模式匹配的文件需要被编译
  "include": ["src/**/*.ts"],
  //  排除不需要被编译的文件或 glob 模式匹配的文件
  "exclude": ["node_modules"],
  "noImplicitAny": true,
  "strictNullChecks": true
}

接着，我们可以创建一个.ts的文件，写点东西，例如