Learning TypeScript中文版(1): TypeScript简介

作者: 麻辣阁 分类: TypeScript 发布时间: 2019-01-11 22:00

设计目标

  • 强类型语言,支持编译期的静态分析, 避免生成的 JavaScript代码错误
  • 与现存 JavaScript高度兼容: TypeScript 是 JS的超集, 因此几乎任何合法的 JS程序都是合法的 TS程序
  • 为大型项目提供构建机制: 通过提供类的对象,接口和模块这些特性,支持以更好的方式构建代码, 减少团队内代码集成时可能的问题, 通过 OOP原则和实践, 可以让代码更具可维护性和扩展性
  • 没有运行时的额外开销: 开发的TS代码会编译为 JS代码
  • 遵循 ES规范
  • 跨平台: 微软基于 Apache协议开源了 TypeScript, 支持主流操作系统平台

安装 TypeScript

  • 安装 Node.js
  • 全局安装 TypeScript
npm install -g typescript

数据类型

1. 原始类型

  • boolean: true, false
  • number: 和 JavaScript一样, 所有数字都是浮点数
  • string:文本
  • array:数组, 有两种声明方式
    • 在类型后加[]: var mylist:number[] = [1,2,3];
    • 使用泛型数组类型Array: var mylist:Array = [1,2,3];
  • enum
  • any: any 类型可以表示任意的 JavaScript 值. 使用 any 类型是与现存的 JavaScript 代码一起工作的一种高效的方式.
  • void: any 的对立面, 表示没有任何类型, 一般表示函数没有返回值

TypeScript 中没有 JS中的原始类型 undefined 和 null, 不能当类型使用.

JS中的 undefined 表示被声明但未被初始化的量;null可以赋予没有值的变量.

2. 联合类型

联合类型用来声明可以存储多种类型的变量:

var path:string | string[]

3. 类型别名

(略)

4.环境声明

(略)

运算符

  • 算数运算符: +,-,*,/,%(求余数并保留整数), ++, —
  • 比较运算符: 这里设 A的值为10, B的值为 20
    • >, >=, <, <=
    • ==, 比较两个运算元的值是否相等, A==’10’ 为 true
    • ===, 比较两个运算元的值与类型是否都相等, A===’10’ 为 false, 因为值相等但类型不一样
    • !==, 两个运算元的值和类型都不相等
  • 逻辑运算符: &&(与),||(或),!(非)
  • 位运算符(略)
  • 赋值运算符:=, +=,-=,*=,/=,%=

流程控制语句

  • 选择: if,else
  • 三元操作符(?): var message = isValid? “is valid”:”is not valid”
  • 多选结构:switch
  • 循环: while, do… while, for … in, for (var i:number =0;i<9’i++)

函数

和JS一样, TS支持具名和匿名函数:

function greet(name?:string):string{
    if(name){
        return "Hi!" + name;
    }
    else{
        return "Hi!";
    }
}

//匿名函数:
var greet2 = function (name?:string):string{
    if(name){
        return "Hi!" + name;
    }
    else{
        return "Hi!";
    }
}
//Hi!

//箭头函数:不使用function关键字
var greet3 = (name?:string):string => {
    if(name){
        return "Hi!" + name;
    }
    else{
        return "Hi!";
    }
}

console.log(greet("David")); //Hi!David
console.log(greet());//Hi!
console.log(greet2()); //Hi!
console.log(greet3("小明")); //Hi!小明

TS中声明类时, 所有的属性和方法默认都是公共的:

class  Character{
    fullname:string;

    constructor(firstname:string,lastname:string) {
        this.fullname = firstname + ' ' + lastname;
    }

    greet(name?:string){
        if(name){
            return "Hi!" + name + "! My name is " + this.fullname;
        }        
        else{
            return "Hi! My name is " + this.fullname;
        }
    }
}

var spark = new Character("Jack","Lee"); // Jack Lee
console.log(spark.greet()); // Hi! My name is Jack Lee
console.log(spark.greet("小明")); // Hi!小明! My name is Jack Lee

接口

在 TS中,可以使用接口来确保类拥有指定的结构.
(略)

命名空间

(略)

综合运用

(略)


发表评论

电子邮件地址不会被公开。 必填项已用*标注