调试typescript

为什么要用 typescript安装typescript设置环境语言为汉语调试设置工作区设置修改调试信息设置build环境上代码输出代码调试界面为何要搞javascript 之类的

为什么要用 typescript

因为学习曲线。 本人从 C->C++ ，然后学了点儿python , 汇编 ,java ,lua ,对 javascript 的混乱语法实在不感兴趣。

安装typescript

typescript 依赖于node ,因此先要安装 node,然后再安装typescript.这里假设你会能搞定安装

设置环境语言为汉语

ctrl+shift+p , 输入 language ,出现 Config Display language ，安装一下中文，菜单就会变成中文了.

调试设置

工作区设置

在 File -> 将文件夹添加到工作区,你的 typescript 的文件

修改调试信息

菜单 “调试”->添加配置 编辑 luanch.json

{ // Use IntelliSense to learn about possible attributes. // Hover to view descriptions of existing attributes. // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", "configurations": [ { "type": "node", "request": "launch", "name": "Launch Program", "program": "${workspaceFolder}\\hello.js", "outFiles": [ "${workspaceFolder}/**/*.js" ] } ] }

修改你要调试的js文件

设置build环境

build.bat

node "C:\Users\Administrator\AppData\Roaming\npm\node_modules\typescript\bin\tsc" %1

可以用build.bat hello.ts 调试了。

上代码

源代码 hello.ts :

var 全局_运行在网页 = false; namespace hello{ export class mycls { private 名字:string=""; private 地址:string=""; 设置名字(value:string) { this.名字 = value; } 设置地址(value:string) { this.地址 = value; } 获得名字():string { return this.名字; } 获得地址():string { return this.地址; } } function 欢迎(person:string) { return "欢迎您, " + person+"，来到中国。"; } function 测试() { let 用户名 = "bkdrong"; console.log(全局_运行在网页); if(全局_运行在网页) { document.body.innerHTML = 欢迎(用户名); } else { console.log("用户名="+欢迎(用户名)); } } export function 主函数() { var x = new mycls; x.设置名字('bkdrong'); x.设置地址('beijing'); console.log(x.获得名字()); console.log(x.获得地址()); 测试(); let x1 = 1; x1 = 100; var x2 = 2; x2 = 100; console.log(x1); console.log(x2); } } hello.主函数(); 没有用 hello world 之类的，了无新意，我们用一下中文标识符吧，母语看着就是爽!!!和C++ 很类似 private public 等let 和 var 都可以修改值，没有什么区别类中变量需要初始化,负责警告函数参数类型也要指定，否则警告可以使用命名空间什么的，比只使用函数强不少。动态执行javascript ,就可以动态更新网站而不用重启typescript 编译为 javascript 有点类似 C/C++ 编译成 汇编语言有的人说typescript 是javascript 是语法糖；其实有糖吃挺好。（汇编也叫机器语言助记符）别的真没什么说的了，面向对象语言都很好用 ；命名空间，类，方法

输出代码

var 全局_运行在网页 = false; var hello; (function (hello) { var mycls = /** @class */ (function () { function mycls() { this.名字 = ""; this.地址 = ""; } mycls.prototype.设置名字 = function (value) { this.名字 = value; }; mycls.prototype.设置地址 = function (value) { this.地址 = value; }; mycls.prototype.获得名字 = function () { return this.名字; }; mycls.prototype.获得地址 = function () { return this.地址; }; return mycls; }()); hello.mycls = mycls; function 欢迎(person) { return "欢迎您, " + person + "，来到中国。"; } function 测试() { var 用户名 = "bkdrong"; console.log(全局_运行在网页); if (全局_运行在网页) { document.body.innerHTML = 欢迎(用户名); } else { console.log("用户名=" + 欢迎(用户名)); } } function 主函数() { var x = new mycls; x.设置名字('bkdrong'); x.设置地址('beijing'); console.log(x.获得名字()); console.log(x.获得地址()); 测试(); var x1 = 1; x1 = 100; var x2 = 2; x2 = 100; console.log(x1); console.log(x2); } hello.主函数 = 主函数; })(hello || (hello = {})); hello.主函数();

调试界面

为何要搞javascript 之类的

现在纯粹的客户端的业务越来越少,包括但不限于 嵌入式,C|C++界面,linux QT,MFC ，SQLite数据操作什么的，对于速度，因为CPU越来越强劲，安装包的大小考虑也越来越少了。跨平台越来越多。优秀的UI都是和平台相关，QT大家也在用，搞起来挺费劲。Web 前端却越来越火，有的用 electron ，react ,bootstrap ,和 node 结合起来，后面 在弄个依赖于node 的 express 很容易撸出一个 既支持独立客户端，又支持 客户端+服务器端的系统来。因此选择 node + typescript + express+electron .

相当强大的利器。

学习这些参考了很多博客，谢谢。