目录
一、TypeScript 接口
1.TypeScript 接口的定义和简单使用
TypeScript 接口是一系列抽象方法的声明，是方法特征的集合，方法本身是抽象的，需要由具体的类去实现，然后第三方就可以通过这组抽象方法调用，让具体的类执行具体的方法。
-
interface onePerson {
-
personName:
string,
-
personPwd:
number,
-
speakTs:
() =>
string
-
}
-
let
oneUser: onePerson = {
-
personName:
"samxiaoguai",
-
personPwd:
123,
-
speakTs: ():
string => {
return
"Hello Ts" }
-
}
-
console.
log(oneUser.
personName)
-
console.
log(oneUser.
personPwd)
-
console.
log(oneUser.
speakTs())
-
// samxiaoguai
-
// 123
-
// Hello Ts
2.联合类型和接口
在接口中使用联合类型
-
interface twoPerson {
-
personName:
string;
-
personPwd:
string[] |
number | (
() =>
number);
-
}
-
let
oneUser1: twoPerson = {
personName:
"test1",
personPwd:
1 };
-
console.
log(oneUser1)
//{ personName: 'test1', personPwd: 1 }
-
let
oneUser2: twoPerson = {
personName:
"test1",
personPwd: [
"1",
"2"] };
-
console.
log(oneUser2)
//{ personName: 'test1', personPwd: 1 }
-
let
oneUser3: twoPerson = {
personName:
"test1",
personPwd:
() => {
return
1; } };
-
console.
log(oneUser3)
//{ personName: 'test1', personPwd: [Function: personPwd] }
-
let
returnPersonPwd:
any = oneUser3.
personPwd;
-
console.
log(
returnPersonPwd())
//1
3.接口和数组
接口中可以将数组的索引值和元素设置为不同类型，索引值可以是数字或字符串。
-
interface strlist {
-
[
index:
number]:
string
-
}
-
let
list1: strlist = [
"a",
"b",
"c"]
-
console.
log(list1)
//[ 'a', 'b', 'c' ]
-
-
interface numlist {
-
[
index:
string]:
number
-
}
-
let
list2: numlist = {};
-
list2[
"a"] =
1
-
console.
log(list2)
//{ a: 1 }
4.接口继承
接口可以通过继承其他接口来扩展自己，关键字使用extends
-
interface personName {
-
personName:
string
-
}
-
interface person3
extends personName {
-
personPwd:
number
-
}
-
let oneUser4 = <person3>{};
-
oneUser4.
personName =
"samxiaoguai";
-
oneUser4.
personPwd =
123;
-
console.
log(oneUser4)
//{ personName: 'samxiaoguai', personPwd: 123 }
(1)单继承
-
interface personName {
-
personName:
string
-
}
-
interface person3
extends personName {
-
personPwd:
number
-
}
-
let oneUser4 = <person3>{};
-
oneUser4.
personName =
"samxiaoguai";
-
oneUser4.
personPwd =
123;
-
console.
log(oneUser4)
//{ personName: 'samxiaoguai', personPwd: 123 }
(2)多继承
-
interface personName {
-
personName:
string
-
}
-
interface personPwd {
-
personPwd:
number
-
}
-
interface person4
extends personName, personPwd { };
-
let
oneUser5: person4 = {
personName:
"samxiiaoguai",
personPwd:
123 }
-
console.
log(oneUser5)
//{ personName: 'samxiiaoguai', personPwd: 123 }
二、TypeScript 类
1.TypeScript 类的定义和简单使用
TypeScript类描述了所创建的对象共同的属性和方法
定义类的关键字为 class，后面紧跟类名，类主要包含以下几个模块（类的数据成员）：
(1)字段 − 字段是类里面声明的变量。字段表示对象的有关数据。
(2)构造函数 − 类实例化时调用，可以为类的对象分配内存。
(3)方法 − 方法为对象要执行的操作。
-
class
onePersonClass {
-
// 字段
-
name:
string;
-
// 构造函数
-
constructor(
name: string) {
-
this.
name = name
-
}
-
// 方法
-
userName():
void {
-
console.
log(
"名称为:" +
this.
name)
-
}
-
}
-
let onePeopleObj =
new
onePersonClass(
"samxiaoguai")
-
console.
log(onePeopleObj.
name);
//samxiaoguai
-
console.
log(onePeopleObj.
userName());
//名称为:samxiaoguai
2.TypeScript 类继承
TypeScript 支持继承类，即我们可以在创建类的时候继承一个已存在的类，这个已存在的类称为父类，继承它的类称为子类。
类继承使用关键字 extends，子类除了不能继承父类的私有成员(方法和属性)和构造函数，其他的都可以继承。
TypeScript 一次只能继承一个类，不支持继承多个类，但 TypeScript 支持多重继承（A 继承 B，B 继承 C）。
-
class
onePersonClass2
extends
onePersonClass {
-
userName():
void {
-
console.
log(
"名称为:" +
this.
name)
-
}
-
-
}
-
let onePeopleObj2 =
new
onePersonClass(
"samxiaoguai")
-
console.
log(onePeopleObj2.
name);
//samxiaoguai
-
console.
log(onePeopleObj2.
userName());
//名称为:samxiaoguai
-
-
class
onePersonClass3
extends
onePersonClass2 {
-
userName():
void {
-
console.
log(
"名称为:" +
this.
name)
-
}
-
-
}
-
let onePeopleObj3 =
new
onePersonClass(
"samxiaoguai")
-
console.
log(onePeopleObj3.
name);
//samxiaoguai
-
console.
log(onePeopleObj3.
userName());
//名称为:samxiaoguai
3.TypeScript 类继承的方法重写
-
class
fatherClass {
-
fatherStr:
string;
-
// 构造函数
-
constructor(
fatherStr: string) {
-
this.
fatherStr = fatherStr
-
}
-
doPrint():
void {
-
console.
log(
"父类的 doPrint() 方法。")
-
}
-
}
-
class
childClass
extends
fatherClass {
-
doPrint():
void {
-
super.
doPrint()
// 调用父类的函数
-
console.
log(
"子类的 doPrint()方法。")
-
}
-
}
-
let oneObj =
new
childClass(
"fatherS");
-
console.
log(oneObj.
doPrint());
-
// 父类的 doPrint() 方法。
-
// 子类的 doPrint()方法。
4.TypeScript 类static 关键字
static 关键字用于定义类的数据成员（属性和方法）为静态的，静态成员可以直接通过类名调用。
-
class
staticCalss {
-
static
staticname:
string;
-
static
disp():
void {
-
console.
log(
"name:"+staticCalss.
staticname)
-
}
-
}
-
staticCalss.
staticname =
"samxiaoguai"
-
console.
log(staticCalss.
staticname)
//samxiaoguai
-
console.
log(staticCalss.
disp())
//name:samxiaoguai
5.TypeScript instanceof 运算符
instanceof 运算符用于判断对象是否是指定的类型，如果是返回 true，否则返回 false。
-
class
insCalss{ }
-
class
noinsCalss{ }
-
let obj =
new
insCalss()
-
let isInsCalss = obj
instanceof insCalss;
-
console.
log(isInsCalss);
-
isInsCalss = obj
instanceof noinsCalss;
-
console.
log(isInsCalss);
-
// true
-
// false
7.TypeScript 访问控制修饰符
TypeScript 中，可以使用访问控制符来保护对类、变量、方法和构造方法的访问。TypeScript 支持 3 种不同的访问权限。
(1)public（默认） : 公有，可以在任何地方被访问。
(2)protected : 受保护，可以被其自身以及其子类访问。
(3)private : 私有，只能被其定义所在的类访问。
-
class
encapsulateClass {
-
str1:
string =
"hello"
-
private
str2:
string =
"ts"
-
protected
str3:
string =
"ts"
-
doPrint():
void {
-
console.
log(
"str2:" +
this.
str2);
-
console.
log(
"str3:" +
this.
str3);
-
-
}
-
}
-
-
let encapsulateobj =
new
encapsulateClass()
-
console.
log(encapsulateobj.
str1)
// 可访问
-
console.
log(encapsulateobj.
doPrint())
-
// console.log(encapsulateobj.str3) // 编译错误 属性“str3”受保护，只能在类“encapsulateClass”及其子类中访问
-
// console.log(encapsulateobj.str2) // 编译错误， str2 是私有的
-
// hello
-
// str2:ts
-
// str3:ts
8.TypeScript 类和接口
类可以实现接口，使用关键字 implements，并将其字段作为类的属性使用。
-
interface oneInter {
-
num:
number
-
}
-
class
oneInterCalss
implements oneInter {
-
num:
number
-
name:
string
-
constructor(
num: number, name: string) {
-
this.
name = name
-
this.
num = num
-
}
-
}
-
let objInter =
new
oneInterCalss(
666,
"samxiaoguai")
-
console.
log(objInter)
//oneInterCalss { name: 'samxiaoguai', num: 666 }
有问题可以在下面评论，我会为大家解答。
转载：https://blog.csdn.net/samxiaoguai/article/details/128404199
查看评论