初识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环境配置的详细内容...