【TypeScript】一文带你了解什么是TypeScript

简介: 【TypeScript】一文带你了解什么是TypeScript

JavaScript最大的问题

程序员编写的最常见的错误类型可以描述为类型错误:在预期不同类型的值的地方使用了某种类型的值。这可能是由于简单的拼写错误、无法理解库的 API 表面、对运行时行为的错误假设或其他错误。

使用JavaScript编写代码最突出的问题就是类型检查问题:由于JavaScript弱类型语言,使得大多数使用者只能在代码运行阶段才能发现类型错误问题,这就使得错误不能被及时发现和修复,为之后的开发埋下了隐患。

JavaScript没有表达不同代码单元之间关系的能力。结合 JavaScript 相当奇特的==运行时语义==,语言和程序复杂性之间的这种不匹配使得 JavaScript 开发成为一项难以大规模管理的任务。

TypeScript 的目标是成为 JavaScript 程序的静态类型检查器——换句话说,是一个在代码运行之前运行的工具(静态)并确保程序的类型正确(类型检查),使得我们能够在代码编写阶段就能及时发现类型错误问题。

什么是TypeScript

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

TypeScript 是一种非常受欢迎的 JavaScript 语言扩展。它在现有的 JavaScript 语法之上加入了一层类型层,而这一层即使被删除,也丝毫不会影响运行时的原有表现。许多人认为 TypeScript "只是一个编译器",但更好的理解其实是把 TypeScript 看作两个独立的系统:编译器(即处理语法的部分)和语言工具(即处理与编辑器集成的部分)。

JS , ES , TS 的关系

  • 1995年:JavaScript诞生

    当时的网景公司正凭借其Navigator浏览器成为Web时代开启时最著名的第一代互联网公司。

    由于网景公司希望能在静态HTML页面上添加一些动态效果,于是 Brendan Eich 在两周之内设计出了

JavaScript语言。

之所以起名叫`JavaScript`,是原因是当时`Java`语言非常红火,想要蹭一波热度而已,实际上`JavaScript`除了语法上有点像`Java`,其他部分基本上没啥关系。
  • 1997年:ECMAScript诞生

    因为网景开发了JavaScript,一年后微软又模仿JavaScript开发了JScript,为了让JavaScript成为全球标准,几个公司联合ECMA(European Computer Manufacturers Association)(欧洲计算机制造商协会)组织制定了JavaScript 语言的标准,被称为ECMAScript标准。

  • 2015年:TypeScript诞生

    TypeScriptJavaScript 的超集(最终会被编译成 JavaScript 代码),即包含JavaScript 的所有元素,能运行JavaScript 的代码,并扩展了JavaScript 的语法。相比于JavaScript ,它还增加了静态类型、类、模块、接口和类型注解方面的功能,更易于大项目的开发

    TypeScript 提供最新的和不断发展的 JavaScript 特性,包括那些来自 2015 年的 ECMAScript 和未来的提案中的特性,比如异步功能和 Decorators,以帮助建立健壮的组件。

一句话总结三者关系:ECMAScript是标准语言,JavaScriptECMAScript的实现,TypeScriptJavaScript的超集。

在这里插入图片描述
在这里插入图片描述

为什么使用TypeScript

TypeScript扩展了JavaScript,提供强大的类型检查语法提示功能,结合诸如VS code这类编译器,能够极大的提高开发效率,降低项目后期的维护成本:

在这里插入图片描述

在这里插入图片描述

配置TypeScript环境

在学习TypeScript之前我们需要先全局安装tsc TypeScript 编译器。

npm i -g typescript

自己创建一个项目(文件夹),在项目根目录终端运行:

tsc -init

此时项目根目录下会生成一个配置文件 tsconfig.json ,这里给出我使用的配置:

{
    "compilerOptions": {
    /* TS编译成JS的版本*/
    "target": "es6",
    /* 入口文件:指定源文件中的根文件夹。 */
    "rootDir": "./src",
    /* 编译出口文件:指定输出文件夹。 */
    "outDir": "./dist",
    /* 严格模式     */
    "strict": true,
}
}

项目根目录下创建src文件夹,在这个文件内创建并编写你的ts文件

在项目根目录终端输入tsc --watch就会开始持续监听src目录下的所有ts文件,文件更改时会自动将其编译成js文件到dist目录下

如果想要自己手动编译某一特定ts文件,可以在ts文件所在目录下运行tsc xxx.ts,这时编译后的js文件会放在与该ts文件同级的地方

注意:我们使用 TypeScript的目的就是检验代码并纠错,尽量使自己的代码变得足够规范,所以建议应始终使用 "strict": true

开始学习TypeScript

想要深入去学习TypeScript的同学可以去博主的TypeScript从入门到精通专栏,里面的每一篇文章都是博主呕心沥血,精益求精写出来的优质好文,并且可能会是你看过的最全最细致的TypeScript教程

话不多说,赶快去关注、订阅、收藏、点赞,开始学习吧!

相关文章
|
Java
45.【Java 实现双色球中奖查询系统】
45.【Java 实现双色球中奖查询系统】
578 0
|
Java
最详细 keil5 和 cubeMX安装教程
最详细 keil5 和 cubeMX安装教程
1042 0
|
应用服务中间件 Linux PHP
nginx怎么部署php项目,如何php项目部署到nginx
php项目部署到nginx的方法:首先安装“Nginx”和“php-fpm”;然后将项目复制到“nginx/html”文件下;接着修改配置文件;最后重新载入Nginx并启动“php-fpm”即可。
|
存储 Java 索引
Java 中 ArrayList 和 LinkedList 之间的区别
【8月更文挑战第22天】
361 1
|
运维 监控 安全
提升运维效率的五大策略
本文将通过分析五个关键策略,探讨如何在运维工作中实现效率的提升。这些策略包括自动化工具的应用、持续集成与持续部署(CI/CD)的实践、有效的监控和日志管理、优化的文档和知识共享以及定期的安全审计。每个策略都提供了具体实施建议和预期效果,帮助运维团队在快节奏的技术环境中保持高效运作。
1301 1
|
存储 缓存 Android开发
Android系统分区与升级
Android系统分区与升级
497 4
|
人工智能 C语言
【51单片机】让AI识别电路图,帮你进行编码(以51单片机为例)
【51单片机】让AI识别电路图,帮你进行编码(以51单片机为例)
1301 0
|
网络协议 Serverless 网络安全
阿里云函数计算自定义域名的SSL证书免费全自动申请及部署
阿里云函数计算简化了开发部署,让用户专注业务逻辑,降低了运维复杂性。然而,SSL证书支持需额外付费:免费证书有效期缩短至3个月,1年证书及自动化部署均收费。为节省成本,小微企业和个人开发者可以采用一套全自动、全免费的SSL证书申请、续签和部署方案。该方案包括自动向Let's Encrypt申请证书、使用阿里云OpenAPI更新证书以及在证书到期前提前申请。通过Win-Acme(Windows)实现,详细步骤包括设置win-acme、自动DNS验证和更新函数计算证书。
1842 5
|
SQL 关系型数据库 数据库连接
Python 连接 SQL 数据库 -pyodbc
以下是如何在 Python 中使用 pyodbc 连接到 SQL 数据库的基本步骤和详解
876 0
|
存储 Go 区块链