解构赋值
数组解构
let input = [1, 2]; let [first, second] = input; console.log(first); // outputs 1 console.log(second); // outputs 2
上面的写法等价于:
first = input[0]; second = input[1];
利用解构赋值交换变量:
[first, second] = [second, first];
函数参数解构:
function f ([first, second]: [number, number]) [ console.log(first) console.log(second) ] f(1, 2)
解构剩余参数:
let [first, ...rest] = [1, 2, 3, 4] console.log(first) // 1 console.log(rest) // [2, 3, 4]
也可以忽略其它参数:
let [first] = [1, 2, 3, 4]; console.log(first); // outputs 1
或者跳过解构:
let [, second, , fourth] = [1, 2, 3, 4]
对象解构
示例一:
let o = { a: "foo", b: 12, c: "bar" }; let { a, b } = o;
就像数组解构,你可以用没有声明的赋值:
let a: number, b: number; ({a, b} = {a: 123, b: 456}) console.log(a, b) // 123 456
你可以在对象里使用 ...
语法创建剩余变量:
let { a, ...passthrough } = o; let total = passthrough.b + passthrough.c.length;
属性解构重命名
你也可以给属性以不同的名字:
let { a: newName1, b: newName2 } = o;
注意,这里的冒号不是指示类型的。 如果你想指定它的类型, 仍然需要在其后写上完整的模式。
let {a, b}: {a: string, b: number} = o;
默认值
function keepWholeObject(wholeObject: { a: string, b?: number }) { let { a, b = 1001 } = wholeObject; }
展开操作符
- 展开数组
- 展开对象
- 不会展开方法
解构赋值用于函数声明
type C = {a: string, b?: number} function f ({a, b}: C): void { // ... }
解构赋值用于加载指定模块成员
类
基本示例
class Person { name: string; age: number; constructor(name: string, age: number) { this.name = name; this.age = age; } sayHello() { console.log(this.name); } } let zs: Person = new Person('张三', 18);
构造函数
继承
class Animal { move(distanceInMeters: number = 0) { console.log(`Animal moved ${distanceInMeters}m.`); } } class Dog extends Animal { bark() { console.log('Woof! Woof!'); } } const dog = new Dog(); dog.bark(); dog.move(10); dog.bark();
这个例子展示了最基本的继承:类从基类中继承了属性和方法。 这里, Dog
是一个 派生类,它派生自 Animal
基类,通过 extends
关键字。 派生类通常被称作 子类,基类通常被称作 超类。
因为 Dog
继承了 Animal
的功能,因此我们可以创建一个 Dog
的实例,它能够 bark()
和 move()
。
下面是一个更复杂的例子:
class Animal { name: string; constructor(theName: string) { this.name = theName; } move(distanceInMeters: number = 0) { console.log(`${this.name} moved ${distanceInMeters}m.`); } } class Snake extends Animal { constructor(name: string) { super(name); } move(distanceInMeters = 5) { console.log("Slithering..."); super.move(distanceInMeters); } } class Horse extends Animal { constructor(name: string) { super(name); } move(distanceInMeters = 45) { console.log("Galloping..."); super.move(distanceInMeters); } } let sam = new Snake("Sammy the Python"); let tom: Animal = new Horse("Tommy the Palomino"); sam.move(); tom.move(34);
与前一个例子的不同点是,派生类包含了一个构造函数,它 必须调用 super()
,它会执行基类的构造函数。 而且,在构造函数里访问 this
的属性之前,我们 一定要调用 super()
。 这个是TypeScript强制执行的一条重要规则。
这个例子演示了如何在子类里可以重写父类的方法。 Snake
类和 Horse
类都创建了 move
方法,它们重写了从Animal
继承来的 move
方法,使得 move
方法根据不同的类而具有不同的功能。 注意,即使 tom
被声明为Animal
类型,但因为它的值是 Horse
,调用 tom.move(34)
时,它会调用 Horse
里重写的方法:
Slithering... Sammy the Python moved 5m. Galloping... Tommy the Palomino moved 34m.
实例成员访问修饰符
public
开放的
- 默认为
public
class Animal { public name: string; public constructor(theName: string) { this.name = theName; } public move(distanceInMeters: number) { console.log(`${this.name} moved ${distanceInMeters}m.`); } }
private
私有的
- 不能被外部访问,只能在类的内部访问使用
- 私有成员不会被继承
class Person { public name: string; public age: number = 18; private type: string = 'human' public constructor (name, age) { this.name = name this.age = age } }
protected
受保护的
- 和
private
类似,但是可以被继承
class Person { protected name: string; constructor(name: string) { this.name = name; } } class Employee extends Person { private department: string; constructor(name: string, department: string) { super(name) this.department = department; } public getElevatorPitch() { return `Hello, my name is ${this.name} and I work in ${this.department}.`; } } let howard = new Employee("Howard", "Sales"); console.log(howard.getElevatorPitch()); console.log(howard.name); // 错误
注意,我们不能在 Person
类外使用 name
,但是我们仍然可以通过 Employee
类的实例方法访问,因为Employee
是由 Person
派生而来的。
readonly
只读的
在参数中使用修饰符
在上面的例子中,我们不得不定义一个受保护的成员 name
和一个构造函数参数 theName
在 Person
类里,并且立刻给 name
和 theName
赋值。 这种情况经常会遇到。 参数属性可以方便地让我们在一个地方定义并初始化一个成员。
class Person { name: string; age: number; constructor(name: string, age: number) { this.name = name; this.age = age; } }
可以简写为:
class Person { constructor(public name: string, public age: number) { } }
属性的存(get)取(set)器
let passcode = "secret passcode"; class Employee { // 私有成员,外部无法访问 private _fullName: string; // 当访问 实例.fullName 的时候会调用 get 方法 get fullName(): string { return this._fullName; } // 当对 实例.fullName = xxx 赋值的时候会调用 set 方法 set fullName(newName: string) { if (passcode && passcode == "secret passcode") { this._fullName = newName; } else { console.log("Error: Unauthorized update of employee!"); } } } let employee = new Employee(); employee.fullName = "Bob Smith"; if (employee.fullName) { alert(employee.fullName); }
静态成员
- 不需要实例化访问的成员称之为静态成员,即只能被类访问的成员
static
关键字
class Grid { static origin = {x: 0, y: 0}; calculateDistanceFromOrigin(point: {x: number; y: number;}) { let xDist = (point.x - Grid.origin.x); let yDist = (point.y - Grid.origin.y); return Math.sqrt(xDist * xDist + yDist * yDist) / this.scale; } constructor (public scale: number) { } } let grid1 = new Grid(1.0); // 1x scale let grid2 = new Grid(5.0); // 5x scale console.log(grid1.calculateDistanceFromOrigin({x: 10, y: 10})); console.log(grid2.calculateDistanceFromOrigin({x: 10, y: 10}));
来源:https://www.cnblogs.com/ygjzs/p/12215471.html