Typescript 学习 - 类
class
class 并不是一种新的数据结构,只是在函数原型基础上的语法糖
class People {
hand: number;
constructor(hand: number) {
this.hand = hand;
}
getHandNum(): void {
console.log(this.hand)
}
}
转为 js
var People = /** @class */ (function () {
function People(hand) {
this.hand = hand;
}
People.prototype.getHandNum = function () {
console.log(this.hand);
};
return People;
}());
extends 派生类
派生类包含了一个构造函数,它 必须调用 super()
,它会执行基类的构造函数。 而且,在构造函数里访问 this 的属性之前,我们 一定要调用 super()
。 这个是TypeScript强制执行的一条重要规则。
public、private、protected 区别
- public 是默认值,公有的
- private 是私有的,继承或者实例化都不能访问
- protected 是保护类型的,继承可以访问,实例化不行
class Animal {
private hand: string;
constructor(hand) {
this.hand = hand;
}
}
let dog = new Animal('abc');
// 会报错 Property 'hand' is private and only accessible within class 'Animal'.
dog.hand;
存取器
自定义原型上方法的 get 和 set ,如果只定义 get 的话,会被 ts 推断为 readonly
let passcode = "secret passcode";
class Employee {
private _fullName: string;
get fullName(): string {
return this._fullName;
}
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);
}
转为js
var passcode = "secret passcode";
var Employee = /** @class */ (function () {
function Employee() {
}
// 重写函数原型上的 get 和 set
Object.defineProperty(Employee.prototype, "fullName", {
get: function () {
return this._fullName;
},
set: function (newName) {
if (passcode && passcode == "secret passcode") {
this._fullName = newName;
}
else {
console.log("Error: Unauthorized update of employee!");
}
},
enumerable: true, // 属性是否可枚举
configurable: true // 属性是否可配置
});
return Employee;
}());
var 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) { }
}
转为 js
var Grid = function(){
this.origin = {x: 0, y: 0};
}
Grid.prototype.calculateDistanceFromOrigin = () => {
let xDist = (point.x - Grid.origin.x);
let yDist = (point.y - Grid.origin.y);
return Math.sqrt(xDist * xDist + yDist * yDist) / this.scale;
}
Grid.origin = {x: 0, y: 0};
抽象类 abstract
abstract class ParentClass {
// 抽象类中定义的抽象方法,必须在子类中实现
abstract ParentFun(): void;
}
实例的类型
class Greeter {
greeting: string;
constructor(greeting: string) {
this.greeting = greeting
}
onGreet() {
console.log(this.greeting);
}
}
// 实例的类型是 Greeter 类
let greet: Greeter;
greet = new Greeter('hello');
greet.onGreet();
把类当作接口使用
class Point {
x: number;
y: number;
}
interface Point3d extends Point {
z: number;
}
let point3d: Point3d = { x: 1, y: 2, z: 3 };
类可以创造出类型,所以可以在接口中使用类
什么情况用类或接口表示类型???
类ts转换代码是会转为function...
接口只是在编译的时候做的类型约定,不会转成任何代码
interface Point {
x: number;
y: number;
}
interface Point3d extends Point {
z: number;
}
let point3d: Point3d = { x: 1, y: 2, z: 3 };
转为 js
var point3d = { x: 1, y: 2, z: 3 };
参考文档
https://www.tslang.cn/docs/handbook/classes.html
https://www.tslang.cn/play/index.html
Typescript 学习 - 类的更多相关文章
- Typescript 学习笔记五:类
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
- Typescript 学习笔记四:回忆ES5 中的类
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
- Typescript学习笔记(四)class 类
typescript的类,与c#,java等语言的类类似.也是包含了一大部分的es6的实现.我会用最通俗的语言讲一下对coding有用的地方. class Greeter { greeting: st ...
- TypeScript学习笔记(四) - 类和接口
本篇将介绍TypeScript里的类和接口. 与其他强类型语言类似,TypeScript遵循ECMAScript 2015标准,支持class类型,同时也增加支持interface类型. 一.类(cl ...
- TypeScript学习指南--目录索引
关于TypeScript: TypeScript是一种由微软开发的自由和开源的编程语言.它是JavaScript的一个超集,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程. TypeS ...
- TypeScript 学习一 参数,函数,析构表达式
1,TypeScript是由谷歌开发的,并且新出的Angular2框架就是谷歌公司由TypeScript语言编写的,所以现在TypeScript是有微软和谷歌一起支持的: 2,TypeScript在j ...
- Typescript 学习笔记七:泛型
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
- Typescript 学习笔记六:接口
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
- Typescript 学习笔记二:数据类型
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
随机推荐
- ASP.NET Core Caching简介
在.NET Core中提供了Caching的组件.目前Caching组件提供了三种存储方式: Memory Redis SQLSever 1.Memeor Caching 新建一个ASP.NET Co ...
- crawler_app_在Airtest无线模式控制手机
无线模式开启: adb tcpip 48887 参考引用: https://www.cnblogs.com/xieqiankun/p/wireless-mode-of-poco.html
- 用Python爬E站本
用Python爬E站本 一.前言 参考并改进自 OverJerry 大佬的 教你怎么用Python爬取E站的本子_OverJerry. 本文为技术学习记录,不提供访问无存在网站的任何方法,也不包含不和 ...
- Python常用模块大全(转)
os模块:os.remove() 删除文件 os.unlink() 删除文件 os.rename() 重命名文件 os.listdir() 列出指定目录下所有文件 os.chdir() 改变当前工作目 ...
- HBase安装指南
一.事前准备 此安装是建立在hadoop集群运行起来的基础上,此hadoop版本为2.6.0,其他版本未测试,可能存在兼容性问题. 上传所需文件到/usr/local/soft 二.zookeep ...
- Django使用Mysql已存在数据表的方法
在mysql数据库中已经存在有数据的表,自己又不想删除,下面方法可以同步django中创建的表 1.最好将自己建的表名改为前缀和django自动创建表名前缀相同,不改也可以,但是后期表太多容易混乱 2 ...
- OAuth 2.0 的四种授权模式
RFC 6749 OAuth 2.0 的标准是 RFC 6749 文件.该文件先解释了 OAuth 是什么. OAuth 引入了一个授权层,用来分离两种不同的角色:客户端和资源所有者.......资源 ...
- django_restframework项目之python虚拟环境配置(一)
虚拟环境的搭建 优点 1.使不同应用开发环境相互独立 2.环境升级不影响其他应用,也不会影响全局的python环境 3.防止出现包管理混乱及包版本冲突 windows 安装 # 建议使用pip3安装到 ...
- mongo连接不上Timed out after 30000
本地连接mongo报错,错误代码为: Caused by: com.mongodb.MongoTimeoutException: Timed out after 30000 ms while wait ...
- elastalert基本配置说明
elastalert 配置语法: 简单rule规则: es_host,es_port:查询elasticsearch集群 name: 规则的唯一名称.如果相同,则elastalert不会启动. typ ...