TS学习之类
定义类
class Person {
name: string; //属性
constructor(_name: string) {
this.name = _name;
} //构造函数
sayHello(): string {
return "Hi,everyone"
} //方法
} let firstOne = new Person("Fred") //实例化类
继承:继承使用关键字extends,调用父类使用super,子类继承父类的属性和方法,并且子类可以改写父类的属性和方法
class Animal {
name: string;
constructor(_name: string) {
this.name = _name;
}
skinColour(color: string = "black"): void {
console.log(`${this.name} skin colour is ${color}`)
}
} class Horse extends Animal {
constructor(name: string) { super(name) }
skinColour(color: string = "brown"): void {
console.log(`I'am ${this.name}`);
super.skinColour("brown");
}
} let horse = new Horse("horse");
horse.skinColour()
// I'am horse
// horse skin colour is brown
public、private、protected、readonly
- public(不声明默认都为public,也可以显示的设置为public)
class Person {
public name: string; //属性
public constructor(_name: string) {
this.name = _name;
} //构造函数
public sayHello(): string {
return "Hi,everyone"
} //方法
} let firstOne = new Person("Fred") //实例化类
- private(private的成员不能被外部访问;比较带有
private
或protected
成员的类型时,两个类型兼容的条件是private或protected的成员必须相同切来至同一个声明(同一个类))
class Person {
private name: string;
public constructor(_name: string) {
this.name = _name;
}
} class Employee {
private name: string;
public constructor(_name: string) {
this.name = _name;
}
} let firstOne = new Person("Fred")
console.log(firstOne.name) //error: Property 'name' is private;
let lastOne = new Employee("Fred")
firstOne = lastOne // error: Type 'Employee' is not assignable to type 'Person'.Types have separate declarations of a private property 'name'.
- protected(protected和private相似,但protected成员可以在派生类中访问(能被继承,但不能在实例中访问,若构造函数是protected,则不能被实例化,只能被继承))
class Person {
protected name: string;
protected constructor(_name: string) {
this.name = _name;
}
} class Employee extends Person {
private department: string;
public constructor(name: string,department:string) {
super(name);
this.department = department;
}
} let Bob = new Person; //error: Constructor of class 'Person' is protected
let fred = new Employee("fred","test");
console.log(fred.name) //error: Property 'name' is protected
- readonly(设置属性为只读,必须在声明时或构造函数里初始化)
class Person {
readonly name: string;
constructor(_name: string) {
this.name = _name;
}
} let fred = new Person("fred");
fred.name = "Bob" //error: Cannot assign to 'name' because it is a constant or a read-only property.
参数属性(参数属性通过给构造函数参数添加一个访问限定符来声明(public,private,protected),把声明和赋值合并至一处)
class Person {
constructor(private name: string) { }
sayHello(): void {
console.log(`my name is ${this.name}`)
}
} let fred = new Person("fred");
fred.sayHello() //my name is fred
存取器(get、set 只带有 get
不带有set
的存取器自动被推断为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) {
console.log(employee.fullName);
}
静态属性(static,不能被实例访问,在类里面访问时,需要加上类名)
class Person {
static height:number = 180;
constructor(private name: string) { }
sayHello(): void {
console.log(`my name is ${this.name}, I height is ${Person.height}`)
}
} let fred = new Person("fred");
fred.sayHello() //my name is fred, I height is 180
抽象类(abstract,抽象类做为其它派生类的基类使用。 它们一般不会直接被实例化。抽象类中的抽象方法不包含具体实现并且必须在派生类中实现)
abstract class Person {
constructor(public name: string) { }
abstract sayHello():void;
} class Empoloy extends Person{
constructor(){
super("Fred")
}
sayHello(){
console.log(`my name is ${this.name}`)
}
} let firstOne = new Empoloy();
firstOne.sayHello(); //my name is Fred
TS学习之类的更多相关文章
- TS学习随笔(七)->声明文件
now我们来看一看TS怎么声明文件, 在JS里面我们经常会使用各种第三方类库,引入方式也不太相同,常见的就是在HTML中通过script标签引入,然后就可以使用全局变量$或者jQuery了 我们通常这 ...
- TS学习随笔(三)->接口
终于来到了比较重要的知识,接口,有多重要呢,反正是很重要好啵 在 TypeScript 中,我们使用接口(Interfaces)来定义对象的类型. 那什么是接口呢,在面向对象语言中,接口(Interf ...
- TS学习随笔(四)->数组的类型
少侠们,今天我们继续来搞一搞TS 今天我们要来看一看TS中数组的定义是个什么鬼样子 数组的类型: 在 TypeScript 中,数组类型有多种定义方式,比较灵活.下面我们来看看有哪些定义方法 「类型 ...
- TS学习随笔(一)->安装和基本数据类型
去年学过一段时间的TS,但由于在工作中不常用.就生疏了,最近项目要求用TS,那我就再回去搞搞TS,写一篇记录一下自己学习TS的进度以及TS知识点 首先,关于TS的定义我就不在这描述了,想看百度一下你就 ...
- TS学习
随着vue3.0的即将到来,是时候学习一下TS了 简介:TypeScript是一种由微软开发的自由和开源的编程语言.它是JavaScript的一个超集,而且本质上向这个语言添加了可选的静态类型和基于类 ...
- TS学习随笔(六)->断言
now,我们来看一看TS里面的断言,听起来很上档次啊,其实看完你就发出惊叹,这就是断言啊 类型断言 类型断言(Type Assertion)可以用来手动指定一个值的类型 语法 <类型>值 ...
- TS学习随笔(五)->函数
这篇文章我们来看一下TS里面的函数 函数声明 在 JavaScript 中,有两种常见的定义函数的方式——函数声明(Function Declaration)和函数表达式(Function Expre ...
- TS学习随笔(二)->类型推论,联合类型
这篇内容指南: -----类型推论 -----联合类型 类型推论 第一篇中我们看了TS的基本使用和基本数据类型的使用,知道了变量在使用的时候都得加一个类型,那我们可不可以不加呢,这个嘛 ...
- TS学习之for..of
for..of会遍历可迭代的对象,调用对象上的Symbol.iterator方法(可迭代对象,数组,字符串等) let arr = ["hello", "ts" ...
- TS学习之泛型
可以使用泛型来创建可重用的组件,一个组件可以支持多种类型的数据 不适用泛型的函数 function myfn(args: number): number { return args; } functi ...
随机推荐
- python基础18 ---多态与绑定方法
一.抽象类 1.抽象类的定义:从一堆类中抽象出相同的内容,重新组成一个新的类,这样的类属于抽象类. 2.香蕉类是一类水果,苹果类是一类水果,葡萄类是一类水果,但是他们都属于水果,从他们这些类中可以抽象 ...
- php中生成随机密码的自定义函数代码
这篇文章主要分享下php中生成随机密码的方法,原理就是把一些要生成的字符预置一个的字符串包括数字拼音之类的以及一些特殊字符,这样我们再随机取字符组成我们想要的随机密码了 代码一: 生成一个随机密码的函 ...
- js 动态加载事件的几种方法总结
本篇文章主要是对js 动态加载事件的几种方法进行了详细的总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助 有些时候需要动态加载javascript事件的一些方法往往我们需要在 JS 中动态添 ...
- js 数组的所有操作
js的数组操作有很多,这里记录了常用的和不常用的数组操作方法. 一.数组的创建 数组的创建有两种方法,一种是通过字面量,另一种是通过Array构造函数. 1.字面量 var num1 = [1,2,3 ...
- 斐波那契数列F(n)【n超大时的(矩阵加速运算) 模板】
hihocoder #1143 : 骨牌覆盖问题·一 时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 骨牌,一种古老的玩具.今天我们要研究的是骨牌的覆盖问题: 我们有一个 ...
- UESTC 1061 秋实大哥与战争 线段树区间合并
秋实大哥与战争 Time Limit: 3000/1000MS (Java/Others) Memory Limit: 65535/65535KB (Java/Others) 男儿何不带吴钩, ...
- bzoj 2005: [Noi2010]能量采集 筛法||欧拉||莫比乌斯
2005: [Noi2010]能量采集 Time Limit: 10 Sec Memory Limit: 552 MB[Submit][Status][Discuss] Description 栋栋 ...
- Storm- 使用Storm实现累积求和的操作
需求:1+2+3+... = ??? 实现方案: Spout发出数字作为input 使用Bolt来处理业务逻辑:求和 将结果输出到控制台 拓扑设计:DataSourceSpout -->SumB ...
- 封装 oschina.net 表情选择
1. [代码]jquery.facial.js //从OSCHINA.NET 提取出来的 表情选择 插件 by zhouxiang //如果有不满足的地方 可以自己改改 没事随便写写的 style 和 ...
- Jquery的ajax获取action中的返回值
js部分: function check() { $.ajax({ type : "POST", url : "myCloudWantseeListHD ...