江苏龙网

  1. 主页 > 生活百科 > >

3分钟快速了解TypeScript

TypeScript

很多开发者对新生事物，会有畏惧的心情，其实，静下心来，大家会发现，编程语言之间都是相通的，大同小异 。因最近Cocos游戏开发建议使用TypeScript，故给大家介绍下TypeScript，帮助大家快速入门 。
TypeScript是由微软开发的自由和开源的编程语言，是JAVAScript的一个超集，支持 ECMAScript 6标准 。设计目标是开发大型应用，它可以编译成纯JavaScript，编译出来的 JavaScript可以运行在任何浏览器上 。
一、 JavaScript 与 TypeScript 的区别
TypeScript是JavaScript的超集，扩展了JavaScript的语法，因此现有的JavaScript代码可与TypeScript一起工作无需任何修改，TypeScript 通过类型注解提供编译时的静态类型检查 。TypeScript可处理已有的JavaScript代码，并只对其中的TypeScript代码进行编译 。
1. TypeScript与JavaScript 基础类型的区别
JavaScript是一种弱类型的编程语言，其基本数据类型有number、string、boolean、Array、null、undefined 。
而TypeScript 遵循强类型，如果将不同的类型赋值给变量会编译错误，如下实例：
var num:number = "bycw"; // 这个代码会编译错误
但是，为了保持跟JavaScript的弱类型同步性，TypeScript中增加了any类型，表示任意类型，声明为 any 的变量可以赋予任意类型的值 。如下：
var a : any = "bycw"; // 将字符串赋值给any类型的变量a
a = 666; // 将数值赋值给any类型的变量a
需要注意的是：TypeScript会进行类型推断，也就是当类型没有给出时，TypeScript 编译器利用类型推断来推断类型 。如果由于缺乏声明而不能推断出类型，那么它的类型被视作默认的动态 any 类型 。如下：
var num = 2; // 类型推断为 number
console.log("num 变量的值为 "+num);
【3分钟快速了解TypeScript】num = "12"; // 编译错误，因为推断类型为number，再赋值字符串
console.log(num);
编译时，报错：error TS2322: Type '"12"' is not assignable to type 'number'.表示字符串“12”不能赋值给一个number类型的变量 。
除此外，TypeScript还支持联合类型 。
联合类型（Union Types）可以通过管道(|)将变量设置多种类型，赋值时可以根据设置的类型来赋值 。注意：只能赋值指定的类型，如果赋值其它类型就会报错 。可以通过联合参数限定函数参数的类型 。
创建联合类型的语法格式如下： Type1|Type2|Type3
TypeScript声明一个联合类型：
var val:string|number
val = 12
console.log("数字为 "+ val)
val = "Runoob"
console.log("字符串为 " + val)
2. TypeScript与JavaScript 基础语法的区别
相对于JavaScript，TypeScript语义化表述更清晰，更便于阅读理解，也方便使用其它面向对象编程语言的开发者快速上手 。
【1】在变量声明和方法声明时，TypeScript需要在变量名及方法名后加上冒号(:)及数据类型 。
【2】在语法结构上，TypeScript 还支持 for…of 、forEach、every 和 some 循环 。
for...of 语句创建一个循环来迭代可迭代的对象 。在 ES6 中引入的 for...of 循环，以替代 for...in 和 forEach() ，并支持新的迭代协议 。for...of 允许你遍历 Arrays（数组）, Strings（字符串）, Maps（映射）, Sets（集合）等可迭代的数据结构等 。
TypeScript for...of 循环
let someArray = [1, "string", false];
for (let entry of someArray) {
console.log(entry); // 1, "string", false
}
forEach、every 和 some 是 JavaScript 的循环语法，TypeScript 作为 JavaScript 的语法超集，当然默认也是支持的 。
因为 forEach 在 iteration 中是无法返回的，所以可以使用 every 和 some 来取代 forEach 。
TypeScript forEach 循环
let list = [4, 5, 6];
list.forEach((val, idx, array) => {
// val: 当前值
// idx：当前index
// array: Array
});
TypeScript every 循环
let list = [4, 5, 6];
list.every((val, idx, array) => {
// val: 当前值
// idx：当前index
// array: Array
return true; // Continues
// Return false will quit the iteration
});
当然，相对于JavaScript、TypeScript做了一些优化和改进，在本文后续内容中给大家逐一解析 。（参见本文后续TypeScript新增特性）
二、 TypeScript与Java等编程语言的区别
对于之前使用Java、C#等编程语言的学习者几乎可以在几分钟内快速上手 。比如其变量和方法声明与Java语法的区别如下：
TypeScript中声明变量： var county: string= “china”;


推荐阅读


上一篇：刷完漆需要通风还是关窗,刷完墙漆什么时候通风好

下一篇：MD5算法全解析