0

0

Flow之一个新的Javascript静态类型检查器_javascript技巧

php中文网

php中文网

发布时间:2016-05-16 15:24:24

|

1504人浏览过

|

来源于php中文网

原创

今天我们兴奋的发布了 flow 的尝鲜版,一个新的javascript静态类型检查器。flow为javascript添加了静态类型检查,以提高开发效率和代码质量。更明确的说,静态类型检查提供的好处像早期错误检查,帮助你发现一些只有在运行时才能发现的错误,以及代码智能感知,它会帮助代码维护,查找,重构和优化。

我们设计Flow的所有功能构建在现有Javascript规范之上。因为Flow主动地在后台工作,所以额外的编译开销很小。Flow并不要求开发者如何编写代码 —— 她用一套复杂的算法分析你熟悉的代码风格。

Flow仍然在初期阶段,但是我们已经在Facebook使用了。我们希望你在自己的项目中愉快的使用,期待你的反馈。可以访问 flowtype.org 快速开始。

总览

Facebook超爱Javascript;它快,表达性好,而且到处运行,是构建产品的极佳语言。同时,因为没有静态类型让开发者困扰。Bug难以发现(比如,崩溃的原因隐藏很深),代码维护犹如噩梦(比如,在不知道所有依赖的情况下进行重构风险很大)。Flow改进了速度和效率促进了开发者在使用Javascript的生成效率。

立即学习Java免费学习笔记(深入)”;

在Javascript之上添加一层静态系统并不简单。Javascript的积木(building block)表现力极高,一个简单的类型系统并不能精确组合出应有的语义。为了支持不同的Javascript编程范式和习惯,Flow引入了类似数据流(data-flow)和控制流(control-flow)这类通常用于编译时提取语义的分析技术。然后用提取的信息,加上先进的类型原理来做类型推断。当然,仅有一个强力的静态类型分析还不够 —— Javascript代码库会很大,这要求类型检查必须闪电般快速,才能不打断开发者编辑-运行的流程。Flow按模块执行分析,所有的类型都限制在模块边界以内。这最终形成一个高度并行、增量式的检查架构,类似 Hack 。这使得类型检查响应快速,即使是百万行级别代码。

Flow的类型检查是选择性的 —— 你不需要一次性执行检查所有。然而,Flow背后的设计基于假定大多数Javascript的代码类型是隐式静态类型;虽然类型可能不会到处在代码中出现,它们是以一种可以按照代码正确性推理出来的形式存在于开发者的思路中。一旦可能,Flow就去推断这些类型,意味着它可以不需要改动代码就能发现类型错误。另一发面,一些如存在于框架中的Javascript代码,大量使用了反射使得静态类型推断非常困难。对于这种天然动态的代码,类型检查就会错漏百出,因此Flow提供对此类代码添加信任并继续。这种设计在Facebook内部被大量的Javascript代码库所验证:大多数代码没有通过隐式静态类型检查条目,这些条目让开发者可以不用添加注释就能检查代码类型错误。

这使得Flow从根本上区别于其他Javascript的类型系统(如TypeScript),通过弱化的假设大多数JavaScript代码是动态输入的,并由开发者自己表达哪些代码应该是静态类型。通常来看,这类设计会导致检查覆盖率降低:更少的类型错误被检测到,工具不够高效。然而对于某些情况下是合理的,一般这种设计如果没有通过大量额外的努力就无法对实际开发提供足够多的帮助。尽管如此,Flow让你可以简单就获得这种弱化的类型检查,对于现有代码非常有用。

为了解释这种区别,请看下面的例子:

function onlyWorksOnNumbers(x) {
 return x * 10;
}
onlyWorksOnNumbers(‘Hello, world!');

Flow能够发现这个错误(尝试把数字和字符串相乘),然而另一种更加保守的分析需要显式的标注 x 的类型。在这个玩具般的例子里面并不觉得费力,但是在巨型代码库里面几乎无人去做。Flow可以不用添加注释就能发现这个错误 —— 当然前提是开发者想这样做。

类型系统

Flow的类型系统实现了许多期望中的功能。支持标准基本类型( number ,  string , boolean ),类型之间的隐式转换在除一些特殊情形外是被禁止的。结构类型,如函数、对象和数组也被支持。类型可以是多态的。

也许你会感到意外,Flow没有把 null 和 undefined 当成是上述类型中的任何一种。这两种类型会有多种可能,使用这些类型必须在合理检查的保护之上。其它组合类型(如 string | number )也被支持,这种用法同样需要确保安全。Flow知道缩小类型范围时做动态检查的影响。

让我们用一个例子来描述处理 null 值。下面的程序总是在运行时崩溃,但是一般的类型系统会认为它没有问题:

function length(x) {
return x.length;
}
var total = length('Hello') + length(null);

Flow会在编译时期发现这个错误,并指出 x 可以是null( length 属性不应该被访问)。另外,Flow了解这个程序的控制流,所以简单修改就能让这个程序类型正确:

function length(x) {
 if (x !== null) {
 return x.length;
 } else {
 return 0;
 }
}
var total = length('Hello') + length(null);

Flow还了解JavaScript复杂的对象模型:构造器,方法,原型和它们动态扩展以及绑定。已经试验性去支持类型的复杂操作如:绑定对象,抽取keys等等。我们希望未来这些功能使得让为框架指定具体类型成为可能。

狸谱App
狸谱App

AI壁纸漫画梗图,年轻人的抽象创作社区

下载

类型错误通常报告为定义和实际值不兼容:比如函数调用的参数不足,对象中不包含要访问的属性,或者把字符串当成数字使用。

最后,Flow支持动态类型( any ),这种类型可以绕过类型系统检查:比如可用 any 表示静态分析无法准确判断而报错的location(通常使用反射的情况)。另外Flow在弱模式下遇到上述类型且没有注释类型的话,会自动假定为 any 。

扩展性

为了拓展,Flow根据模块和其它模块的依赖关系以及其它模块提供的类型接口,单独对每个模块进行检查。要生成类型接口,Flow可能需要在模块边界上进行注释。

Flow在一个后台运行的持久化服务器上,维护着整个代码库的语义信息,一开始Flow会对整个代码做一次分析,然后当一系列文件改动的时候(可能是单个文件改动或者在切换分支的时候),服务器会增量式更新改动文件以及由于类型关联的其它相关文件的语义信息。这样,当开发者试图获取类型错误时,它们已经在服务器上了,相应几乎是立即的。这种服务器架构与 Hack 构建在同一种技术之上。

兼容性

Flow致力于支持最新的JavaScript标准。目前已经支持各种ES6特性如destructuring, classes, extended objects, optional function parameters,以及核心API扩展(比如Map, Set, Promise, 和 new methods on Object, Array, 和 Math)。其它特性(尤其是模块)正在开发中。Flow支持CommonJS / Node.js 规范的模块。

var Hello = React.createClass ({
 render: function() {
 return <div>Hello {this.props.name}</div>;
 }
});

如果你在JSX上使用的class名字有错误,Flow会发现这个问题:

React.render(, ...);

而且,如果你在React class里面使用了React.PropTypes规范,你可以对JSX上的attributes做静态类型检查:

var Hello = React.createClass ({
 propTypes: {
 name: React.PropTypes.string.isRequired
 }
 ...
});

Flow就会发现 缺少属性的错误,或者 属性类型的错误。

更多的关于支持React的细节可以在 文档 中找到。

开源

Flow代码大部分用OCaml实现。代码库在活跃更新并且会在未来几个月快速进化。除了在Facebook范围内的数据代码库中运行外,我们希望Flow的分析引擎能用于构建类似的,无论是JavaScript或者其他的语言工具。请让我们知道你是否想加入!

好了,关于Flow之一个新的Javascript静态类型检查器的全部内容先给大家介绍到这里,后续还会持续更新,敬请关注!

相关文章

java速学教程(入门到精通)
java速学教程(入门到精通)

java怎么学习?java怎么入门?java在哪学?java怎么学才快?不用担心,这里为大家提供了java速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
pixiv网页版官网登录与阅读指南_pixiv官网直达入口与在线访问方法
pixiv网页版官网登录与阅读指南_pixiv官网直达入口与在线访问方法

本专题系统整理pixiv网页版官网入口及登录访问方式,涵盖官网登录页面直达路径、在线阅读入口及快速进入方法说明,帮助用户高效找到pixiv官方网站,实现便捷、安全的网页端浏览与账号登录体验。

797

2026.02.13

微博网页版主页入口与登录指南_官方网页端快速访问方法
微博网页版主页入口与登录指南_官方网页端快速访问方法

本专题系统整理微博网页版官方入口及网页端登录方式,涵盖首页直达地址、账号登录流程与常见访问问题说明,帮助用户快速找到微博官网主页,实现便捷、安全的网页端登录与内容浏览体验。

272

2026.02.13

Flutter跨平台开发与状态管理实战
Flutter跨平台开发与状态管理实战

本专题围绕Flutter框架展开,系统讲解跨平台UI构建原理与状态管理方案。内容涵盖Widget生命周期、路由管理、Provider与Bloc状态管理模式、网络请求封装及性能优化技巧。通过实战项目演示,帮助开发者构建流畅、可维护的跨平台移动应用。

144

2026.02.13

TypeScript工程化开发与Vite构建优化实践
TypeScript工程化开发与Vite构建优化实践

本专题面向前端开发者,深入讲解 TypeScript 类型系统与大型项目结构设计方法,并结合 Vite 构建工具优化前端工程化流程。内容包括模块化设计、类型声明管理、代码分割、热更新原理以及构建性能调优。通过完整项目示例,帮助开发者提升代码可维护性与开发效率。

25

2026.02.13

Redis高可用架构与分布式缓存实战
Redis高可用架构与分布式缓存实战

本专题围绕 Redis 在高并发系统中的应用展开,系统讲解主从复制、哨兵机制、Cluster 集群模式及数据分片原理。内容涵盖缓存穿透与雪崩解决方案、分布式锁实现、热点数据优化及持久化策略。通过真实业务场景演示,帮助开发者构建高可用、可扩展的分布式缓存系统。

92

2026.02.13

c语言 数据类型
c语言 数据类型

本专题整合了c语言数据类型相关内容,阅读专题下面的文章了解更多详细内容。

53

2026.02.12

雨课堂网页版登录入口与使用指南_官方在线教学平台访问方法
雨课堂网页版登录入口与使用指南_官方在线教学平台访问方法

本专题系统整理雨课堂网页版官方入口及在线登录方式,涵盖账号登录流程、官方直连入口及平台访问方法说明,帮助师生用户快速进入雨课堂在线教学平台,实现便捷、高效的课程学习与教学管理体验。

15

2026.02.12

豆包AI网页版入口与智能创作指南_官方在线写作与图片生成使用方法
豆包AI网页版入口与智能创作指南_官方在线写作与图片生成使用方法

本专题汇总豆包AI官方网页版入口及在线使用方式,涵盖智能写作工具、图片生成体验入口和官网登录方法,帮助用户快速直达豆包AI平台,高效完成文本创作与AI生图任务,实现便捷智能创作体验。

717

2026.02.12

PostgreSQL性能优化与索引调优实战
PostgreSQL性能优化与索引调优实战

本专题面向后端开发与数据库工程师,深入讲解 PostgreSQL 查询优化原理与索引机制。内容包括执行计划分析、常见索引类型对比、慢查询优化策略、事务隔离级别以及高并发场景下的性能调优技巧。通过实战案例解析,帮助开发者提升数据库响应速度与系统稳定性。

64

2026.02.12

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
TypeScript 教程
TypeScript 教程

共19课时 | 3万人学习

Vue.js 微实战--十天技能课堂
Vue.js 微实战--十天技能课堂

共18课时 | 1.2万人学习

JavaScript基础精讲视频教程
JavaScript基础精讲视频教程

共36课时 | 8.2万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号