初识Typescript及vscode环境配置
什么是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环境配置的更多相关文章
- 免安装方式的Python之VSCode环境配置
概述 本文旨在介绍免安装方式,在VSCode中搭建Python(3.73)的配置环境.至于Python是什么.它能做些什么,诸如此类的介绍均不在此文中介绍,相信能看此文的人,多多少少都会有些了解. V ...
- golang之vscode环境配置
go语言开发,选择vscode作为IDE工具也是一个不错的选择,毕竟goland收费,老是破解也挺麻烦,除了这点,不过说实话挺好用的.vscode的话相对来说就毕竟原始,适合初学者. 1.vscode ...
- mac系统vscode环境配置,以及iTerm2配置Zsh + on-my-zsh shell
https://segmentfault.com/a/1190000013612471?utm_source=tag-newest https://ohmyz.sh/ 一:安装iTerm2终端 htt ...
- vscode环境配置(二)——C Program Debug
一.任务准备 launch.json { "version": "0.2.0", "configurations": [ { "n ...
- vscode环境配置
"go.goroot": "/home/ken/go", "go.gopath": "/home/ken/gopath" ...
- vscode环境配置(三)——解决控制台终端中文输出乱码
由于系统终端默认编码为GBK,所以需要修改为UTF-8 方法一 打开cmd输入chcp查看编码格式,查看以及修改如下图所示: 方法二
- vscode环境配置(一)——C Program运行
ctrl + shift +p 打开应用商店 搜索 C/C++ 和 Code Runner(一键编译运行)
- 前端自动化测试 —— TDD环境配置(React+TypeScript)
欢迎讨论与指导:) 前言 TDD -- Test-Drive Development是测试驱动开发的意思,是敏捷开发中的一项核心实践和技术,也是一种测试方法论.TDD的原理是在开发功能代码之前,先编写 ...
- Git环境配置+VSCode中文乱码问题
异常处理汇总-开发工具 http://www.cnblogs.com/dunitian/p/4522988.html 1.VSCode中文乱码问题 (files.autoguessEncoding= ...
随机推荐
- asp.net mvc4 不支持EF6
参考文章:http://www.cnblogs.com/zeusro/p/3403771.html http://q.cnblogs.com/q/40926/ 解决方法是 1.把EF6删除改用EF5. ...
- 【WIP】Ruby JSON
创建: 2018/03/22 以后有空补上 注: JSON.generate 参数只能是Obejct或者Array, 不可以是Hash https://docs.ruby-lang.org/ja/la ...
- Linux 常用命令一 ls
一.ls命令 用于查看目录下的文件信息. ls 当前目录下都有哪些文件: wang@wang:~$ ls examples.desktop workpalce 模板 图片 下载 桌面 tools 公共 ...
- ionic2 如何引入第三方cordova插件
例如:cordova-plugin-wechat 这个插件可以做微信登录,分享支付等 首先第一步:ionic plugin add cordova-plugin-wechat --variable w ...
- python的Debug调试
先打开Shell的Debug-->Debugger调试, 然后点击程序的运行 点击Debug的step按钮查看每一步的结果
- 浅谈算法——线段树之Lazy标记
一.前言 前面我们已经知道线段树能够进行单点修改和区间查询操作(基本线段树).那么如果需要修改的是一个区间该怎么办呢?如果是暴力修改到叶子节点,复杂度即为\(O(nlog n)\),显然是十分不优秀的 ...
- 通过Fiddler监控Java应用发送请求及相应数据
Fiddler可以很好的监控浏览器发送的各种请求及响应数据,对于JAVA程序默认情况下是无法监控的,但实际需求中需要监控JAVA程序发送HTTP请求及返回数据是否正确. Fiddler默认配置的监听端 ...
- Android SQLite(1)简单示例-增,删,改,查
1.主要核心类,Sqlite编程要继承SQLiteOpenHelper import android.content.Context; import android.database.sqlite.S ...
- C# winform与Javascript的相互调用[转]
原文链接<html> <head> <meta http-equiv="Content-Language" content="zh-cn&q ...
- 使用mysql实现mybatis的分页效果
1.mybatis.xml <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE configur ...