速来报名!AICon北京站鸿蒙专场~ 了解详情
写点什么

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

  • 2015-09-28
  • 本文字数:1596 字

    阅读完需:约 5 分钟

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-09-28 19:006795
用户头像

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

关注

评论

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

一叶红船见百年!百度大脑助力南湖红船泛起国人心中红色情怀

百度大脑

YOLOV1解读

re-执着

全网首发!“阿里爸爸”最新出品SpringBoot高级笔记(内部笔记!)

Java spring

Hive学习笔记(一)

五分钟学大数据

hive 7月日更

《持之以恒的从事运动》三

Changing Lin

辞职1000小时后,我走进字节跳动拿了offer

Java 程序员 面试 java编程

mPaaS 月度小报 | CodeDay#6 成都站落幕,下一站北京;上新季:新容器、新官网、新视觉

蚂蚁集团移动开发平台 mPaaS

移动开发 mPaaS

iOS端屏幕录制开发指南

anyRTC开发者

音视频 WebRTC ios开发 屏幕录制

数据安全法下,企业如何平衡数据安全合规与业务性能?

腾讯安全云鼎实验室

数据安全 数据安全法

面试官问的那些Android原理你都懂吗?快来收藏!

欢喜学安卓

android 程序员 面试 移动开发

区块链互操作性:大规模应用的关键

CECBC

模块一作业:微信业务架构图和毕设架构设计

Felix

灵魂拷问:我们该如何写一个适合自己的状态管理库?

尔达Erda

开源 云原生 大前端 API 运维开发

人民网发文:区块链如何跨越未来10年

CECBC

重磅!不容错过的阿里内部微服务速成手册也太赞了(2021版)

Java 程序员 面试 java编程

linux网络编程—7层网络以及5种Linux IO模型以及相应IO基础

Linux服务器开发

后端 网络编程 Linux服务器开发 网络模型 IO模型

DICOM--网关(路由器/适配器)

birdbro

医学影像 DICOM PACS dicom4che DICOMWeb

自制深度学习照片数据集

re-执着

就是它,帮我斩获了8家大厂offer,由于太全被各大厂要求Github连夜下架

Java架构师迁哥

开源即巅峰!阿里首次分享:Java架构师全栈“成长笔记”

Java架构师迁哥

面试官问的那些Android原理你都懂吗?值得一看

欢喜学安卓

android 程序员 面试 移动开发

Java 8 新特性

Bf-Bus

数据准备的能力,决定企业AI研发的边界

百度大脑

人工智能

MySQL连接数管理

Simon

MySQL

CODING 助力推进腾讯游戏国际化进程

CODING DevOps

DevOps 开发工具 腾讯游戏 软件研发

数字货币大趋势,DC EP出征,带老百姓进入新时代!

CECBC

算法面试通关

buchila11

面试

当法律纽带变成“机器红线”,能让自动驾驶汽车更安全吗?

脑极体

RedHat7.2 切换yum源记录

Bruce Xiong

redhat yum源

云计算还有多久能够替代高性能计算?

北鲲云

CDH 安装搭建(二)

大数据技术指南

CDH 7月日更

TypeScript 1.6发布:完全支持React/JSX_JavaScript_张天雷_InfoQ精选文章