打开网站图片弹入指定位置代码网赌网站怎么做的

一、简介

1.类（class）是面向对象编程的基本构件，封装了属性和方法

1.1、属性的类型：类的属性可以在顶层声明，也可以在构造方法内部声明，如果不给出类型；TypeScript 会认为x和y的类型都是any；如果声明时给出初值，可以不写类型，TypeScript 会自行推断属性的类型；

class Point {x:number;y:number;
}

 1.1.1.TypeScript 有一个配置项strictPropertyInitialization，只要打开（默认是打开的），就会检查属性是否设置了初值，如果没有就报错

// 打开 strictPropertyInitialization
class Point {x: number; // 报错y: number; // 报错
}// 如果类的顶层属性不赋值，就会报错。如果不希望出现报错，可以使用非空断言。
class Point {x!: number;y!: number;
}
// 属性x和y没有初值，但是属性名后面添加了感叹号，表示这两个属性肯定不会为空，所以TypeScript
//就不报错了

1.2、readonly 修饰符：属性名前面加上 readonly 修饰符，就表示该属性是只读的。实例对象不能修改这个属性（构造方法内部设置只读属性的初值，修改只读属性的值都是可以的）

1.2.1. readonly 属性的初始值，可以写在顶层属性，也可以写在构造方法里面

// 构造方法内部设置只读属性的初值，这是可以的
class A {readonly id:string; constructor() {this.id = 'bar'; // 正确}
}class A {readonly id:string = 'foo';constructor() {this.id = 'bar'; // 正确}
}
// 构造方法修改只读属性的值也是可以的。或者说，如果两个地方都设置了只读属性的值，以构造方法
//为准。在其他方法修改只读属性都会报错

1.3、方法的类型：类的方法就是普通函数，类型声明方式与函数一致

class Point {x:number;y:number;constructor(x:number, y:number) {this.x = x;this.y = y;}add(point:Point) {return new Point(this.x + point.x,this.y + point.y);}
}
// 构造方法constructor()和普通方法add()都注明了参数类型，但是省略了返回值类型，因为 
//TypeScript 可以自己推断出来

1.3.1.类的方法跟普通函数一样，可以使用参数默认值，以及函数重载。

class Point {x: number;y: number;constructor(x = 0, y = 0) {this.x = x;this.y = y;}
}// 下面是函数重载的例子
class Point {constructor(x:number, y:string);constructor(s:string);constructor(xs:number|string, y?:string) {// ...}
}

1.3.2.构造方法不能声明返回值类型，否则报错，因为它总是返回实例对象

class B {constructor():object { // 报错：构造方法声明了返回值类型object，导致报错// ...}
}

1.4、存取器方法：取值器用来读取属性，存值器用来写入属性

class C {_name = '';get name() {return this._name;}set name(value) {this._name = value;}
}
// get name()是取值器，其中get是关键词，name是属性名。外部读取name属性时，实例对象会
//自动调用这个方法，该方法的返回值就是name属性的值// set name()是存值器，其中set是关键词，name是属性名。外部写入name属性时，实例对象会
//自动调用这个方法，并将所赋的值作为函数参数传入

1.4.1.TypeScript 对存取器有以下规则

a、如果某个属性只有get方法，没有set方法，那么该属性自动成为只读属性

class C {_name = 'foo';get name() {return this._name;}
}const c = new C();
c.name = 'bar'; // 报错

b、TypeScript 5.1 版之前，set方法的参数类型，必须兼容get方法的返回值类型，否则报错。

// TypeScript 5.1 版之前
class C {_name = '';get name():string {  // 报错因为set参数类型必须兼容get返回值类型，在此不兼容return this._name;}set name(value:number) {this._name = String(value);}
}// set方法的参数类型（number|string）兼容get方法的返回值类型（string），这是允许的
class C {_name = '';get name():string {return this._name;}set name(value:number|string) {this._name = String(value);}
}
// TypeScript 5.1 版做出了改变，现在两者可以不兼容

c、get方法与set方法的可访问性必须一致，要么都为公开方法，要么都为私有方法。

1.5、属性索引：类允许定义属性索引

class MyClass {[s:string]: boolean |((s:string) => boolean);get(s:string) {return this[s] as boolean;}
}
// [s:string]表示所有属性名类型为字符串的属性，它们的属性值要么是布尔值，要么是返回
//布尔值的函数

1.5.1.由于类的方法是一种特殊属性（属性值为函数的属性），所以属性索引的类型定义也涵盖了方法。如果一个对象同时定义了属性索引和方法，那么前者必须包含后者的类型。

class MyClass {[s:string]: boolean;f() { // 报错return true;}
}//上例的属性索引的类型里面不包括方法，导致后面的方法f()定义直接报错；正确的写法如下class MyClass {[s:string]: boolean | (() => boolean);f() {return true;}
}