什么是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. 杂项:IntelliJ IDEA

    ylbtech-杂项:IntelliJ IDEA 1.返回顶部   2.返回顶部   3.返回顶部   4.返回顶部   5.返回顶部     6.返回顶部   作者:ylbtech出处:http:/ ...

  2. python urllib从远程服务器下载文件到本地

    #!/usr/bin/env python #-*-coding:utf--*-' #Filename:download_file.py import sys,os import urllib def ...

  3. openStack 镜像制作,镜像裁剪一般步骤

    镜像制作一般裁剪步骤 1, linux系统安装CentOs/RHEL Desktop桌面系统,分区划分但分区/挂载点.设置Selinux=disabled关闭iptables安装cloud-init[ ...

  4. 1.Ext.onReady详解

    转自:https://blog.csdn.net/xufang461010923/article/details/37660139 我们知道,只有在Ext框架全部加载完后才能在客户端的代码中使用Ext ...

  5. 【140】◀▶ ArcGIS技巧

    目录: Add XY Data 图例修改 中文字符左斜体设置 专题图只显示“度” 制作渐变图例 待定 待定 待定 1. 在ArcGIS中插入含有经纬度的*.txt或者*.xls文件等 File> ...

  6. Asp.net Mvc 数据库上下文初始化器

    在Asp.net Mvc 和Entity FrameWork程序中,如果数据库不存在,EF默认的行为是新建一个数据库.如果模型类与已有的数据库不匹配的时候,会抛出一个异常. 通过指定数据库上下文对象初 ...

  7. 洛谷 P1251 餐巾计划问题【最小费用最大流】

    建图细节比较多,对于每个点i,拆成i和i',i表示用的餐巾,i'表示脏餐巾,连接: (s,i,r[i],p)表示在这一天买新餐巾 (i,t,r[i],0)表示这一天用了r[i]的餐巾 (s,i+n,r ...

  8. linux 安装和远程连接

    准备工作: 1.请安装好vmware 软件 2.linux 镜像包 3.putty 远程连接工具 任务: 设置好root 账号和普通账号 及设置网络 连接最简单使用桥接 只能ping 通 本机 nat ...

  9. Akka源码分析-CircuitBreaker(熔断器)

    熔断器,在很多技术栈中都会出现的一种技术.它是在分布式系统中提供一个稳定的阻止嵌套失败的机制. 该怎么理解呢?简单来说,在分布式环境中,如果某个计算节点出现问题,很容易出现失败的逆向传到或整个系统的雪 ...

  10. Linux之旅第一篇-目录结构及操作目录

    一.引言 Linux对java开发来说也是一项必备的技能,因为项目基本都是部署在Linux操作系统的服务器中,虽然项目不一定需要我们去部署,但不管是自己测试环境部署,还是一些生产环境中日志的查看,Li ...