TypeScript初探

TypeScript初探

摘要

为什么会去了解TypeScript呢？大概是因为当前所用的JavaScript不能满足日常开发要求，又或者是想学习技术，提升自己的硬技能。在TypeScript的官网上大致浏览了一下主要的内容，发现了很多在大学里学习过的面向对象编程语言Java的影子。所以对我来说，上手并不困难吧！

概述

为什么会有TypeScript呢？当然是因为JavaScript本身具有某些缺陷，所以才有了所谓的JavaScript的超集：TypeScript。超集这个术语可能不易理解，不如说成是JavaScript的升级版，它在JavaScript的基础上添加了许多特性和功能，比如：接口，枚举，泛型，同时具备ES6的类，将JavaScript这种函数式编程语言变成了一种面向对象的编程语言。但浏览器无法解析ts文件，所以当我们编写完TypeScript之后，需要通过编译将ts文件编译成js文件，编译出来的JavaScript就可以运行在浏览器中了。

安装

通过Node.js包管理器npm安装

npm install -g typescript

Hello World

在hello.ts的文件里编辑以下代码：

const msg : string = "Hello World!"
console.log(msg)

在命令行工具中执行命令：

tsc hello.ts

得到hello.js文件，文件中的代码如下：

var hello = "Hello World!"
console.log(hello)

在命令行工具中通过node命令执行该js代码

node hello.js 

则会在命令行工具中打印出：

Hello World

TypeScript基础类型和扩展类型

• any let a: any = 123;
• number let num: number = 321;
• string let str: string = "Hello World";
• boolean let bool: boolean = true;
• 数组 let arr: number[] = [1,2,3]; | let arr: Array = [1,2,3];
• 元组 let x: [number,string]; x = [1,"str"];
• enum enum Color {Red, Green, Blue};let c: Color = Color.Blue;
• void function hello(): void
• null 表示变量没有指定类型
• undefined 表示变量未被赋初始值
• never never 是其它类型（包括 null 和 undefined）的子类型，代表从不会出现的值

---

• 联合类型 var val:string|number;val = 12;val = "Hello";

接口

interface interface_name { 
	id:number;
	name:string;
	sayHello():void {};
}
class class_name implements interface_name {
	id:number;
	name:string;
	constructor(name:string) {
		this.name = name;
	}
	sayHello():void {
		return "Hello" + this.name;
	}
}

类

class Car { 
   // 字段
   engine:string; 
   // 构造函数
   constructor(engine:string) { 
      this.engine = engine 
   }  
   // 方法
   disp():void { 
      console.log("函数中显示发动机型号  :   "+this.engine) 
   } 
} 
// 创建一个对象
var obj = new Car("XXSY1")
// 访问字段
console.log("读取发动机型号 :  "+obj.engine)  
// 访问方法
obj.disp()

总结

运用面向对象编程思想来解决实际开发中的问题目前还缺少很多经验，毕竟一年来主要学习的是JavaScript。