返回TypeScript手册总目录


基本类型(Basic Types)

为了让程序可以使用,我们需要用到一些最简单的数据单元:数字,字符串,结构,布尔值,诸如此类。在TypeScript中,支持许多正如你在JavaScript中期待的相同类型,并且弹窗提示的枚举类型很方便。

布尔值(Boolean)

最基本的数据类型是简单的true/value值,JavaScript和TypeScript(包括其他语言)把这个称作“boolean”值。

var isDone: boolean = false;

数值(Number)

和在JavaScript中一样,TypeScript中的所有数字都是浮点值。这些浮点值的类型都是“number”。

var height: number = 6;

字符串(String)

在JavaScript中,页面和服务器之类创建程序的另一个基础部分是使用文本数据工作。和其它语言一样,我们使用“string”引用这些文本数据类型。就像JavaScript,TypeScript也使用双引号或单引号来包裹字符串数据。

var name: string = "bob";
name = 'smith';

数组(Array)

TypeScript和JavaScript一样,允许使用数组值。数组类型有两种写法。第一种,使用数组中的元素的类型后跟中括号“[]”来标志元素类型的数组:

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

第二种方式,使用泛型的数组类型,Array<elemType>:

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

枚举(Enum)

“enum”是TypeScript对JavaScript的标准数据类型集的有用的扩展。像C#语言一样,一个枚举是一种更友好地给出数值集合的名字的方式。

enum Color {Red, Green, Blue};
var c: Color = Color.Green;

默认情况下,枚举类型的成员是从0开始计数的。可以手动地通过设置成员的值来改变默认的计数规则。比如,我们可以从1开始而不是0开始:

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

或者,手动地设置枚举的所有值(跟C#语法一样):

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

枚举方便的一个特征是可以从一个名字的数值找到枚举中的值所对应的名字。比如,如果有一个值为2,但是不确定它对应到枚举中的哪一个名字,那么可以通过下面的方式查看对应的名字:

enum Color {Red = 1, Green, Blue};
var colorName: string = Color[2];alert(colorName);

任意类型(Any)

有时候我们可能要描述一些我们可能不知道的变量类型。这些值可能来自动态内容,比如来自用户或者第三方类库。在这些情况下,我们要脱离类型检查和让这些值通过编译时检查,可以使用“any”进行标志:

var notSure: any = 4;
notSure = "maybe a string instead";
notSure = false;//最后是一个布尔值

“any”是处理现有的JavaScript的一种强有力的方式,允许慢慢地在编译期间选择加入和退出类型检查。

如果知道一部分类型但也许不是所有类型,这时“any”类型也很方便。比如,有个数组,但是这个数组混合了不同类型的值:

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

Void

也许”any”在很多方面与“void”相对,即根本不存在任何类型。通常,这个用于不返回任何值的函数的返回类型。

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

接口(Interfaces)

TS的核心原则之一是关注值的类型检查,有时也叫“动态类型”或“结构化子类型”。在TS中,接口扮演了命名这些类型的角色,它是在你的代码内部和项目外部定义约定的强大方式。

第一个接口

了解接口如何工作的最简单的方式是开始一个简单的例子:

 1 function printer(labelObj:{label:string}) { 2     console.log(labelObj.label);
 3 }
 4 var myObj = { size: 10, label: "size 10 object" };
 5 printer(myObj);

类型检查器会检测“printer”的调用,“printer”函数只有一个参数,该参数要求传入的对象有一个名为“label”的string类型参数。注意,实际上我们例子中传入的对象有更多的属性,但是编译器的检测机制是这样的,传入的对象的属性最少存在一个和要求的同名,并且类型匹配。

我们再次写一下这个例子,这次使用接口来描述,该接口有一个string类型的“label”属性:

 1 interface LabelValue{ 2     label:string;
 3 }
 4
 5 function printLabel(labelObj:LabelValue) { 6     document.write(labelObj.label);
 7 }
 8 var myObj = { size: 10, label: "size 10 object" };
 9 printLabel(myObj);

接口“LabelValue”是一个我们可以用来描述之前例子里的需求的名字。它仍表示了一个具有string类型的“label”属性。注意,我们我们传入“printLabel”方法中的对象不必像其他语言一样显示实现该接口。这里它只是要紧的模型。如果我们传入函数的对象满足列出的需求,那么传入的对象是被允许的。

值得指出的是,类型检查器对这些属性的顺序不做要求,只要求存在接口定义的这些属性,并且类型匹配。

可选属性

并不是接口的所有属性都是必须要满足的。一些属性可能在一定的条件下存在或者可能根本不存在。当用户创建像”选项包”时,此时用户给一个只有两个属性要填充的函数传入一个对象,可选属性就派上用场了。

下面是此模式的一个例子:

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

具有可选属性的接口和其他接口写法相似,只不过它的每一个可选属性在声明时,用一个”?”进行标注。

可选属性的优势在于你可以描述这些可能是可利用的属性,然而也会捕获可能不可用的属性。

函数类型

接口可以描述广泛的JavaScript对象可以构建的模型,除了描述具有属性的对象之外,接口还可以描述函数类型。

为了描述具有接口的方法类型,我们给该接口一个调用签名。这就像一个只有参数列表和给定返回类型的方法声明。

 1 //函数类型接口的声明
 2 interface SearchFunc { 3     (source:string,substring:string):boolean;
 4 }
 5
 6 var mySerach: SearchFunc;
 7 mySerach = function (source: string, substring: string) { 8     var result = source.search(substring);
 9     if (result==-1) {10         return false;
11     } else {12         return true;
13     }
14 };

一旦定义了函数类型接口,就可以像其他接口一样使用,这里,我们演示了如何创建函数类型的变量以及给它赋一个相同类型的函数值。

对于函数类型的正确类型检查,不需要匹配参数的名字,比如上面例子的“source”命名为“src”。

方法参数每次只检查一次,相互检查每一个相应的参数的类型。上面的例子,我们的函数表达式返回的值(true和false)暗示了它的返回类型。如果上面返回的是number或string类型的值,类型检查器会警告我们“返回的类型不匹配在SearchFunc接口中描述的返回类型”。

类类型(Class Types)

实现一个接口

在像C#和Java语言中,接口最通常的用法之一是,显式地强一个类满足一个特定的契约,这在TypeScript中也是可以的。

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

接口描述了类的公共的部分,而不是公共和私有两部分。这会阻止你使用它们来检查一个类的实例的私有部分也有特定的类型。

类的静态/实例端之间的区别

当使用类和接口时,它帮助记忆类有两种类型:静态类型和实例类型。你可能会注意到,如果你使用构造签名创建了一个接口,并且尝试创建一个实现了该接口的类时,你会得到一个错误:

 1 /***************错误的写法***************/
 2 interface ClockInterface { 3     new (hour: number, minute: number);
 4 }
 5
 6 class Clock implements ClockInterface { 7     currentTime: Date;
 8     constructor(h: number, m: number) { }
 9 }
10 /**************错误的写法****************/
11 /***************正确的写法***************/
12 interface ClockStatic {13     new (hour: number, minute: number);
14 }
15
16 class Clock2{17     currentTime: Date;
18     constructor(h: number, m: number) { }
19 }
20
21 var cs: ClockStatic = Clock;
22 var newClock = new cs(7, 30);
23 /**************正确的写法****************/

这是因为,当一个类实现一个接口时,只会检测类的实例端,因为constructor位于静态端,所以会被检测到。相反,你可能需要直接使用类的“静态”端。

继承接口(Extends Interfaces)

像类一样,接口也可以互相继承。它处理复制一个接口的成员到另一个接口的任务,在如何分离接口为可重用的组件时给你更多的自由。

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

一个接口可以继承多个接口,这样就创建了所有接口的组合。

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

杂交类型(Hybrid Types)

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

当和第三方JavaScript交互时,你可能需要使用像上面的模式来完全描述该类型的模型。

TypeScript:基本类型和接口相关推荐

  1. Java Native Interface 二 JNI中对Java基本类型和引用类型的处理

    本文是<The Java Native Interface Programmer's Guide and Specification>读书笔记 Java编程里会使用到两种类型:基本类型(如 ...

  2. 【系列】重新认识Java——基本类型和包装类

    Java一种静态编程语言,所有变量和表达式是在编译时就确定的.同时,Java又是一种强类型语言,所有的变量和表达式都有具体的类型,并且每种类型是严格定义的.类型限制了变量可以hold什么样的值,表达式 ...

  3. 对象在内存中的存储基本类型和包装类java类型转换

    对象在内存中的存储 对象头.实例数据和填充数据(为了对齐) 实例变量:存放类的属性数据信息,包括父类的属性信息,如果是数组的实例部分还包括数组的长度,这部分内存按4字节对齐. 填充数据:由于虚拟机要求 ...

  4. Java基本类型和包装类型总结

    1.Java的基本类型及其对应的包装器类 Java有8种基本类型:大致分为3类:字符,布尔,数值类型(在java中数值是不存在无符号的,这一点不像C/C++,他们的取值范围是固定的,不会随着机器硬件的 ...

  5. java 基本类型封装类,Java 八种基本类型和基本类型封装类-九五小庞

    Java 八种基本类型和基本类型封装类-九五小庞 1.首先,八种基本数据类型分别是:int.short.float.double.long.boolean.byte.char: 它们的封装类分别是:I ...

  6. java5引入包装类型的意义_Java中的基本类型和包装类

    Java中基本数据类型与包装类型有 基本类型 包装器类型 boolean Boolean char Character int Integer byte Byte short Short long L ...

  7. java包装类和基本类型谁先谁后_你知道Java中基本类型和包装类的区别吗

    前情提要 上一篇中,通过一道常见的面试题(即:String.StringBuilder.StringBuffer的区别),引申到Java中基本类型和包装类的相关内容.在这一篇中,我们将解决上一篇中引申 ...

  8. TypeScript基础入门 - 接口 - 继承接口

    转载地址 TypeScript基础入门 - 接口 - 继承接口 项目实践仓库 https://github.com/durban89/typescript_demo.git tag: 1.0.13 为 ...

  9. java面向对象(类与对象,局部变量成员变量,基本类型和引用类型作为参数传递)...

    一.类和对象的区别 类是对某一类事物的抽象描述,而对象用于表示现实中该类事物的个体 可以将玩具模型看作是一个类,将一个个玩具看作对象,从玩具模型和玩具之间的关系便可以看出类与对象之间的关系.类用于描述 ...

最新文章

  1. mysql数据库隐式表_详解MySQL数据库常见的索引问题:无索引,隐式转换,附实例说明...
  2. Dubbo 稳定性案例:Nacos 注册中心可用性问题复盘
  3. Coursera课程Python for everyone:Quiz: eXtensible Markup Language
  4. Spring Boot 多模块项目实践(附打包方法)
  5. WebDriver自动化测试框架详解
  6. No buffer space available
  7. 编程面试题之——简答题(持续更新...)
  8. 使用FTP下载文件connect.retrieveFileStream(filename) 获取不到InputStream流,返回null的问题
  9. 以张鸿蒙系统的手机,搭载鸿蒙系统的手机真的要来了?因为别无选择,所以唯有向前!...
  10. JavaBean在jsp中的使用
  11. mysql删除用户密码_MySQL 创建用户、授权用户、撤销用户权限、更改用户密码、删除用户(实用技巧)...
  12. 怎么登录微信公众号-微信公众号使用教程2
  13. 【中国数据创新琅琊榜】萨纳斯大数据实验室,高校大数据教学、实训、人才培养的最佳选择!
  14. 读叔本华之《人生的智慧》
  15. MySQL生成36位、32位UUID以及32位大写的UUID
  16. JAVA的诞生及版本
  17. 【python-opencv】灰度图和彩色图的互相转换
  18. 惠普HP LaserJet Pro M15a 打印机驱动
  19. 歌德巴赫猜想:任意一个大于等于6的偶数都能拆分为2个质数之和:如:8=3+5 求证6到1000内的所有偶数都成立
  20. 按键精灵自动登录网站范例源码

热门文章

  1. php 405,php Restler 405 Method Not Allowed 问题解决啦,restlerallowed_PHP教程
  2. ps怎么一下选中多个图层_ps新手入门之蒙版工具
  3. nodejs redis 发布订阅_「赵强老师」Redis的消息发布与订阅
  4. java 线程 handler,java.lang.RuntimeException:处理程序(android.os.Handler)在死线程上向处理程序发送消息...
  5. 优化服务器犯法吗,服务器稳定性对于SEO优化有什么影响
  6. python第四周测试答案_Python程序开发第四周作业
  7. shell进入特权模式_GRUB引导下进Linux单用户模式的三种方式,修改root密码
  8. arm微软服务器,ARM扬帆 借力微软 杀进服务器市场
  9. java对象的状态由什么表示_持久化层的Java对象可处于哪些状态?这些状态有哪些特征?...
  10. python中文显示不出来_彻底解决Python里matplotlib不显示中文的问题