TypeScript初识——基于Java、Android开发体系

一 概要

本文不是全体系知识介绍，只是在了解TS语言的时候自己的一些对比及思考。（有些理解可能有问题，望斟酌。）
参考的文章：
link1
link2

二 对比与思考

1.TS是JS么

是它的超集（可以认为是封装的DSL），TS最终是编译程JS来工作。从这点来看，能使用TS的项目，也是能使用JS的，JS是根基。

TS是用来干什么的？
JS是用来干什么的呢。

为什么要有TS
因为JS太过于灵活，给它加上约束后编写就会更加容易。

2.作用域

const a: string = 'apple'

单独写在一个文件中，可以认为是全局静态变量，但不同的是，a是唯一的，可以认为“全局静态”这个作用域点变量是唯一的。这意味着，不能在其他的文件中也这样编码。要么：

• 让其在function中定义，使其成为局部变量（作用域在function）
• 文件采用export，这样文件的作用域就不是全局，而是这个“文件模块的作用域”

let、var、const

TS中使用了let来替换var声明变量。

为什么要用let？

因为var的作用域容易让人搞混乱，它太灵活了。使用let后，可以认作其使用方式与Java（Koltin）声明变量一致。

展开

let defaults = {
    food: "spicy", price: "$$", ambiance: "noisy" };
let search = {
    ...defaults, food: "rich" };
//search的值为{ food: "rich", price: "$$", ambiance: "noisy" }

...变量的写法就是展开——>临时生成扩增变量的对象。

3.类型

原始类型(Primitive Types)

string、number、boolean

object类型（object Types）
万物皆对象，所有非原始类型的类型。（object表示非原始类型，也就是除number，string，boolean，symbol，null或undefined之外的类型。）

// 函数
const fn: object = function () {
   }

// 普通对象
const obj: object = {
   }

// 数组
const arr: object = []

any类型
any的使用范围比object更大。

在对现有代码进行改写的时候，any类型是十分有用的，它允许你在编译时可选择地包含或移除类型检查。 你可能认为 Object有相似的作用，就像它在其它语言中那样。 但是 Object类型的变量只是允许你给它赋任意值 - 但是却不能够在它上面调用任意的方法，即便它真的有这些方法：

let notSure: any = 4;
notSure.ifItExists(); // okay, ifItExists might exist at runtime
notSure.toFixed(); // okay, toFixed exists (but the compiler doesn't check)

let prettySure: Object = 4;
prettySure.toFixed(); // Error: Property 'toFixed' doesn't exist on type 'Object'.

简而言之，object无法跳过编译器检查，any可以。

元组类型（Tuple Types）

//定义。元——>元素类型，组——>数组，合起来就是“各种元素类型的数组”
//案例中给到两种类型，对应的赋值也是对应了类型，其类同Java中的List<Object>，只不过它更明确了数组中每个元素下标对应的类型和对应关系。
const tuple: [number, string] = [18, 'zhangsan']

//解构。既然已经知道了明确对应关系，“反向推导”——>解构出对应的值也是可以的。
const [age, name] = tuple

函数类型(Function Types)

function func (a: number, b:number = 10): string {
   
    return 'func1'
}

func(100)

使用过Kotlin的都知道怎么用，这是一样的。

3.类、接口、抽象类

与Java一致，修饰符的定义也是如此

1.接口

可变类型的接口、类

interface SquareConfig {
   
    color?: string;
    width?: number;
    [propName: string]: any;
}

具有color/width属性的接口，其他属性可变。

interface Counter {
   
    (start: number): string;
    interval: number;
    reset(): void;
}

function getCounter(): Counter {
   
    let counter = <Counter>function (start: number) {
    };
    counter.interval = 123;
    counter.reset = function () {
    }