使用duckie为JS做强类型检查

JS是一门动态类型语言&＃xff0c;在定义一个函数时&＃xff0c;无法为其进行强类型指定&＃xff0c;如&＃xff1a;

function hello(name: string, content: string) {// 如果name或content不是string类型的话&＃xff0c;就抛异常 }

如果没有类型指定的话&＃xff1a;

开发者常常不知道一个函数需要什么数据类型。
出现奇怪错误时&＃xff0c;给debug造成麻烦。

其实业界已经有两种解决办法&＃xff1a;

使用JSDoc对函数进行注释
使用强类型语言编程&＃xff0c;最后编译成JS.

首先说第一种&＃xff0c;JSDoc的语法规则可谓麻烦&＃xff0c;注释简单类型时还稍微OK&＃xff0c;如&＃xff1a;

/*** &＃64;param string name the name of the person* &＃64;param string content the content to say*/ function hello(name, content) { //... }

但如果我想对如下的数据结构做注释呢&＃xff1f;

Javascript{name: "jack",age: 18,address: {country: &＃39;china&＃39;,city: &＃39;beijing&＃39;}&＃xff0c;keywords: [&＃39;student&＃39;, &＃39;programmer&＃39;, &＃39;ios&＃39;] }

基本上没几个人能写的对JSDoc的注释&＃xff0c;要对上述结构进行JSDoc&＃xff0c;你需要&＃xff1a;

艰难的Google它奇怪的语法。
写出来还很丑。
最后其它开发者也看不懂。
参数传错也没有错误提示。&＃xff08;WebStorm一定程度上可以进行类型推导&＃xff09;。

第二种&＃xff0c;嗯&＃xff0c;就不说了。

要想基本没有学习成本的进行类型声明和检查&＃xff0c;下面进入正题&＃xff0c;使用duckie.

安装

对于node/browserify/webpack的用户&＃xff0c;直接&＃xff1a;

npm install duckievar t &＃61; require(&＃39;duckie&＃39;); // go!

对于浏览器用户&＃xff0c;可以直接使用https://github.com/ssnau/duckie/tree/master/build下已经编译好的文件&＃xff0c;也可用bower安装。最后可以使用window.duckie。

入门

回到篇首&＃xff0c;如果想实现function hello(name:string, content:string)该如何实现呢&＃xff1f;

function hello(name, content) {duckie.string.assert(name);duckie.string.assert(content);// 如果上面的断言不成立的话&＃xff0c;将抛出异常 }

string只是个示例&＃xff0c;duckie总共支持如下一些基本类型&＃xff1a;

boolean/bool
number
string
undefined
null
array
object
anything, 表示任意类型

即如下断言都为真&＃xff1a;

duckie.boolean.assert(true); duckie.number.assert(123); duckie.string.assert(&＃39;hello&＃39;); duckie.undefined.assert(undefined); duckie.null.assert(null); duckie.aray.assert([1,2,3]); duckie.object.assert({name: &＃39;jack&＃39;}); duckie.anything.assert(&＃39;blabla&＃39;);

如果只是断言简单的类型&＃xff0c;那大可不必用duckie&＃xff0c;JSDoc就基本能完成这种功效&＃xff0c;除了不会抛异常。

duckie真正有效的地方在于&＃xff0c;定义复杂的数据结构。

我们一个一个说起。

如果一个变量是枚举类型&＃xff0c;如何限定它的枚举值呢?

使用oneOf.

// 只有值为male或female的变量&＃xff0c;才能通过认证 duckie.oneOf([&＃39;male&＃39;, &＃39;female&＃39;]).assert(&＃39;male&＃39;) &＃61;> true duckie.oneOf([&＃39;male&＃39;, &＃39;female&＃39;]).assert(1) &＃61;> false

如果一个变量的类型&＃xff0c;可能是undefined&＃xff0c;可能是string&＃xff0c;该如何表示&＃xff1f;

使用maybe。

duckie.maybe(String).assert(&＃39;hello&＃39;) &＃61;> true duckie.maybe(String).assert(undefined) &＃61;> true duckie.maybe(String).assert(123) &＃61;> false/*注&＃xff1a;String可替换为duckie.string或"string"&＃xff0c;意义都一样*/

如果一个变量的类型可能是string&＃xff0c;可能是number呢?

使用oneOfType。

duckie.oneOfType([String, Number]).assert(1) &＃61;> true duckie.oneOfType([String, Number]).assert("hello") &＃61;> true duckie.oneOfType([String, Number]).assert(true) &＃61;> false

如果一个变量是一个由数字组成的数组&＃xff0c;该如何表示&＃xff1f;

使用arrayOf(Number)&＃xff0c;或[Number].

// 使用arrayOf duckie.arrayOf(Number).assert([1,2,3]) &＃61;> true // 直接使用[/*类型*/] duckie([Number]).assert([1,2,3]) &＃61;> true duckie([&＃39;number&＃39;]).assert([&＃39;hello&＃39;, &＃39;world&＃39;]) &＃61;> false/* 注: 类型声明使用Number&＃xff0c;duckie.number 和 &＃39;number&＃39; 效果是一样的。*/

如果一个变量是由一些key:value组成呢&＃xff1f;

使用objectOf&＃xff0c;或[].

//例如定义一个Person数据结构&＃xff0c;典型的变量如下&＃xff1a; var person &＃61; {name: &＃39;jack&＃39;,age: 18 };duckie.objectOf({name: String,age: Number }).assert(person) &＃61;> trueduckie({name: String,age: Number }).assert(person) &＃61;> true// 鸭子断言&＃xff0c;即只要求被断言对象符合定义的 // 键值类型要求&＃xff0c;而不要求精确匹配键数量 duckie({name: String }).assert(person) &＃61;> trueduckie({name: Number }).assert(person) &＃61;> false

如果一个变量是个object&＃xff0c;里面有些值是数组呢&＃xff1f;

以声明变量的方式用duckie声明你的类型。

// 比如篇首这东西 var person &＃61; {name: "jack",age: 18,address: {country: &＃39;china&＃39;,city: &＃39;beijing&＃39;}&＃xff0c;keywords: [&＃39;student&＃39;, &＃39;programmer&＃39;, &＃39;ios&＃39;] }// 使用duckie声明 duckie({name: String,age: Number,address: {country: String,city: String},keywords: [String] }).assert(person) &＃61;> true

声明一个类型跟声明一个对象般简单&＃xff0c;完全没有学习成本。