直播预约通道开启!2021腾讯数字生态大会邀您共探产业发展新机遇! 了解详情
写点什么

TypeScript 1.6 发布:完全支持 React/JSX

2015 年 9 月 28 日

2012 年,微软推出了一个能够在 Node.js 上运行的开源语言——TypeScript。作为 JavaScript 的超集,TypeScript 在兼容 JavaScript 的同时,额外添加了可选的静态类型和基于类的面向对象编程,并且可用于大规模 JavaScript 应用的开发。TypeScript 一经推出便受到了广泛关注,也逐渐被很多用户所接受。微软公司也听取广大用户的反馈,不断更新 TypeScript。近日,微软再次更新 TypeScript,推出了 1.6 版本。该版本添加了对 React/JSX、类表达式以及很多新功能的支持。

首先,微软的 TypeScript 团队充分听取了来自 React 专家和团队的反馈意见。因此,新版本的 TypeScript 完全支持 React 和 JSX。MSDN 给出了一个 tsx 类型的文档作为示例。该文档中的代码如下所示。

复制代码
class MyClass extends React.Component{
render() { <p>Hello, {this.props.who}</p>; }
props: {
who?: string;
} }
var x = <myclass who="hello"></myclass>;

该例子中 TypeScript 代码和 JSX 语法完美共存,使得 React 开发人员可以方便的使用 TypeScript 语言。这样,用户在使用 VS、VS Code 或者 Sublime 的时候,就可以进行 React 和 JSX 的开发。

此外,新版本 TypeScript 添加了对类表达式的支持。如下例所示,该特性使得开发人员可以在使用表达式的时候再根据需求进行类的定义。

复制代码
class StateHandler extends class { reset() { return true; } } {
constructor() {
super();
}
}
var g = new StateHandler();
g.reset();

在之前的版本中,开发人员可以使用 if 语句来缩小变量的类型。新版本的 TypeScript 考虑到广大用户的需求,直接增加了用户自定义守护函数的支持。

复制代码
interface Animal {name: string; }
interface Cat extends Animal { meow(); }
function isCat(a: Animal): a is Cat {
return a.name === 'kitty';
}
var x: Animal;
if(isCat(x)) {
x.meow(); // OK, x is Cat in this block
}

守护函数采用“a is X”作为标志,根据用户定义来返回布尔值或其他值。该特性不仅允许typeofinstanceof检查,而且允许接口和定制化的分析。

为了更好的支持不同类型之间的混合以及扩展现有的类,TypeScript 1.6 版本还添加了新的类型操作符‘&’。该操作符最大的亮点在于对泛型的支持。

复制代码
function extend<t u="">(first: T, second: U): T & U {
let result = <t u=""> {};
for (let id in first) {
result[id] = first[id];
}
for (let id in second) {
if (!result.hasOwnProperty(id)) {
result[id] = second[id];
}
}
return result;
}
var x = extend({ a: "hello" }, { b: 42 });
x.a; // works
x.b; // works </t></t>

之前,很多用户已经希望 TypeScript 能够支持抽象类。现在,新的版本终于添加了对抽象类的支持。

复制代码
abstract class A {
foo(): number { return this.bar(); }
abstract bar(): number;
}
var a = new A(); // error, Cannot create an instance of the abstract class 'A'
class B extends A {
bar() { return 1; }
}
var b = new b(); // success, all abstracts are defined

类别名也是之前版本的 TypeScript 已经支持的功能。但是,之前的类别名被严格限制了使用范围——只能用于确定的类。新版本 TypeScript 扩展了该功能,开始支持了泛型别名。

复制代码
type switcharoo<t u=""> = (u: U, t:T)=>T;
var f: switcharoo<number string="">;
f("bob", 4);</number></t>

最后,1.6 版本的 TypeScript 还在 object literal 以及模块解析方面进行了改进。目前,用户已经可以通过官方网站下载用于 Visual Studio 2015 、Visual Studio 2013 的安装文件。而且,用户也可以通过 npm 或者 GitHub 进行下载。


感谢徐川对本文的审校。

给InfoQ 中文站投稿或者参与内容翻译工作,请邮件至 editors@cn.infoq.com 。也欢迎大家通过新浪微博( @InfoQ @丁晓昀),微信(微信号: InfoQChina )关注我们,并与我们的编辑和其他读者朋友交流(欢迎加入 InfoQ 读者交流群InfoQ 好读者)。

2015 年 9 月 28 日 19:006264
用户头像

发布了 268 篇内容, 共 103.2 次阅读, 收获喜欢 19 次。

关注

评论

发布
暂无评论
发现更多内容

WebSphere Application Server运维实践 --从入门到监控

hafe

Java WAS perfservlet visualVM JMX

uni-app黑魔法:小程序自定义组件运行到H5平台

崔红保

小程序 uni-app

对话 CTO〡和 PingCAP CTO 黄东旭聊开源数据库新蓝海

ONES 王颖奇

数据库 分布式 开发者

2020了,各家小程序发展的怎么样?

崔红保

小程序 uni-app

近两年影响我的两个重要原则

Selina

走出舒适区最好办法别走了,扩大它

乐少

一文讲清楚 MySQL 事务隔离级别和实现原理,开发人员必备知识点

古时的风筝

MySQL 数据库 事务隔离级别 mysql事务 数据库事务

翻译: Effective Go (1)

申屠鹏会

go golang 翻译

电子书:《Linux Perf Master》

RiboseYim

Linux 性能优化

业务代码必须要做的事情

Objectivezt

【Vue3.0 Beta】尝鲜

学习委员

CSS Java html5 Vue 前端

Flink初体验

数据社

大数据 flink 流计算

人们喜欢彼此制造困难让大家难过

Fenng

业务系统开发程序员常用linux知识

Objectivezt

Linux

从流程、认知上做稳定的系统演进

Skysper

系统设计 质量管理

测试

Chonge

【gRPC】Python调用Java的gRPC服务

遇见

Java Python gRPC

写一个开源的 macOS 程序可以赚多少钱?

子骅 luin

node.js redis GitHub 开源 赚钱

Linux 性能诊断:负载评估入门

RiboseYim

Linux 性能优化

OKR实践中的痛点(1):老板的KR我的O,怎么办?

大叔杨

OKR Scrum 敏捷

一个创业者的途中思考

非著名程序员

创业 读书笔记 程序员 重新理解创业 思考

毕竟,一生很短,少有圆满

霍太稳@极客邦科技

创业 身心健康 个人成长

为什么你的创业公司应该运行在Kubernetes上

云原生

云原生 k8s

寻找伴侣最重要的是什么?

二爷

分享多年积累的 macOS 效率工具

张晓辉

macos

【数据结构】双向链表插入操作的时间复杂度分析

遇见

数据结构 算法 时间复杂度

此为开卷

范学雷

初入响应式编程(上)

CD826

spring 微服务 Spring Cloud 响应式编程 reactor

用声音在一起,听荔枝CTO丁宁聊UGC声音互动平台的技术世界

ONES 王颖奇

内容 企业架构 互联网

芋道 Spring Cloud Alibaba 介绍

艿艿

阿里巴巴 分布式 微服务 Spring Cloud Spring Boot

浅谈汽车行业嵌入式软件发布的流程有多复杂

WB

程序员 软件

技术为帆,纵横四海- Lazada技术东南亚探索和成长之旅

技术为帆,纵横四海- Lazada技术东南亚探索和成长之旅

TypeScript 1.6发布:完全支持React/JSX-InfoQ