typescript知识总结及在react、vue中的应用(上)

简介: typescript知识总结及在react、vue中的应用(上)

1.是什么


是JavaScript的超集,既javascript中有的他都有,甚至还有他没有的。

2.ts的数据类型


就是js+ts自带的类型,这个很重要,务必全部掌握。

image.png

3.类型注解及联合类型


项目中使用最多最频繁,结合上面数据类型使用。

let a : string = 'aaaa' //这就是典型的类型注解 :形式

image.png

4.函数类型和数组类型


函数类型使用的频率很高,100%使用率,务必掌握。

image.png

image.png

image.png

image.png

image.png

5.对象类型


对象类型使用的频率很高,100%使用率,务必掌握。

image.png

image.png

6.接口


项目中使用频繁,也比较方便,可能还会和接口继承组合使用。

简而言之:接口描述对象类型!

image.png

接口继承

image.png

7.元组


使用场景:明确的知道数组里面有几个值

image.png

8.类型推论


这个其实就是js的,不过这个还是有类型保护机制的,这个比较方便

image.png

9.类型断言


当我(程序员)比ts更知道是什么类型时使用

image.png

image.png

10.字面量类型


注意 const 的使用场景以及和联合类型组合使用

image.png

image.png

11.枚举类型


一般用于固定的数据

image.png

image.png

数字枚举

image.png

字符串枚举

image.png

12.any类型


说是不推荐使用,实际真香!

image.png

相关文章
|
2月前
|
前端开发 JavaScript 安全
TypeScript在React Hooks中的应用:提升React开发的类型安全与可维护性
【7月更文挑战第17天】TypeScript在React Hooks中的应用极大地提升了React应用的类型安全性和可维护性。通过为状态、依赖项和自定义Hooks指定明确的类型,开发者可以编写更加健壮、易于理解和维护的代码。随着React和TypeScript的不断发展,结合两者的优势将成为构建现代Web应用的标准做法。
|
4月前
|
JavaScript 前端开发 安全
使用TypeScript增强JavaScript应用的类型安全性
【5月更文挑战第23天】TypeScript是微软开发的JavaScript超集,引入静态类型检查和面向对象特性,提升代码可维护性和可靠性。它在编译阶段捕获类型错误,增强代码可读性,并通过接口、类、泛型和类型断言等工具确保类型安全。使用TypeScript能有效避免复杂项目中的调试难题,尤其适合大型项目。
|
17天前
|
JavaScript 前端开发 安全
[译] 使用 TypeScript 开发 React Hooks
[译] 使用 TypeScript 开发 React Hooks
|
16天前
|
JavaScript 前端开发 安全
【技术革新】Vue.js + TypeScript:如何让前端开发既高效又安心?
【8月更文挑战第30天】在使用Vue.js构建前端应用时,结合TypeScript能显著提升代码质量和开发效率。TypeScript作为JavaScript的超集,通过添加静态类型检查帮助早期发现错误,减少运行时问题。本文通过具体案例展示如何在Vue.js项目中集成TypeScript,并利用其类型系统提升代码质量。首先,使用Vue CLI创建支持TypeScript的新项目,然后构建一个简单的待办事项应用,通过定义接口描述数据结构并在组件中使用类型注解,确保代码符合预期并提供更好的编辑器支持。
35 0
|
1月前
|
JavaScript 安全 前端开发
TypeScript中的枚举类型有哪些应用场景
【8月更文挑战第4天】TypeScript中的枚举类型有哪些应用场景
48 5
|
16天前
|
JavaScript 前端开发 安全
立等可取的 Vue + Typescript 函数式组件实战
立等可取的 Vue + Typescript 函数式组件实战
|
1月前
|
JavaScript 前端开发 安全
TypeScript在项目中应用
【8月更文挑战第4天】TypeScript在项目中应用
23 0
|
2月前
|
JavaScript 开发者 索引
TypeScript接口与类型别名:深入解析与应用实践
【7月更文挑战第10天】TypeScript的接口和类型别名是定义类型的关键工具。接口描述对象结构,用于类、对象和函数参数的形状约束,支持可选、只读属性及继承。类型别名则为复杂类型提供新名称,便于重用和简化。接口适合面向对象场景,类型别名在类型重用和复杂类型简化时更有优势。选择时要考虑场景和灵活性。
|
2月前
|
JavaScript 前端开发 IDE
React 项目中有效地使用 TypeScript
React 项目中有效地使用 TypeScript
|
2月前
|
前端开发 JavaScript 开发者
React 和 TypeScript
React 和 TypeScript