什么是typescript?为什么要用它?

typescript简称ts,是js语法的一个超级,由微软团队维护的

js特点(不足)

弱类型:js中的数据变量没有确定的类型,可以存储对象,可以存储数字,可以存储字符串等等

动态的:我定义的变量,到底是什么类型的,需要多少存储空间,我们定义时不知道,只有在执行的时候临时分配

因此开发者希望js像强类型语言那样,可以在运行前将内存空间分配出来,所以ts就是基于这种思想设计出来的,是一个强类型的语言

在大型项目中,代码可维护性可延展性等等尤为很重要,因此面向对象开发显得尤为重要,但是js没有class,extends,interface,implements,public,static等等概念,因此js中的类、继承等都是模拟的,这样就要增加一些额外的开销,这些开销在大型项目中是不可忽视的。因此ts实现了这些功能

ts实现了太多的功能,但是没有被浏览器支持,所以我们要编译

一、下载安装node环境,这个就不用多介绍了。

1、新建一个练习目录,在该目录下的终端(cmd )直接输入 tsc --init 它会给我们创建一个tsconfig.json的文件,相当于初始化一个项目目录。

2、在终端输入 npm typescript -g 他就会在全局下安装ts需要的环境。

3、好了,我们开始写以 xxx.ts后缀的文件,并执行 tsc xxx.ts,或者 tsc xxx.ts --watch 这时他就会制动编译成一个与之同名的xxx.js文件 这样一来浏览器就可以识别了,我们就可以尽情地练习Ts的语法了。

4、当我们每次修改时都要编译,很麻烦 vscode可以做以下配置即可:

在tsconfig.json 中做一下修改:"outDir": "./js",然后选择vscode 任务-运行任务-监视tsconfig.json

二、变量的数据类型

let a:string = 'bbb';
let num:number = 123;
let bol:boolean = true;
let color: any = 'red'; var other:number[] = [1,2,3];
let y:[number,string] = [1,'hello'];//元组
console.log(bol)

三、定义函数

// 定义函数
// 如果一个参数,返回num1+10,如果两个参数,返回两个参数之和
function add(num1, num2) {
if (typeof num2 === 'undefined') {
return num1 + 10;
}
else {
return num1 + num2;
}
}
console.log(add(10));
console.log(add(10, 20));

初识Typescript及vscode环境配置的更多相关文章

  1. 免安装方式的Python之VSCode环境配置

    概述 本文旨在介绍免安装方式,在VSCode中搭建Python(3.73)的配置环境.至于Python是什么.它能做些什么,诸如此类的介绍均不在此文中介绍,相信能看此文的人,多多少少都会有些了解. V ...

  2. golang之vscode环境配置

    go语言开发,选择vscode作为IDE工具也是一个不错的选择,毕竟goland收费,老是破解也挺麻烦,除了这点,不过说实话挺好用的.vscode的话相对来说就毕竟原始,适合初学者. 1.vscode ...

  3. mac系统vscode环境配置,以及iTerm2配置Zsh + on-my-zsh shell

    https://segmentfault.com/a/1190000013612471?utm_source=tag-newest https://ohmyz.sh/ 一:安装iTerm2终端 htt ...

  4. vscode环境配置(二)——C Program Debug

    一.任务准备 launch.json { "version": "0.2.0", "configurations": [ { "n ...

  5. vscode环境配置

    "go.goroot": "/home/ken/go", "go.gopath": "/home/ken/gopath" ...

  6. vscode环境配置(三)——解决控制台终端中文输出乱码

    由于系统终端默认编码为GBK,所以需要修改为UTF-8 方法一 打开cmd输入chcp查看编码格式,查看以及修改如下图所示: 方法二

  7. vscode环境配置(一)——C Program运行

    ctrl + shift +p 打开应用商店 搜索 C/C++  和 Code Runner(一键编译运行)  

  8. 前端自动化测试 —— TDD环境配置(React+TypeScript)

    欢迎讨论与指导:) 前言 TDD -- Test-Drive Development是测试驱动开发的意思,是敏捷开发中的一项核心实践和技术,也是一种测试方法论.TDD的原理是在开发功能代码之前,先编写 ...

  9. Git环境配置+VSCode中文乱码问题

    异常处理汇总-开发工具  http://www.cnblogs.com/dunitian/p/4522988.html 1.VSCode中文乱码问题 (files.autoguessEncoding= ...

随机推荐

  1. (DP)51NOD 1183 编辑距离

    编辑距离,又称Levenshtein距离(也叫做Edit Distance),是指两个字串之间,由一个转成另一个所需的最少编辑操作次数.许可的编辑操作包括将一个字符替换成另一个字符,插入一个字符,删除 ...

  2. macbook pro上安装vmware虚拟机

    http://xclient.info/s/vmware-fusion.html?_=84739015bcde24a4cc7a744d2d5f748b https://docs.vmware.com/ ...

  3. UVA 10462 Is There A Second Way Left? (次小生成树+kruskal)

    题目大意: Nasa应邻居们的要求,决定用一个网络把大家链接在一起.给出v个点,e条可行路线,每条路线分别是x连接到y需要花费w. 1:如果不存在最小生成树,输出“No way”. 2:如果不存在次小 ...

  4. git 标签

    如果你达到一个重要的阶段,并希望永远记住那个特别的提交快照,你可以使用 git tag 给它打上标签. 比如说,我们想为我们的 runoob 项目发布一个"1.0"版本. 我们可以 ...

  5. ES6的新方法实现数组去重

    ES6里新添加了两个很好用的东西,set和Array.from. set是一种新的数据结构,它可以接收一个数组或者是类数组对象,自动去重其中的重复项目. 在这我们可以看见,重复的项目已经被去掉了,包括 ...

  6. Windows环境下修改Oracle实例监听IP地址

    Windows环境下修改Oracle实例监听IP地址. 配置文件路径:<ORACLE_HOME>\NETWORK\ADMIN 如:C:\Oracle11gR2\product\11.2.0 ...

  7. jmeter(二)元件的作用域与执行顺序

    1.元件的作用域 JMeter中共有8类可被执行的元件(测试计划与线程组不属于元件),这些元件中,取样器是典型的不与其它元件发生交互作用的元件,逻辑控制器只对其子节点的取样器有效,而其它元件(conf ...

  8. ActionEvent之TextField

    这里我们讲这个TestField类 也就是我们的输入框,什么输入密码,用户名什么的. 一些方法: 这里说到TestField也会有事件发生,就是当你在文本框敲回车的时候. 看个例子: import j ...

  9. Lync客户端证书安装

    安装完Lync客户端后,运行时Lync客户端时,报出如下错误: [原因解析] Lync客户端没有正确安装CA证书链. [解决办法] 第一种方法:将计算机加入域. 第二种方法:不加入域的处理方法: 1. ...

  10. 每天学点linux命令之locate 与 find 命令

    定位某个文件的位置 方法一 sudo find / -name libGLEW.so.1.13 -type f 方法二 sudo updatedb && locate libopenc ...