Typescript
-
为什么我们要学习它?
- js安全度低,但是ts可以弥补,我们才可以去做大型项目
- vue2.x js
- vue3.x vue + ts
- react
- react + ts
-
如何来启动我们的笔记
- 安装插件: cnpm i http-server -g
- 找到对应的目录 资源
- 启动项目: http-server
- 将连接复制到浏览器打开既可以
-
ts是什么的解释
- ts具有类型系统,是js的超集
- js也是有数据类型
- 基本数据类型: number/string/boolean/null/undefined
- 引用数据类型: object
- ts它是类型系统
- 基本数据类型: number/string/boolean/null/undefined
- 内置对象类型: Image Array HtmlElement …
- 自定义类型
- interface/type
- 泛型
- 枚举
- 元组
- 高级数据类型: Partial 等
- js也是有数据类型
- ts可以编译成普通的js代码
- ts是不能直接在浏览器中使用,得将ts转成js之后在使用
- TypeScript支持任意浏览器,任意环境,任意系统并且是开源的。
- ts具有类型系统,是js的超集
-
ts使用的准备工作
-
需要一个工具来将ts编译成js: typescript
-
终端安装: cnpm i typescript -g
-
检验是否安装成功: tsc -h
- 如果有正常的输出,则安装成功
- 如果失败了,请重复: cnpm i typescript -g
-
使用tsc来将ts文件编译成js文件
-
找到app目录
-
终端执行一下命令: tsc --init
- 我们会得到一个 tsconfig.json
-
修改tsconfig.json中两个代码即可
- 将下面的代码进行修改
// outDir: './' // rootDir: './' 将注释还原,并修改成下面的代码 outDir: './dist', rootDir: './src'
-
运行下面的命令,可以将src下的所有ts文件编译成js文件
- tsc
-
-
-
带着大家来学习ts
- ts中写啥
- js 但是得给类型
- ts可以使用先进的es
- ts预先报错的能力
- 编写代码时就可以得到报错信息
- ts中写啥
-
ts的类型系统
- 基本数据类型
- 引用数据类型
- 内置对象类型
- 泛型
- 枚举
- 元组
- 高级数据类型
- 自定义数据类型
- interface/type 来实现
-
type vs interface 区别【面试】
- 相同点-> 都可以描述一个对象或者函数
- -> 都允许拓展(extends)
- —>> interface extends interface (接口继承接口)
- —>> type extends type (类型继承类型)
- —>> interface extends type (接口继承类型)
- —>> // type extends interface (类型继承接口)
- 不同点-> type 可以而 interface 不行
- -----> type 可以声明基本类型别名,联合类型,元组等类型
- -> interface 可以而 type 不行
- -----> interface 能够声明合并
- 工作中:
- 用interface来写即可