TypeScript 之 介绍和入门

TypeScript简介


它是由微软开发的自由和开源的编程语言, 属于静态编程语言,在编写的时候会直接检测错误。

它是JavaScript的超集, TypeScript需要通过编译器将其编译生成为JavaScript文件才能运行,因此该语言的运行要比JavaScript慢。

注意: TypeScript并不是直接在浏览器上运行的,它需要一个编译器来编译和生成JavaScript文件,编译出来的JavaScript文件 可以在任何浏览器中执行。

TypeScript的优点如下:

  • 强类型系统,可以在开发阶段发现潜在的类型错误,提高代码质量

  • 支持静态类型、模块、泛型、可选参数、面向对象和异步编程等

  • 支持最新的JavaScript特性,支持ECMAScript 6标准

TypeScript的缺点如下:

  • 必须有编译器将其转换为JavaScript才能运行,因此编译代码较长
  • 使用第三方库,必须使用定义文件,且不能保证所有的第三方库都有可用的

安装

使用TypeScript需要有 npm工具的支持, 安装时候运行命令:

npm install -g typescript

如果提示类似错误:

npm ERR! Error: EACCES: permission denied, mkdir ‘/usr/local/lib/node_modules/typescript’

该问题是因为权限不足的原因导致,可以输入如下命令:

sudo npm install i -g typescript

它会提示输入密码相关,稍等片刻,安装成功后,可通过tsc检测命令是否成功

tsc -v 

常用的TSC命令:

  • .ts文件转换为.js文件。比如某目录创建任意.ts文件,通过终端进入该目录,输入命令:
tsc test_1.ts
  • 将多个.ts文件合并为一个.js文件,可以输入命令:
tsc --outFile common.js file_1.ts file_2.ts file_3.ts

如果没有指定输出文件名,会默认将 file_2.tsfile_3.ts 合并到 file_1.ts 中,该文件会包含javaScript的代码

更多的命令:

命令描述
–help显示帮助信息
–module载入扩展模块
–target设置 ECMA 版本
–declaration额外生成一个 .d.ts 扩展名的文件
–removeComments删除文件的注释
–module noImplicitAny在表达式和声明上有隐含的 any 类型时报错
–watch在监视模式下运行编译器。会监视输出文件,在它们改变时重新编译

JavaScript 简介


JavaScript是我们所了解的语言名称, 但正式名称叫做ECMAScript

在1996年11月, JavaScript的创造者网景公司将JavaScript提交给国际化组织 ECMA(欧洲计算机制造联合会), 希望这种语言能够成为国际标准。

随后 ECMA 发布了规定浏览器脚本语言的标准, 即ECMAScript。 它的历史版本:

version时间描述
1.01997诞生,制定了语言的基本语法
2.01998较小改动,同步独立的ISO国际标准
3.01999引入正则,异常处理,格式化输出等。在业界得到了广泛的支持, 奠定了JS的基本语法
4.02000过于激进,未发布
5.02009引入严格模式,Json,扩展对象,数组,原型,字符串,日期方法
6.02015模块,面向对象语法,Promise,箭头函数,let,const,数组解构赋值等
7.02016幂运算符,数组扩展,Async/await关键字
8.02017Async/await,字符串扩展
9.02018对象解构赋值,正则扩展
102019扩展对象,数组方法

注: 命名有时候会根据版本号或时间,比如: ECMAScript 6.0 和 ECMAScript 2015 是一个意思, 简称都是ES6。这个是目前使用和支持最广泛的语言版本。


ES6


目前市面上推荐使用的是ECMAScript 6.0(ES6), 主要原因在于:

  • 兼容性 目前并非所有的浏览器相关都支持最新语言的特性,而ES6已经被广泛支持
  • 新特性 ES6引入了箭头函数,解构赋值,类等,使得代码更加简洁、易读和维护
  • 模块化支持 可以提升代码的复用性和可维护性,使得项目结构更清晰
  • 异步编程 引入Promiseasync特性, 支持异步编程

简要的说:ES6的推广主要还是为了解决ES5的不足,目前浏览器的JavaScript虽是ES5版本,但大多数的高版本浏览器支持ES6。

新特性主要有:

  • 增加letconst, 可用于块作用域声明变量,避免了var变量提升和作用域不明的问题
  • 新增的原始数据类型Symbol, 可用于定义对象的唯一属性
  • 增加了解构赋值的语法, 算是对赋值运算符的扩展,使得代码更加简洁和易于理解
  • 拓展了Number,支持二/八进制表示,增加了isFinite,整合了parseInt方法到Number对象中
  • 拓展了String,新增了子字符串的识别, 模版字符串的拼接等
  • 拓展了Array, 增加了对象转换为数组,以及查找的方法相关
  • 拓展了函数的默认参数设置, 箭头函数等
  • 新增Map容器和Set对象的使用
  • 新增ProxyReflect
  • 引入class类的支持, 支持extends继承, super访问父类规范, 静态方法等
  • 引入模块, 主要分为export导出import导入
  • 引入 Generator , Promise和 async 等异步编程

因内容较多,针对于TypeScript的入门及ES6特性相关主要有:

TypeScript 之 基础类型及关键字

TypeScript 之 运算符

TypeScript 之 Number

TypeScript 之 String

TypeScript 之 Array

TypeScript 之 Map

TypeScript 之 interface和class

TypeScript 之 异步编程

TypeScript 之 Date日期

TypeScript 之 console

祝大家学习愉快,生活开心。

  • 9
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

鹤九日

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值