为什么选择TypeScript?TypeScript是什么?


前言

TS到底是什么?官方定义来了TypeScript is a typed superset of JavaScript that compiles to plain JavaScript. Any browser. Any host. Any OS. Open source.
翻译过来:TypeScript 是 JavaScript的一个超集,可以编译为纯JavaScript,在任何浏览器、集群(服务器)、操作系统上面都可以运行,而且还开源。


提示:以下是本篇文章正文内容,下面案例可供参考

一、为什么选择TypeScript?

JS由Netscape率先推出,现在主要由各大浏览器厂商实现。
而TS TypeScript is a trademark of Microsoft Corporation,目前由微软进行设计和维护。
前端:开发用 VScode;包管理用npm;代码用TS;社区用GitHub。一家人就要整整齐齐(浏览器就算了)。
我们可以将 TS 看作是 JS 之上的一个外壳,拥有类型的JS;
看到这里不禁有疑惑,它到底做了什么能成为JS超集,既然可编译为JS又是怎么提升大型JS项目可靠性和可维护性的呢?
在这里插入图片描述

TS做了什么
扩展 JS 数据类型
TS中数据类型:
boolean 类型、
number 类型、
string 类型、
Object 类、
function 类、
array 类型、
undefined、
null、
Symbol、
tuple 类型(元组类型)、
enum 类型(枚举类型)、
any 类型(任意类型)、
void 类型(没有任何类型)、
never 类型(永不存在的值的类型)

二、使用步骤

1.安装和环境搭建

全局安装typescript

npm install -g typescript

项目初始化
新建目录(项目名可自定义):mkdir ts-dev
进入项目文件夹ts-dev: cd ts-dev
生成package.json文件: npm init -y
生成tsconfig.json文件: tsc --init
本地安装ts和ts-node:npm i typescript ts-node

三、接口

在面向对象编程中,接口是一种规范的定义,它定义行为和动作的规范。
TS的核心原则之一是对值所具有的结构进行类型检查。 它有时被称做“鸭式辨型法”或“结构性子类型化”。 在TS里,接口的作用就是为这些类型命名和为你的代码或第三方代码定义契约。
其实在程序设计里面,接口起到一定的限制和规范作用。接口定义对象里的属性和方法所遵守的规范。如果非要形象贴近生活一点的话,那接口就像是充电口,你是什么类型的充电口,就必须要用这个类型的充电器。你定义什么类型的接口,那你必须使用相同类型的数据。
TS的接口增加了更灵活的接口类型,包括属性,函数,索引和类等。TS中的接口不仅可以约束,相同接口还可以合并同”名“项。了解到的和常用

1.属性类接口,对属性值的类型定义;
2.参数约束接口,规定调用方法的传参类型,避免出现数据类型不一致导致JS直接卡死在浏览器的语法错误;
3.参数修饰,可选类型、必选类型和限制接口中的参数是只读类型等;
4.泛型接口,增强了接口的可复用性;
5.函数接口,规定函数参数值类型以及返回值类型,避免出现空返回值导致中止程序的现象; 索引签名,可以添加不确定参数名称的属性;
6.类接口,对类的约束,和抽象类有点像; 接口扩展,如果你声明了两个接口名一样的接口,那么TS会对该接口进行合并操作; 使用 type 别名
可提取自定义联合类型; 接口做闭包,主要是混合类型,当一个函数有自己的属性和方法;

总结

TS 适合大规模 JS 项目(JavaScript that scales)。TS 在团队协作、可维护性、易读性、可靠性(编译期暴露问题)等方面上有着明显的优点:

1.加上了类型系统,对人好,对机器,对维护都很好,增强了代码的双层可读型;对于编译器来说,类型定义可以让编译器揪出隐藏的 bug;
2.类型系统 + 静态分析检查 + 智能感知 提示,书写方便,使大规模的应用代码质量更高。 bug 少,维护方便,就连重构也安心;
3.给应用配置、应用状态、前后端接口及各种模块定义类型,整个应用由类型定义组成,多人协作更为方便、高效和安全。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值