随笔

TypeScript

使用场景

大型项目,人员较多项目。其实说到底,主要还是用到强类型,项目的复杂度,开发人员规模加大,导致非强类型的时候,没人知道某个变量具体有什么属性 ( ̄. ̄)。

特性

  1. 强类型
  2. 引用库是非侵入式的,不需要改动三方库的代码
  3. ECMAScript 最新特性支持

实战

首先,它是如何实现无侵入式且兼容 JavaScript 代码的呢?类型定义文件会告诉你, https://www.npmjs.com/~types。 一个新的东西推广最大的问题是如果兼容之前的代码并且拥有新的特性,看下 .NET Framework 就知道了,它把之前的代码完全包含进去了,当然也有不兼容的,比如 IOS。TypeScript 巧妙的利用类型定义文件来解决了这个问题 o( ̄▽ ̄)d 。

这里有一些流行框架的快速启动代码:https://www.typescriptlang.org/samples/index.html

简单介绍下如何兼容 JS 文件,其他的特性就普普通通的 OOP 没啥好讲的。在需要使用的 JS 文件同目录下新建同名后缀为 .d.ts 的文件即可,例如:

// common.js
export default class common {
    objToQuery(obj) {
        let str = "";
        if (Object.keys(obj).length == 0) {
            return str;
        }
        Object.keys(obj).map(k => {
            str += `&${k}=${encodeURI(obj[k])}`
        });

        return str.substr(1);
    }
}

export function print(str) {
    console.log(str);
}
// common.d.ts
export default class common {
    objToQuery(obj: object): string;
}

export function print(str: string): void;
// tsconfig.json
{
  "compilerOptions": {
    "module": "commonjs",
    "target": "es5",
    "sourceMap": true,
    "allowJs": true,
    "outDir": "dist"
  },
  "exclude": [
    "node_modules"
  ],
  "include": ["src"]
}

当然, 也可以不添加类型定义文件,直接使用(如果你的检查等级放的很低的话),但那样就失去了强类型的意义不是嘛?说到这,还有件比较奇怪的事情是,网上的文章都让我把类型定义文件添加到配置文件的types中去,然后怎么调试都通不过,一直报 TS2688 类型文件未定义 emmmm...可能是版本不一样吧(我的是 3.0)

本文链接:https://note.lilonghe.net/post/typescript.html

-- EOF --