typescript

Page 1 of 1

Archives

文件夹

1、第一步 让我们用我们通篇都用的这个例子来开始吧。我们将写一个最简单的验证器。就像当你检查一个用户给页面提交一个表单或检查外部提供的数据文件的格式时可能用到的那样。 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 interface StringValidator {     isAcceptable(s: string): boolean; } var lettersRegexp = /^[A-Za-z]+$/; var numberRegexp = /^[0-9]+$/; class LettersOnlyValidator implements StringValidator {     isAcceptable(s: string) […]

传统JavaScript关注功能和基于原型的继承为基本手段,建立可重用的组件,但这可能会觉得有点尴尬,对程序员来说当熟练使用面向对象的方法来开发时,类所继承的功能和对象是由其创建的。从ECMAScript 6,JavaScript程序员可以使用这种面向对象的基于类的方法构建应用程序。在typescript里,我们现在允许开发人员使用这些技术,无需等待下一个版本的JavaScript在所有主要的浏览器和平台JavaScript和编译它们。 1、类 让我们看看一个简单的基于类的例子: 1 2 3 4 5 6 7 8 9 10 11 class Greeter {     greeting: string;     constructor(message: string) {         this.greeting = message;     }     greet() {         return “Hello, ” + this.greeting;     } } var greeter = new Greeter(“world”); 如果你用过C#或java的话对于以上语法会很熟悉。我们声明了一个新类‘Greeter’,这个类有三个成员,一个属性‘greeting’,一个构造器,一个方法‘greet’。 你需要注意的是当指定类的一个成员时在前面加上‘this’,这表示,这是一个成员的访问。 在最后一行我们构造一个Greeter的实例使用“new”。这要求我们前面定义的构造函数,创建一个新对象的Greeter类型,并运行构造函数来初始化它。 2、继承 在 TypeScript,我们可以使用常见的面向对象模式。当然,基于类的编程是最基本的。模式之一是能够使用继承扩展现有的类来创建新的 让我们看一个例子: 1 2 3 4 5 6 7 8 9 […]

Typescript 的一个核心原则是类型检查关注于值的‘类型’。有时被称作‘鸭子类型’(duck typing)或‘结构类型’(structural subtyping)。在typescript里,接口扮演了命名这些类型的角色,同时也是在你的代码和链接你的外部工程里定义链接的有力方法。 1、我们的第一个接口interface 查看接口如何工作的最简单的方法是开始一个简单的实例: 1 2 3 4 5 6 function printLabel(labelledObj: {label: string}) {   console.log(labelledObj.label); } var myObj = {size: 10, label: “Size 10 Object”}; printLabel(myObj); 类型检查将检查调用‘printLable’。‘printLable’函数有一个带有原型‘lable’类型为字符串string的对象参数。需要注意的是我们传入的对象实属性际要比此要多,但是最终编辑器只是检查符合参数要求的那个属性。 我们再写一次同样的例子,这一次使用接口来描述此函数需要一个字符串类型的属性‘lable’: 1 2 3 4 5 6 7 8 9 10 interface LabelledValue {   label: string; } function printLabel(labelledObj: LabelledValue) {   console.log(labelledObj.label); } var myObj = {size: 10, […]

基础类型(Basic Types) 为了使程序正常工作,我们需要以下基本数据类型:numbers数字,structures结构,strings字符串,boolean布尔型值等等。在typescript中,通过注入一种方便的枚举类型来帮助typescript支持javascript同样的数据类型。 1、Boolean布尔型 Javascript和typeScript(其他语言同理)同样叫做布尔型‘boolean’的值只包含最简单的两个值真和假(true/false)。 1 var isDone: boolean = false;   2、Number数字 跟javaScript一样,typescript所有的数都是浮点数类型。这些浮点数获得类型‘number’。 1 var height: number = 6;   3、string字符串 另一种在网页和服务器端的基本数据类型是字符型数据。跟其他语言一样,我们用‘string’来表示字符类型的数据。跟javascript一样,typescript也是用单引号‘’或双引号“”来包裹字符串型数据。 1 2 var name: string = “bob”; name = ‘smith’;   4、Array数组 同样typescript也允许使用数组。数组类型可以用两种方法来表示。第一种使用元素的类型和后面紧跟的大括号‘[]’来表示素组每一个元素的类型: 1 var list:number[] = [1, 2, 3]; 第二种方法是使用一个通用数组类型,Array<elemType>: 1 var list:Array<number> = [1, 2, 3];   5、Enum枚举 一个对javascript很有用的附加标准数据类型是枚举类型’enum’,和C#一样,枚举类型是一种十分友好的给出名称和名称的值的方法。 1 2 […]

写在前面 本系列来自 @东北大客 http://14ms.net/ 的翻译,虽然没有全部翻译,但是仍然帮我我这种初学者且英语苦手的大忙。 我在东北大客翻译的基础上改了改错别字和一些描述上的问题,算是一点优化。 原文链接为:http://www.typescriptlang.org/   1、安装typescript支持 。 有两种主要方法获得typescript工具:通过node.js的包管理(npm),或者安装VS2012的TypeScript插件。 对于VS 2013用户,点击一下链接: Install TypeScript for Visual Studio 2013 对于NPM用户: 1 > npm install -g typescript   2、在编辑器(如webstrom)中新建greeter.ts文件,敲入一下代码:   1 2 3 4 5 6 7 function greeter(person) {     return “Hello, ” + person; } var user = “Jane User”; document.body.innerHTML = greeter(user);   3、编译TypeScript文件 以上文件使用 .ts为扩展名,但实际代码仍为 javascript。可以直接拷贝粘贴至现有的Javascript 程序中。 在命令行里键入 如下命令,运行 TypeScript 编译器 注:当前目录为greeter.ts的目录。 请完成以上步骤1,即已经安装了typeScript支持。 1 > tsc […]