JavaScript 是风姿罗曼蒂克种弱类型(或称动态类型)语言

JavaScript 是朝气蓬勃种弱类型(或称动态类型)语言,即变量的类型是不鲜明的。

x = 5; // 5
x = x + 'A'; // '5A'

地点代码中,变量x初步是四个数值,后来是二个字符串,类型完全由近日的值决定,那就叫弱类型。

弱类型的收益是这几个手疾眼快,能够写出格外简洁的代码。可是,对于大型项目来讲,强类型更便利,能够减少系统的复杂度,在编写翻译时就意识项目错误,缓慢解决程序员的负担。

平昔有人尝试,让 JavaScript
产生强类型语言。在官方最终帮衬强类型从前,本文介绍二种今后就可用的消除方案。

一、TypeScript

TypeScript 是微软二〇一二年生产的蓬蓬勃勃种编制程序语言,归于 JavaScript
的超集,能够编写翻译为 JavaScript 推行。 它的最大特色正是支撑强类型和 ES6
Class。

首先,安装TypeScript。

$ npm install -g typescript

接下来,为变量内定项目。

// greet.ts
function greet(person: string) {
  console.log("Hello, " + person);
}

greet([0, 1, 2]);

下面是文本 greet.ts 的代码,后缀名 ts 注解那是 TypeScript 的代码。函数
greet 的参数,评释类型为字符串,但在调用时,传入了三个数组。

使用 tsc 命令将 ts 文件编写翻译为 js 文件,就能抛出等级次序不合营的荒谬。

$ tsc greeter.ts
greet.ts(5,9): error TS2345: Argument of type 'number[]'   
is not assignable to parameter of type 'string'.

二、Flowcheck

Flowcheck 是贰个轻量级的体系断言库,能够在运作时(runtime)检查变量类型是还是不是科学。

首先,安装Flowcheck。

$ npm install -g flowcheck

然后,编写三个扬言了变量类型的剧本。

function sum(a: number, b: number) {
  return a + b;
}

sum('hello','world')

接着,使用上边包车型大巴一声令下,将脚本转变为正规的 JavaScript 文件。

$ browserify -t flowcheck -t [reactify --strip-types] 
input.js -o output.js

退换后的文本如下。

var _f = require("flowcheck/assert");

function sum(a, b) {
    _f.check(arguments, _f.arguments([_f.number, _f.number]));
  return a + b;
}

能够看来,代码中插入八个断言库。每趟运转函数早前,会先推行断言,倘诺类型不符就报错。

$ node output.js
// throw new TypeError(message);
            ^
TypeError: 

Expected an instance of number got "hello",   
context: arguments / [number, number] / 0

Expected an instance of number got "world",  
context: arguments / [number, number] / 1

三、Flow

Flow 是 Facebook在二〇一六年发布的二个项目检查工具,用来检查 React 的源码。

设置命令如下。

$ npm install --global flow-bin

假使设置不成事(作者正是这么),就必要本身从源码编译了。

Flow
的用法超级多,笔者只举多少个例子。前文介绍的三种工具,只好反省注明了品种的变量,而
Flow 能够测算变量类型。

// hello.js
/* @flow */
function foo(x) {
  return x*10;
}
foo("Hello, world!");

上面是文本 hello.js ,该公文的率先行是注释,证明须求利用 Flow
检查变量类型。

$ flow check
hello.js:7:5,19: string
This type is incompatible with
/hello.js:4:10,13: number

运行 flow check 命令,获得报错音讯:预期函数 foo
的参数是三个数值,可是实际上为一个字符串。

Flow 也扶持变量的品类注脚。

/* @flow */
function foo(x: string, y: number): string {
  return x.length * y;
}
foo("Hello", 42);

另多少个风趣的功能是,Flow 能够将品种注释(annotation),转为类型证明。

// annotation.js
/**
  @param {number} x
  @return {number}
 */
function square(x) {
  return x * x;
}
square(5);

运转 flow port 命令,会获得上边包车型大巴结果。

$ flow port annotation.js
function square(x: number) : number {
   return x * x;
 }

Flow 的更加多介绍,能够阅读《Exploring Flow, Facebook’s Type Checker for
JavaScript》。

正文的原始幻灯片点击这里(里面有越多内容)。

相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注

*
*
Website