TypeScript初体验

最近在调研ionic2,先入门下typescript

  • 环境搭建
sudo npm install -g typescript

安装在/usr/local/lib/node_modules/typescript路径下,在bin下有tsc和tsserver两条命令。

  • 工程配置
    编译typescript,需设置配置文件tsconfig.json,可支持的参数详见官网
{
    "compilerOptions": {
        "outDir": "./built",
        "allowJs": true,
        "target": "es5"
    },
    "include": [
        "./src/**/*"
    ]
}

demo目录结构

屏幕快照 2016-12-01 下午7.45.43.png

main.js文件

interface Person {
    name: string;
    age: number;
}

function sortByName(a) {
    var result = a.splice(0);
    result.sort(function (x,y) {
        return x.name.localeCompare(y.name);
    });
    return result;
}

var result = sortByName([{name: "g3",age: 10},{name: "g2", age: 12}]);
alert(result[0].name + " " + result[1].name);

index.html

<!DOCTYPE html>
<html>
<head>
    <title>typescript</title>
    <script type="text/javascript" src="built/main.js"></script>
</head>
<body>

</body>
</html>

执行tsc命令,这时在built生成main.js文件

function sortByName(a) {
    // body...
    var result = a.splice(0);
    result.sort(function (x, y) {
        // body...
        return x.name.localeCompare(y.name);
    });
    return result;
}
var result = sortByName([{ name: "g3", age: 10 }, { name: "g2", age: 12 }]);
alert(result[0].name + " " + result[1].name);

html执行结果

屏幕快照 2016-12-01 下午7.51.09.png

发现是按照名字排序打印。

这种写html方式闲烦的话:直接执行node main.js,其结果也是g2 g3。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容