TypeScript的类型及基本语法

// 安装

npm i typescript

局部安装: npm install -g typescript

命令行TS => JS :tsc greeter.ts

// tsc --init // 生成config.json
// 类型注解

即在greeter函数中接收到的数据应该是个string 而不是array(是对变量的类型的解释)

function greeter(person: string) {
    return "Hello, " + person
}
let user = [0, 1, 2];
document.body.innerHTML = greeter(user)

// 基础类型

// 布尔值

let isShow: Boolean = false

// 数字

为所有的浮点数,支持进制表示 的字面量:
let num:number = 4

// 字符串

let name:string = 'bob'

// 可以使用模板字符串
let name: string = `Gene`;
let age: number = 37;
let sentence: string = `Hello, my name is ${ name }.I'll be ${ age + 1 } years old next month.`;
// 数组
// 表示同一类型为数字的数组
let  list: number[ ] = [1, 2, 3]
let list: Array`` = [1, 2,  3]
// 元组Tuple

元组是一个固定长度和类型的数组

let list: [string, number]
x = ['something', 5]
console.log(list[0].substr(1))
// 当其访问一个位置索引的元素,或赋值,只能使用当前已定义的类型及方法
list[3] = 'world'
console.log(list[4],toString())  // 'string' 和 'number' 都有 toString方法
// 枚举 enum

enum 类型是对JavaScript标准数据类型的一个补充; 像c#等其他语言一样,使用枚举类型可以为一组数值赋予有好的名字

enum Color {red, green, blue}

ler c: Color = Color.green // 指将c的赋值为Color 中的green

enum中 还可以将数据中不以0为下标开始

// 定义枚举类: Color
enum Color {Red = 1, Green, Blue} // 声明的枚举类
let c: Color = Color.Green;
//  还可以完全自己定义下标
enum Color {Red = 1, Green = 2, Blue = 4}
let c: Color = Color.Green;

enum 亦可通过下标枚举值

enum Color {Red = 1, Green, Blue}
let colorName: string = Color[2];

console.log(colorName);  // 显示'Green'因为上面代码里它的值是2

// Any

Any 无法调用任意的方法

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'.

当你只知道一部分数据的类型时,any类型也是有用的。 比如,你有一个数组 => 即可使用数组的方法

let list: any[] = [1, true, "free"];
list[1] = 100;
// Void

Void类型是在一个函数没有返回值的类型; 声明一个void类型的变量没有什么大用,因为你只能为它赋予undefinednull

// null & undefined
// never

never表示永远不会返回结果

// unknown 类型

unknown 是一个类型校验的any类型

let e: unknown 
e = 'sss'
let s: string
if (typeof e === 'string') s = e
// s = e // 错误
// object 类型
let b: {} // let b: object
let c = { name: string, age: number }
// 在给 c 赋值时 必须 要有上边 name, age 的 值并且相对应
let d = { name: string, age ? : number | string  }
// d 中的 age 后面的 ? 表示 d 的 age 属性的值可以不给 | 或的意思
let e = { name: string, [propName: string]: any }
// e 中的 [propName: string]: any 表示可以在任意个属性名 值为 any 类型

// & 和 |

& : 的意思,用于两个对象的连接 ,连接后 是作为必传值不能单独赋值

let  person:{ name: string } & { age: number }
person = { name: 'Joke', age: 19 }

| : 的意思,一般用于对变量类型的判断

let person: object | array

// 类型断言:

语法:

s = e as string

s = e

let e: unknown 
e = 'sss'
let s: string
 s = e as string

变量的声明跟赋值同时进行时,可以不标出类型

// 类型的别名

简化类型的使用

即: 就是用于一个已声明的类型来替代另一个未声明的类型

// 声明类型别名 
type newType = 1 | 2 | 3 | 4
let k = newType
let l = newType
 k = 1; k = 2; l = 1; l = 2;

你可能感兴趣的:(TypeScript的类型及基本语法)