面向对象————TS

别指望了
131 阅读4分钟

接口

1.1 接口的定义

interface interface_name { 


}

1.2 接口的定义和使用的小例子

//其次，给接口创建一个对象，并且重写接口中的方法

//其次，给接口创建一个对象，并且重写接口中的方法
var customer:IPerson = {
    firstName:"wch",
    lastName:"hcw",
    sayHi:():string=>"我的名字是wch"
}

//使用接口对象

console.log("Customer 对象 ") 
console.log(customer.firstName) 
console.log(customer.lastName) 
console.log(customer.sayHi())

注意接口不能转换为 JavaScript

1.3 联合类型和接口

interface RunOptions { 
    program:string; 
    commandline:string[]|string|(()=>string); 
} 
 
// commandline 是字符串
var options:RunOptions = {program:"test1",commandline:"Hello"}; 
console.log(options.commandline)  
 
// commandline 是字符串数组
options = {program:"test1",commandline:["Hello","World"]}; 
console.log(options.commandline[0]); 
console.log(options.commandline[1]);  
 
// commandline 是一个函数表达式
options = {program:"test1",commandline:()=>{return "**Hello World**";}}; 
 
var fn:any = options.commandline; 
console.log(fn());

1.4 接口的继承

Child_interface_name extends super_interface_name

image.png

TypeScript 类

2.1 TypeScript 是面向对象的 JavaScript。类描述了所创建的对象共同的属性和方法。

TypeScript 支持面向对象的所有特性，比如 类、接口等

class class_name { 
    // 类作用域
}
  • 字段 − 字段是类里面声明的变量。字段表示对象的有关数据。
  • 构造函数 − 类实例化时调用，可以为类的对象分配内存。
  • 方法 − 方法为对象要执行的操作。

2.2 创建一个类试试

image.png

注意TypeScript 类中的构造函数是由constructor定义的。

2.3 创建实例化对象

我们使用 new 关键字来实例化类的对象

var object_name = new class_name([ arguments ])

类实例化时会调用构造函数

var obj = new Car("Engine 1")

类中的字段属性和方法可以使用 . 号来访问：

// 访问属性
obj.field_name 
// 访问方法
obj.function_name()

2.3 完整示例

image.png

image.png

2.4 类的继承

TypeScript 支持继承类，即我们可以在创建类的时候继承一个已存在的类，这个已存在的类称为父类，继承它的类称为子类。

类继承使用关键字 extends，子类除了不能继承父类的私有成员(方法和属性)和构造函数，其他的都可以继承。

TypeScript 一次只能继承一个类，不支持继承多个类，但 TypeScript 支持多重继承（A 继承 B，B 继承 C）

语法格式：

class child_class_name extends parent_class_name

示例：

image.png

2.4 继承类方法的重写 类继承后，子类可以对父类的方法重新定义，这个过程称之为方法的重写。

其中 super 关键字是对父类的直接引用，该关键字可以引用父类的属性和方法。

image.png

2.5 static关键字

static 关键字用于定义类的数据成员（属性和方法）为静态的，静态成员可以直接通过类名调用。

image.png 类可以实现接口，使用关键字 implements，并将 interest 字段作为类的属性使用。

2.6 类和接口

interface ILoan { 
   interest:number 
} 
 
class AgriLoan implements ILoan { 
   interest:number 
   rebate:number 
   
   constructor(interest:number,rebate:number) { 
      this.interest = interest 
      this.rebate = rebate 
   } 
} 
 
var obj = new AgriLoan(10,1) 
console.log("利润为 : "+obj.interest+"，抽成为 : "+obj.rebate )

// 利润为 : 10，抽成为 : 1

TypeScript 对象

对象是包含一组键值对的实例。 值可以是标量、函数、数组、对象等，如下实例：

var sites = { 
   site1:"Apple", 
   site2:"Google" 
}; 
// 访问对象的值
console.log(sites.site1) 
console.log(sites.site2)

3.1 TypeScript 类型模板

var sites = { 
    site1:"Apple", 
    site2:"Google",
}; 
var invokesites = function(obj: { site1:string, site2 :string }) { 
    console.log("site1 :"+obj.site1) 
    console.log("site2 :"+obj.site2) 
} 
invokesites(sites)

4 TypeScript 泛型

泛型（Generics）是一种编程语言特性，允许在定义函数、类、接口等时使用占位符来表示类型，而不是具体的类型。

泛型是一种在编写可重用、灵活且类型安全的代码时非常有用的功能。

使用泛型的主要目的是为了处理不特定类型的数据，使得代码可以适用于多种数据类型而不失去类型检查。

泛型的优势包括：

  • 代码重用： 可以编写与特定类型无关的通用代码，提高代码的复用性。
  • 类型安全： 在编译时进行类型检查，避免在运行时出现类型错误。
  • 抽象性： 允许编写更抽象和通用的代码，适应不同的数据类型和数据结构。

T: 代表 "Type"，是最常见的泛型类型参数名。

function identity<T>(arg: T): T {
    return arg;
}

K, V: 用于表示键（Key）和值（Value）的泛型类型参数。

interface KeyValuePair<K, V> {
    key: K;
    value: V;
}

4.1 泛型函数

function identity<T>(arg: T): T {
    return arg;
}

// 使用泛型函数
let result = identity<string>("Hello");
console.log(result); // 输出: Hello

let numberResult = identity<number>(42);
console.log(numberResult); // 输出: 42

4.2 泛型接口

// 基本语法
interface Pair<T, U> {
    first: T;
    second: U;
}

// 使用泛型接口
let pair: Pair<string, number> = { first: "hello", second: 42 };
console.log(pair); // 输出: { first: 'hello', second: 42 }

4.3 泛型与默认值

// 基本语法
function defaultValue<T = string>(arg: T): T {
    return arg;
}

// 使用带默认值的泛型函数
let result1 = defaultValue("hello"); // 推断为 string 类型
let result2 = defaultValue(42);      // 推断为 number 类型
avatar
文章
阅读
粉丝