TypeScript的知识梳理

1、为什么使用typescript?

1)LSP Language Server Protocol语言服务器协议,编译时提前暴露错误

2)统一代码规范,风格和质量

3)解决业务工单问题,研发联调问题(前后端联调参数问题明确)

2、typescript

1)TS是编译时强类型的静态语言,编译时任何错误在编译时发现,不像js在运行时候确定

2)浏览器和nodejs并不能直接识别TS代码,需要编译成js代码

3)静态类型:类型是在编写代码的时候指定的,不是在js中在运行时确定的

4)强类型:有严格的类型检查,并且有类型标注

3、类型标注

1)注意首字母小写

TypeScript 复制代码
let v1:number = 1;
let v2:string = 'hello';
let v3:boolean = true;
let v4:null = null;
let v5:undefined = undefined;

4、类型推断

TypeScript 复制代码
let v5 = 10;
v5 = 'hello'; // TS里面这样写会提示异常

// 如果希望像js一样,赋值任意类型,可以使用any标注
let v6: any = 123;
v6 = 'hello';

如果进行类型推断,直接给变量赋值null或者undefined,默认类型是any

typescript环境的安装:

1、假设当前的执行环境是dom

2、如果代码中没有使用模块化语句(import/export),默认该代码是全局执行

3、编译的目标代码是ES3

修改以上假设的方式:

1、使用tsc命令行的时候,加上选项参数

2、在tsconfig.json中设置编译选项

TS里面配置文件

1、项目里面创建tsconfig.json

2、tsc --init命令行会在当前目录下创建tsconfig.json文件

compileOptions选项:编译选项

1、target:编译目标版本,默认是ES3,可以修改的(es2016)

2、module:模块化方案,默认是none,可以修改的(commonjs/es6)

3、lib:编译时引入的库文件,默认是dom和es5,可以修改的(es2016)

4、types:编译时引入的类型声明文件,默认是node,可以修改的(@types/node/@types/jquery)

5、outDir:编译输出目录,默认是当前目录,可以修改的(dist)

include和exclude选项:包含和排除文件

1、include:包含文件,默认是当前目录下的所有ts文件,可以修改的(src/**/*)

2、exclude:排除文件,默认是node_modules和bower_components,可以修改的(dist/**)

files选项:指定要编译的文件,默认是当前目录下的所有ts文件,可以修改的(src/index.ts)

@types:是第三方库的类型声明文件,安装之后就可以在ts文件中使用该库了

@types/node:是node环境的类型声明文件,安装之后就可以在ts文件中使用node环境的全局变量了

添加配置文件之后,tsc命令后面就不可以跟文件名了,有的话也会忽略掉

第三方库:

ts-node:将ts代码在内存中完成编译,同时完成运行(npm i -g ts-node)ts-node src/index.ts

nodemon:监视文件变化,自动重启(npm i -g nodemon)nodemon --exec "ts-node src/index.ts"

相关推荐
lpfasd1237 小时前
node-sass 停止维护!老项目迁移 Dart Sass 完整教程
前端·rust·sass
Data analyse45610 小时前
rnweb 回放数据量太大怎么办?分片存储与断点续传的实现思路
前端·网络·算法·数据分析
xiaogai_gai10 小时前
金蝶收料通知单查询策略实战教程:从源系统拉取到中间层落地的完整路径
java·前端·数据库
环境栈笔记11 小时前
指纹浏览器 WebRTC 怎么设置?从 ICE 候选、代理出口到功能验证
前端·人工智能·后端·自动化
赵大仁11 小时前
官网性能优化实战:LCP 3.2s → 2.1s、CLS 0.107 → 0,以及被我推翻的 6 个判断
前端·性能优化·cls·lcp·core web vitals
xiancai_xianyu11 小时前
Text2SQL落地生产库前,SQL要过哪三道闸
前端·数据库·sql·sql注入·text2sql·ai agent开发·企业级ai框架
小羊没烦恼!12 小时前
T-SQL查询进阶--理解SQL SERVER中的分区表
服务器·开发语言·前端·javascript·html
史瓦辛格12 小时前
给 DeepSeek Harness 写费用插件:把「这次会话花了多少钱」算准
前端·deepseek
星光不问赶路人12 小时前
Vue 3 + TypeScript 中 enum 的使用实践
前端·vue.js
鸥梨菌Honevid12 小时前
UVM 中 REQ 和 RSP 类型详解:从通信模型到 item_done 与 put_response
java·前端·servlet