Boolean类型
aser:和as3一样

  1. var isDone: boolean = false;

复制代码

Number类型
aser:as3经常用int和uint,以后只用number就可以啦

  1. var height: number = 6;

复制代码

String类型
aser:和as3一样

  1. var name: string = "bob";

复制代码

Array类型
我习惯用第三种,和as3一样。
第一种:

  1. var list:number[] = [1, 2, 3];

复制代码

第二种:

  1. var list:Array<number> = [1, 2, 3];

复制代码

第三种:【我用的】【yellowshorts】反应在vs2012报错,我使用sublime没有报错,谨慎的用前两种吧。

  1. var list:Array = []

复制代码

Enum枚举 
aser:as3没有枚举,但是很好用。和最近使用lua的table差不多

  1. enum Color {Red, Green, Blue};

复制代码

默认情况下,枚举成员编号从0开始。 您可以通过手动设置其成员的值

  1. enum Color {Red = 1, Green = 2, Blue = 4};

复制代码

使用的时候和数组差不多。两种方式 。
第一种:

  1. Color.Green

复制代码

第二种:

  1. enum Color {Red = 1, Green, Blue};

复制代码

Any类型
aser:类似于as3的*。感谢@少瑞指正!
我们可能需要描述变量的类型,但是我们又不知道当前变量的类型。 这时候,让他在编译时检查类型。这时候就可以使用any:

  1. var notSure: any = 4;

复制代码

例如,您可能有一个数组但数组元素是不同类型:

  1. var list:any[] = [1, true, "free"];

复制代码

void类型
也就是标注在方法最后,表示不返回任何值。

  1. function warnUser(): void {
  2. alert("This is my warning message");
  3. }

复制代码

==================================================

一、简单例子1、看看接口工作最简单的一个例子:

  1. function printLabel(labelledObj: {label: string}) {
  2. console.log(labelledObj.label);
  3. }
  4. var myObj = {size: 10, label: "Size 10 Object"};
  5. printLabel(myObj);

复制代码

类型检查器检查调用“printLabel”。 printLabel的函数只有一个参数,要求传入的对象属性称为“标签”类型的字符串,例如【{size: 10, label: "Size 10 Object"}】。 请注意,我们的对象实际上有更多的属性,例如【size:10】,但是编译器只检查 至少 需要的存在和匹配所需的类型,例如【label: "Size 10 Object"】是不是字符串。

2、另一个例子,使用一个接口来描述需求的“标签”属性,是一个字符串:

  1. interface LabelledValue {
  2. label: string;
  3. }
  4. function printLabel(labelledObj: LabelledValue) {
  5. console.log(labelledObj.label);
  6. }
  7. var myObj = {size: 10, label: "Size 10 Object"};
  8. printLabel(myObj);

复制代码

接口“LabelledValue”是一个名字,我们现在可以使用在前面的例子描述的要求。 它仍然代表着拥有一个属性被称为“标签”,是string类型的。 注意到我们没有显式地说 对象,我们通过“printLabel”实现这个接口。 在这里,只注重类型。 如果我们通过列出的功能满足需求,那么它是允许的。

值得指出的是,这些属性的类型检查器不需要任何形式的实现,只存在属性的接口要求,所需的类型。 
二、可选属性

并不是每一个属性都需要传递。

这里的这个例子:

  1. interface SquareConfig {
  2. color?: string;
  3. width?: number;
  4. }
  5. function createSquare(config: SquareConfig): {color: string; area: number} {
  6. var newSquare = {color: "white", area: 100};
  7. if (config.color) {
  8. newSquare.color = config.color;
  9. }
  10. if (config.width) {
  11. newSquare.area = config.width * config.width;
  12. }
  13. return newSquare;
  14. }
  15. var mySquare = createSquare({color: "black"});

复制代码

编写接口时可选属性变量名后边增加“?” 作为属性声明的一部分。

可选属性的优点是,你可以描述这些可能可用的属性,同时还捕捉属性,你知道预计不会是可用的。 例如,我们打错属性的名称传递给“createSquare”, 让我们知道我们将得到一个错误信息:

  1. interface SquareConfig {
  2. color?: string;
  3. width?: number;
  4. }
  5. function createSquare(config: SquareConfig): {color: string; area: number} {
  6. var newSquare = {color: "white", area: 100};
  7. if (config.color) {
  8. newSquare.color = config.collor;  // Type-checker can catch the mistyped name here
  9. }
  10. if (config.width) {
  11. newSquare.area = config.width * config.width;
  12. }
  13. return newSquare;
  14. }
  15. var mySquare = createSquare({color: "black"});

复制代码

三、函数类型
除了描述一个物体的属性,接口也能够描述函数类型。

如下:

  1. interface SearchFunc {
  2. (source: string, subString: string): boolean;
  3. }

复制代码

一旦定义,我们可以使用这个函数类型接口像我们其他类型的接口。 如下:

  1. var mySearch: SearchFunc;
  2. mySearch = function(source: string, subString: string) {
  3. var result = source.search(subString);
  4. if (result == -1) {
  5. return false;
  6. }
  7. else {
  8. return true;
  9. }
  10. }

复制代码

参数类型必须匹配,而参数的名称不需要匹配。 例如,我们可以写上面的例子是这样的:

  1. var mySearch: SearchFunc;
  2. mySearch = function(src: string, sub: string) {
  3. var result = src.search(sub);
  4. if (result == -1) {
  5. return false;
  6. }
  7. else {
  8. return true;
  9. }
  10. }

复制代码

函数返回类型也会匹配检查。 
四、数组类型
类似于我们可以使用接口来描述函数类型,我们也可以描述数组类型。 数组类型有一个索引的类型,描述了类型允许索引对象,连同相应的返回类型来访问索引。

  1. interface StringArray {
  2. [index: number]: string;
  3. }
  4. var myArray: StringArray;
  5. myArray = ["Bob", "Fred"];

复制代码

下面这个没看懂,谁看懂了下面回一下,谢谢!感谢 【foodyi】的解释

这个是索引数组,是以KEY VALUE的形式来声明的,就像这个接口的名字一样,他是一个字典结构,不可以有length的属性,这是我的理解,TS的接口太灵活了。
  1. interface Dictionary {
  2. [index: string]: string;
  3. length: number;    // error, the type of 'length' is not a subtype of the indexer
  4. }

复制代码

五、类类型实现一个接口
最常见的一种使用语言c#和Java接口的显式地执行。

  1. interface ClockInterface {
  2. currentTime: Date;
  3. }
  4. class Clock implements ClockInterface  {
  5. currentTime: Date;
  6. constructor(h: number, m: number) { }
  7. }

复制代码

你也可以描述方法在类中实现接口,如下我们与凝固时间的例子:

  1. interface ClockInterface {
  2. currentTime: Date;
  3. setTime(d: Date);
  4. }
  5. class Clock implements ClockInterface  {
  6. currentTime: Date;
  7. setTime(d: Date) {
  8. this.currentTime = d;
  9. }
  10. constructor(h: number, m: number) { }
  11. }

复制代码

六、扩展接口
像类、接口可以扩展。 让你更自由的使你的接口为可重用的组件。

  1. interface Shape {
  2. color: string;
  3. }
  4. interface Square extends Shape {
  5. sideLength: number;
  6. }
  7. var square = <Square>{};
  8. square.color = "blue";
  9. square.sideLength = 10;

复制代码

一个接口可以扩展多个接口,创建一个组合的所有接口。

  1. interface Shape {
  2. color: string;
  3. }
  4. interface PenStroke {
  5. penWidth: number;
  6. }
  7. interface Square extends Shape, PenStroke {
  8. sideLength: number;
  9. }
  10. var square = <Square>{};
  11. square.color = "blue";
  12. square.sideLength = 10;
  13. square.penWidth = 5.0;

复制代码

七、混合类型
如前所述,接口可以描述丰富的类型出现在现实世界的JavaScript。 由于JavaScript的动态和灵活自然,偶尔会遇到的对象是上面描述的一些类型的组合。

一个例子是一个对象,作为一个函数和一个对象,附加属性:

  1. interface Counter {
  2. (start: number): string;
  3. interval: number;
  4. reset(): void;
  5. }
  6. var c: Counter;
  7. c(10);
  8. c.reset();
  9. c.interval = 5.0;

复制代码

==================================================

TypeScript教程1的更多相关文章

  1. TypeScript教程2

    在TS中,我们允许开发人员使用面向对象技术. 1.类让我们看看一个简单的基于类的例子: class Greeter { greeting: string; constructor(message: s ...

  2. TypeScript教程

    汇智课堂 地址  http://www.hubwiz.com/course/55b724ab3ad79a1b05dcc26c/ TypeScript是一种由微软开发的自由和开源的编程语言.它是Java ...

  3. TypeScript 教程&手册

    参考:https://www.w3cschool.cn/typescript/ https://www.gitbook.com/book/zhongsp/typescript-handbook/det ...

  4. TypeScript教程3

    1.快速回顾一下这JavaScript中的命名函数和匿名函数: 纯文本查看 复制代码 1 2 3 4 5 //Named functionfunction add(x, y) {     return ...

  5. 2018-05-09 5分钟入门CTS-尝鲜中文版TypeScript

    知乎原链 本文为中文代码示例之5分钟入门TypeScript的CTS版本. CTS作者是@htwx(github). 它实现了关键词和标准库的所有命名汉化. 本文并未使用附带的vscode相关插件(包 ...

  6. HowToDoInJava 其它教程 1 &#183; 翻译完成

    原文:HowToDoInJava 协议:CC BY-NC-SA 4.0 欢迎任何人参与和完善:一个人可以走的很快,但是一群人却可以走的更远. ApacheCN 学习资源 目录 Maven 教程 如何在 ...

  7. 【electron+vue3+ts实战便笺exe】一、搭建框架配置

    不要让自己的上限成为你的底线 前言 诈尸更新系列,为了跟上脚步,尝试了vue3,在学习vue3的时候顺便学习一手electron和ts,本教程将分别发布,源码会在最后的文章发布.因为还在开发中,目前也 ...

  8. 100 个常见错误「GitHub 热点速览 v.22.35」

    本周的特推非常得延续上周的特点--会玩,向别人家的女朋友发送早安.这个错误是如何发生的呢?如何有效避免呢?自己用 daily_morning 免部署.定制一个早安小助手给女友吧. 除了生活中的错误,工 ...

  9. 转载:TypeScript 简介与《TypeScript 中文入门教程》

    简介 TypeScript是一种由微软开发的自由和开源的编程语言.它是JavaScript的一个超集,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程.安德斯·海尔斯伯格,C#的首席架构 ...

随机推荐

  1. CodeForces 616C The Labyrinth

    先预处理出所有连通块,对于每一个*,看他四周的连通块即可 #include<cstdio> #include<cstring> #include<queue> #i ...

  2. Java中常用Cache机制的实现

    Cache缓存主要分为两类:一.文件缓存:二:内存缓存,也就是实现一个类中静态Map,对这个map进行常规的增删改查: 1.文件缓存 XML格式,序列化DAT文件格式或者其他格式 2.内存缓存

  3. javascript 中的this

    he scope of all functions is window. (The reason why is you are invoking f as a function(类,全局的类) and ...

  4. 牛掰啊,github+svn+FB进行项目开发

    刚刚头脑发热,用svn把自己的github的一个项目下载下来,然后在Flash Builder中导入,然后惊喜的发现项目居然被svn接管了,如图: 当然,你得给你的Flash Builder装SVN插 ...

  5. Codeforces AIM Tech Round3

    打得最烂一场Codeforces,多次都错题,无限WA... A题: 题意:给定n个橘子的大小,大小超过b的丢掉,不足d的补充进来,同时超过d的部分去掉,问要去掉几次 分析:直接模拟即可 #inclu ...

  6. RAC(ReactiveCocoa)

    什么是 ReactiveCocoa ReactiveCocoa(其简称为 RAC)是由 Github 开源的一个应用于 iOS 和 OS X 开发的新框架.RAC 具有函数式编程和响应式编程的特性.它 ...

  7. (中等) HDU 5046 Airport ,DLX+可重复覆盖+二分。

    Description The country of jiuye composed by N cites. Each city can be viewed as a point in a two- d ...

  8. 关于JAVA中hashCode

    hash code 即散列码根据对象计算出的一个整型值,散列码是没有规律的. 如果两个对象相等(equal() 返回true),则hashCode一定相等,如果两个对象hashCode相等,则对象不一 ...

  9. linux命令学习-4-lsof

    lsof(list open files)是一个列出当前系统打开文件的工具.在linux环境下,任何事物都以文件的形式存在,通过文件不仅仅可以访问常规数据,还可以访问网络连接和硬件. 在终端下输入ls ...

  10. IOS9提示“不受信任的开发者”如何处理

    iPhone升级到IOS9版本后,发现部分APP在下载后首次运行时,都会提示“不受信任的应用程序开发者”,这是因为企业证书发布的APP,没有经过AppStore审核,于是iOS对用户做出一个安全性的提 ...