【TypeScript】TS安装与使用

news2025/7/19 5:01:03

目录

初识TypeScript

TypeScript给JS添加类型支持的原因

TypeScript相比JS的优势

TS工具包的安装

TS文件的编译和运行

简化TS的运行步骤


初识TypeScript

TypeScript(简称:TS)是JavaScript的超集(JS有的TS都有)。

TypeScript = Type + JavaScript(在JS的基础上,为JS添加了类型支持)。

TypeScript是微软开发的开源编程语言,可以在任何运行JavaScript的地方运行。

TypeScript给JS添加类型支持的原因

背景:JS的类型系统存在 ” 先天缺陷 “ ,JS代码中绝大部分错误都是类型错误(Uncaught TypeError)。

问题:增加了找bug,改bug的时间,严重影响开发效率。

从编程语言的动静来区分:TypeScript属于静态类型编译期做类型检查)的编程语言,JS属于动态类型执行期做类型检查)的编程语言,而代码的编译和执行顺序是先编辑后执行,这就导致以下情况:

对于JS:需要等到代码真正去执行的时候才能发现错误(晚)。

对于TS:在代码编译的时候(代码执行前)就可以发现错误(早)。

配合VScode等开发工具,TS可以提前到在编写代码的同时就可以发现代码中的错误,减少找bug和改bug的时间。

TypeScript相比JS的优势

1)更早(写代码的同时)发现错误,减少找bug改bug时间,提升开发效率。

2)程序中任何位置的代码都有代码提示,享受随时随地的安全感,增强了开发体验。

3)强大的类型系统提升了代码的可维护性,使得重构代码更加容易

4)支持最新的ES语法,优先体验最新的语法,走在前端技术的前沿。

5)TS类型推断机制不需要在代码中的每个地方都显示标注类型,降低了成本。

TypeScript已经成为大中型前端项目的首选编程语言,例如:Vue3源码使用TS重写、Angular默认支持TS、React与TS能完美配合。

TS工具包的安装

因为在Node.js/浏览器当中,它们只认识JS代码不认识TS代码,因此我们要先将TS代码转换为JS代码,然后才能运行,所以我们需要安装typescript包用来编译TS代码包,实现 TS -> JS 的转化。

注意:要想使用TS首先你得有node环境,没有环境的先去百度一下搭建一下node环境。

win+R 输入 cmd 在终端安装如下命令(进行全局安装):

npm install -g typescript

验证是否安装成功:tsc -v(查看 typescript 的版本):

TS文件的编译和运行

1)创建 test.ts 文件(注意:TS的文件的后缀名为.ts)。

2)将TS编译为JS:在终端输入命令:tsc test.ts(此时在同级目录中会出现一个同名的JS文件)。

3)执行JS代码:在终端中输入命令,node test.js。

这里的报错提示:无法重新声明块范围变量“age”。是因为我们在打开TS文件的同时又打开了JS文件,关闭JS文件报错消失。

注意:所有合法的JS代码都是TS代码,由TS编译生成的JS文件,代码中就没有类型信息了。

简化TS的运行步骤

根据上文的编译运行步骤我们发现每次修改代码后,都要重复执行两个命令才能执行TS代码,十分繁琐。TS官方给我们提供了 ts-node 包,能够让我们 “直接( ts-node命令在内部偷偷的将TS - >JS,然后在运行JS代码)” 在Node.js中执行TS代码。

ts-node包安装:

npm install -g ts-node

使用方式:ts-node TS文件

注意:简写 node TS文件 ,是可以执行的,前提是TS文件中没有任何的TS独有的内容,说白了就是一个JS文件,如下图所示 node test.ts 是会报错的,因为有了TS独有的类型支持,删掉 冒号+number 就可以执行 node test.ts 了,这里了解一下。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/109330.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Python编程 制作一个超级浪漫的新年倒计时(附源代码)

作者简介:一名在校计算机学生、每天分享Python的学习经验、和学习笔记。 座右铭:低头赶路,敬事如仪 个人主页:网络豆的主页​​​​​​ 目录 前言 一.新年介绍 二.代码介绍 1.应用的技术 (1)Pyga…

Java项目:springboot电影推荐网站

作者主页:源码空间站2022 简介:Java领域优质创作者、Java项目、学习资料、技术互助 文末获取源码 项目介绍 springboot电影推荐网站。本系统采用企业级开发标准,使用SpringBoot架构,数据访问层采用Spring Data Jpa,业…

工具(二):Nginx 扩展 OpenResty

OpenResty 介绍OpenResty 原理Nginx 模块Nginx的 lua插载点案例 配置模板nginx.conf通过Lua找到静态文件 — 商品页通过Lua 获取 redis 只返回 — 库存test 其他Demo MysqlOps.luaRedisExtOps.luaredisOps.lua 辅助工具类说明 自动生成静态页FTP 工具 Nginx_有5大优点&#x…

职场经验:游戏测试的主要工作及主要流程

01 游戏测试主要内容 1、功能测试 功能测试是游戏测试中最常见的模式,主要测试方法为黑盒测试 功能测试主要用来验证功能是否符合需求设计 功能测试主要考虑正确性,而不考虑游戏底层结构及代码错误 功能测试通常从界面着手开始测试,尽量…

【架构师(第五十一篇)】 服务端开发之技术方案设计

接口设计 把 server 端当做一个黑盒,它将如何与前端通讯? 功能范围 B 端,用户注册,作品管理,模板管理编辑器,单个作品的内容获取,修改,预览和发布 功能拆分 用户信息相关作品管…

线上牛奶配送

开发工具(eclipse/idea/vscode等): 数据库(sqlite/mysql/sqlserver等): 功能模块(请用文字描述,至少200字): 基于Java的线上牛奶配送系统的设计与实现 风网站前台:网站介绍、联系我们、公告信息、套餐类型、牛奶套餐、…

Linux-4 文件管理

Linux-4 文件管理 文件管理概述 谈到Linux文件管理,首先我们需要了解的是,我们要对文件做些什么事?其实无非就是对一个文件进行创建,复制,移动,查看,编辑,压缩,查找&am…

自己个人拥有一个可以支付功能的网站?当然可以了!保姆级演示!

文章目录前提条件演示应用申请开通和配置应用创建应用配置代码开发后端实例前端代码实例源码前提条件 这是必要条件!!! 这是必要条件!!! 这是必要条件!!! 开通当面付&am…

人脸检测和对齐算法MTCNN

1. 概述 人脸识别在实际的生活中有着广泛的应用,得益于深度学习的发展,使得人脸识别的准确率得到大幅度提升。然而,为了做好人脸识别,第一步需要做的是对人脸检测,主要是通过对图片分析,定位出图片中的人脸…

Java项目:springboot网上点餐系统

作者主页:源码空间站2022 简介:Java领域优质创作者、Java项目、学习资料、技术互助 文末获取源码 功能介绍 SpringBoot在线订餐系统项目。主要功能说明: 分为两个角色,餐厅老板、普通用户 餐厅老板可以登录,注册&…

质量不错的蓝牙耳机有哪些?2023年值得选购的四款蓝牙耳机

现如今,蓝牙耳机越多人使用,不同于有线耳机,蓝牙耳机更为方便,没有线束的困扰,走到哪也不用带上手机一起,特别便利。然而,随着蓝牙耳机市场的旷大,各种类型各种样式的耳机五花八门&a…

C++ 实现并查集结构

前言 并查集一般用于多元素,多集合的查找问题; 听说很有用,但是平时好像确实没有怎么见过。。 leetcode典型例题:岛屿数量 一、原理 其实并查集的每个小集合就是一张有向图,只不过是所有子节点指向父节点的图结构。…

认证鉴权对于 API 网关的重要性

认证鉴权作为 API 网关不可或缺的能力,已然成为用户在选型 API 网关时考量的重要因素之一。 作者钱勇,API7.ai 开发工程师,Apache APISIX Committer 在当下云原生越发成熟的环境下,API 网关最核心的功能可以概括为:连接…

高品质蓝牙耳机排行榜,值得入手的四款蓝牙耳机分享

2023年即将到来,还有哪些蓝牙耳机值得大家购买呢?蓝牙耳机在我们日常生活中发挥着很大作用。无论是听歌还是通话,又或者是运动健身、玩游戏等,都常见大家使用。同样也伴随着蓝牙耳机市场的壮大,五花八门的耳机层出不穷…

【C语言进阶】进来抄作业,完善你的通讯录(软工期末大作业可用)

目录 🥰前言🥰: 一、输入合法性检测🤠: ①.对“ 联系方式 ”的合法性检测: ②.对“年龄”进行合法性检测: 二、字典排序🤑: 三、反馈优化🤯: …

Python 圣诞树代码

一、前言 1.本章将会讲解Python编程 实现圣诞树效果! 2.圣诞节介绍 基督教纪念耶稣诞生的重要节日。亦称耶稣圣诞节、主降生节,天主教亦称耶稣圣诞瞻礼。耶稣诞生的日期,《圣经》并无记载。公元336年罗马教会开始在12月25日过此节。12月25日…

现在转行计算机如49年入国军?

阿里,腾讯等互联网大厂最近不太安宁,裁员消息频出,无风不起浪,裁员年年有,今年特别多。于是不少打算入行或者已经入行计算机的同学开始担忧,如今入行计算机,怎么有点49年入国军的赶脚&#xff1…

Android面试题及答案整理(2023最新版)持续更新中......

倒霉的时候总会想起福祸相依,但你会发现倒霉起来没完没了,就是看不到传说中的“福” 年初被裁了,我会安慰自己,此处不留爷自有留爷处,然后踏入找工作的行列;没有面试邀请,我会告诉自己&#xf…

倒在转“码”路上的文科生,文科生也能转行做IT吗?

近期,一篇《倒在转“码”路上的文科生》火了。 这也让关于“文科转码”的话题引起了一番热度,由于大环境不佳,使得毕业生就业成为了一个难度,其中文科生相较而言,选择更少,因此,让不少学子有了…

Java项目:springboot酒店宾馆管理系统

作者主页:源码空间站2022 简介:Java领域优质创作者、Java项目、学习资料、技术互助 文末获取源码 功能介绍 springboot酒店宾馆管理系统。该系统为后管系统,无前台。主要分三种角色:管理者/工作人员/前台人员。 主要功能有&…