携手创作,共同成长!这是我参与「掘金日新计划 · 8 月更文挑战」的第10天,点击查看活动详情
TypeScript 基础知识
(ps: 接着初学TypeScript系列( 二 ),继续学习TS相关基础知识 )
g. 元组(Tuple)
元组类型允许表示一个已知元素数量和类型的数组,各元素的类型不必相同。
let a: [string, number] = ['letter', 7];
//当访问一个已知索引的元素时,会得到正确的类型
console.log(a[0].substring(1)) // OK etter
console.log(a[1].substring(1)) // Error, "类型number”上不存在属性“substring”
//当添加元素时,它的类型会被限制为该元组的联合类型
let a: [string, number] = ['letter', 7];
a.push('male'); // OK
a.push(true); // Error,"类型boolean”的参数不能赋给类型“string | number”的参数。
h. 对象(object)
// 使用特定的对象类型注释声明一个名为 person 的变量
let person: {
name: string;
age: number;
};
// 给 person 分配一个具有所有必要属性和值类型的对象
person = {
name: 'Tani',
age: 17,
};
I. 类型断言
用来手动指定一个值的类型
语法:
尖括号语法: <类型>值
as语法 : 值 as 类型
// 类型断言 将 any 断言为一个具体的类型
let value: any = "a string";
let strLength: number = (value as string).length;
// 类型断言 将一个联合类型断言为其中一个类型
function getLength(x: number | string) {
if ((<string>x).length) {
return (x as string).length
} else {
return x.toString().length
}
}
console.log(getLength('abcd'), getLength(1234)) // '4' '4'
TypeScript 中的类
TypeScript 除了实现了 ES6 中的类的功能以外,还添加了一些新的用法。
使用
class定义类,使用constructor定义构造函数。通过
new生成新实例的时候,会自动调用构造函数。
//声明一个 Greeter 类
class Greeter {
// 声明属性
message: string
// 构造方法(构造函数)
constructor (message: string) {
this.message = message
}
// 一般方法
greet (): string {
return 'Hello ' + this.message
}
}
// 创建类的实例
const greeter = new Greeter('world')
// 调用实例的方法
console.log(greeter.greet()) // 'Hello world'
使用
extends关键字实现类的继承,子类中使用super关键字来调用父类的构造函数和方法。
class Animal {
name: string
constructor (name: string) {
this.name = name
}
cry () {
console.log('wang! wang!')
}
run (distance: number=0) {
console.log(`${this.name} run ${distance}m`)
}
}
class Dog extends Animal {
constructor (name: string) {
// 调用父类型构造方法
super(name)
}
// 重写父类型的方法
run (distance: number=100) {
super.run(distance)
}
}
const dog = new Dog('万岁')
dog.run()
dog.cry() // 可以调用从父中继承得到的方法
TypeScript 三种访问修饰符
用来描述类内部的属性/方法的可访问性
-
public修饰的属性或方法是公有的可以在任何地方被访问到,默认所有的属性和方法都是
public的 -
private修饰的属性或方法是私有的不能在声明它的类的外部访问,只能类内部可以访问
-
protected修饰的属性或方法是受保护的它和
private相似,区别是它在子类中允许被访问。类内部和子类可以访问
class Person {
private name: string; // 类的私有属性、外部访问不到
protected email: string; // 只能从这个类和子类中进行访问和修改
public age: number; // 任何地方都可以访问和修改
constructor(n: string, c: string, a: number) {
this.name = n;
this.email = c;
this.age = a;
}
sayHello() {
console.log(`Hi,我是 ${this.name} ,今年 ${this.age} 岁了`);
}
}
const person1 = new Person('ConardLi', 'conard@xx.com', 17);
person1.sayHello(); // 'Hi,我是 ConardLi ,今年 17 岁了'
console.log(person1.name); // 属性“name”为私有属性,只能在类“Person”中访问。
console.log(person1.email); // 属性“email”受保护,只能在类“Person”及其子类中访问。
console.log(person1.age); // 17