TypeScript:熟练掌握TypeScript(四)

简介: TypeScript:熟练掌握TypeScript(四)

6.43、函数之间的类型兼容性(3-3,返回值)

6.44、交叉类型

6.45、交叉类型和接口之间的对比说明

6.46、泛型的基本使用<T>

TypeScript中泛型<T>详细讲解 - 南风晚来晚相识 - 博客园

6.47、简化泛型函数调用

6.48、泛型约束

6.49、泛型约束(extends添加约束)

6.50、多个泛型变量的情况

6.51、泛型接口

6.52、数组式泛型接口

6.53、泛型类

6.54、泛型工具类型(partial)

6.55、泛型工具类型(readonly)

6.56、泛型工具类型(pick)

6.57、泛型工具类型(record)

6.58、索引签名类型

6.59、映射类型

6.60、映射类型(keyof)

6.61、分析泛型工具类型partial的实现

6.62、索引查询类型(基本使用)

6.63、索引查询类型(同时查多个)

6.64、类型声明文件概述

6.65、TS中的两种文件类型

TS中有两种文件类型:1 .ts文件 2 .d.ts文件

.ts文件:

1、既包含类型信息又可执行代码。

2、可以被编译为.js文件,然后,执行代码。

3、用途:编写程序代码的地方。

.d.ts文件:

1、只包含类型信息的类型声明文件。

2、不会生成.js文件,仅用于提供类型信息。

3、用途:为js提供类型信息。

总结:.ts是implementation(代码实现文件);.d.ts是declaration(类型声明文件)。

如果要为js库提供类型信息,要使用.d.ts文件。

这两个文件在TS项目里边很重要,比如在vue3+TS或者uniapp+vue3+TS项目中遇到类型报错,首先考虑是不是这两个文件的配置问题。

6.66、使用已有的类型声明文件(1,内置类型声明文件)

在使用TS开发项目时,类型声明文件的使用包括一下两种方式:

1、使用已有的类型声明文件

2、创建自己的类型声明文件

学习顺序:先会用(别人的)再会写(自己的)

6.67、使用已有的类型声明文件(2,第三方库的类型声明文件)

第三方库的类型声明文件:目前,几乎所有的常用的第三方库都有响应的类型声明文件。

第三方库的类型声明文件有两种存在形式:1库自带类型声明文件;2由DefinitelyTyped提供。

库自带类型声明文件,比如,axios

解释:

这种情况下,正常导入该库,TS就会自动加载库自己的类型声明文件,以提供该库的类型声明。

6.68、创建自己的类型声明文件(3-1,项目内共享类型)

6.69、创建自己的类型声明文件(3-2,为已有js文件提供类型的声明概述)

6.70、创建自己的类型声明文件(3-3,为已有js文件提供类型的声明)

6.71、TS配置文件tsconfig.json的说明

tsconfig.json是TypeScript编译器的配置文件,它定义了编译器的设置和编译选项。该文件用于指定编译项目的根目录、输出目录、编译选项等设置。

常见的配置选项
序号 配置项 说明
1 compilerOptions 它定义了编译器的设置和编译选项,包括target、module、lib、declaration、outDir、sourceMap等。
2 include 它用于指定需要编译的文件或文件夹的路径。
3 exclude 它用于指定不需要编译的文件或文件夹的路径。
4 files 它用于指定需要编译的文件列表。
5 extends 它允许继承其他tsconfig.json文件的设置。

使用tsconfig.json可以简化编译步骤,提高编译效率,并且使得编译的设置更加统一和可维护。

注意:TS的配置项非常多(100+),使用时一定要认真查看文档。

1、tsconfig.json文件所在目录为项目根目录(与package.json同级)。

2、tsconfig.json可以自动生成,命令:tsc --init。

6.72、通过命令方式使用编译配置

除了在tsconfig.json文件中使用编译配置外,还可以通过命令行来使用。

使用演示:tsc hello.ts --target es6

注意:

1、tsc后带有输入文件时候(比如,tschello.ts),将忽略tsconfig.json文件。

2、tsc后不带输入文件时(比如,tsc),才会启用tsconfig.json

推荐使用:tsconfig.json配置文件

七、过程记录

7.1、ts的(.d.ts)文件

TypeScript的`.d.ts`文件(Declaration File)是用来描述JavaScript库、模块或者其他代码的类型信息的文件。`.d.ts`文件中包含了类型声明、接口、类等的定义,这些定义可以让其他TypeScript代码理解和使用这些JavaScript代码。`.d.ts`文件可以手动编写,也可以使用工具自动生成。

`.d.ts`文件是在类型系统中非常重要的一种文件类型,因为它们允许TypeScript开发者在编写代码时获得类型检查和自动补全的支持,从而提高开发效率和代码质量。

一文读懂TS的(.d.ts)文件 - 简书

八、本文第六章学习内容来自 哔哩哔哩_黑马程序员_TypeScript 感谢UP分享,本文仅用于记录学习过程,如有侵权立即删除。

九、欢迎交流指正,关注我,一起学习。

相关文章
|
JavaScript 前端开发 Java
TypeScript:熟练掌握TypeScript(三)
TypeScript:熟练掌握TypeScript(三)
175 0
|
JavaScript 索引
TypeScript:熟练掌握TypeScript(二)
TypeScript:熟练掌握TypeScript(二)
136 0
|
资源调度 JavaScript 前端开发
TypeScript:熟练掌握TypeScript(一)
TypeScript:熟练掌握TypeScript(一)
108 0
|
13天前
|
存储 安全 JavaScript
TypeScript-内置应用程序类型-Recode
通过使用 `Record` 类型,开发者可以显著提升代码的安全性和可维护性。无论是配置对象、字典结构还是动态表单,`Record` 类型都提供了一个简洁、类型安全的解决方案。
187 82
|
4月前
|
JavaScript 前端开发 安全
深入理解TypeScript:增强JavaScript的类型安全性
【10月更文挑战第8天】深入理解TypeScript:增强JavaScript的类型安全性
82 0
|
4月前
|
JavaScript 前端开发 开发者
深入理解TypeScript:类型系统与实用技巧
【10月更文挑战第8天】深入理解TypeScript:类型系统与实用技巧
|
5月前
|
存储 JavaScript
typeScript进阶(11)_元组类型
本文介绍了TypeScript中的元组(Tuple)类型,它是一种特殊的数组类型,可以存储不同类型的元素。文章通过示例展示了如何声明元组类型以及如何给元组赋值。元组类型在定义时需要指定数组中每一项的类型,且在赋值时必须满足这些类型约束。此外,还探讨了如何给元组类型添加额外的元素,这些元素必须符合元组类型中定义的类型联合。
73 0
|
5月前
|
JavaScript
typeScript进阶(10)_字符串字面量类型
本文介绍了TypeScript中的字符串字面量类型,这种类型用来限制变量只能是某些特定的字符串字面量。通过使用`type`关键字声明,可以确保变量的值限定在预定义的字符串字面量集合中。文章通过示例代码展示了如何声明和使用字符串字面量类型,并说明了它在函数默认参数中的应用。
63 0
|
3月前
|
设计模式 JavaScript 安全
TypeScript性能优化及代码质量提升的重要性、方法与策略,包括合理使用类型注解、减少类型断言、优化模块导入导出、遵循编码规范、加强代码注释等
本文深入探讨了TypeScript性能优化及代码质量提升的重要性、方法与策略,包括合理使用类型注解、减少类型断言、优化模块导入导出、遵循编码规范、加强代码注释等,旨在帮助开发者在保证代码质量的同时,实现高效的性能优化,提升用户体验和项目稳定性。
70 6
|
3月前
|
开发框架 JavaScript 前端开发
TypeScript 是一种静态类型的编程语言,它扩展了 JavaScript,为 Web 开发带来了强大的类型系统、组件化开发支持、与主流框架的无缝集成、大型项目管理能力和提升开发体验等多方面优势
TypeScript 是一种静态类型的编程语言,它扩展了 JavaScript,为 Web 开发带来了强大的类型系统、组件化开发支持、与主流框架的无缝集成、大型项目管理能力和提升开发体验等多方面优势。通过明确的类型定义,TypeScript 能够在编码阶段发现潜在错误,提高代码质量;支持组件的清晰定义与复用,增强代码的可维护性;与 React、Vue 等框架结合,提供更佳的开发体验;适用于大型项目,优化代码结构和性能。随着 Web 技术的发展,TypeScript 的应用前景广阔,将继续引领 Web 开发的新趋势。
64 2