gpt4 book ai didi

javascript - 如何使用 Typescript 的自定义方法实现类数组类?

转载 作者:行者123 更新时间:2023-11-30 08:31:33 25 4
gpt4 key购买 nike

我想实现一个类似数组的类:

  1. 接受数组作为构造函数的参数
  2. 应该是可迭代的并且具有所有内置数组的方法
  3. 有一些自定义方法
  4. 应该能够扩展其他类

我是这样看的:

class BaseModel {
arr: Array;

constructor(arr: Array<any>) { // <= req. #1
this.arr = arr;
}

serialize(arr) { // <= req. #3
this.arr = arr;
}
}

class ListModel extends BaseModel { // <= req. #4
constructor(arr: Array<any>) { // <= req. #1
super(arr);
}

sayHello() { // <= req. #3
console.log('hello');
}
}

let list = new ListModel([1,2,3]);
list.sayHello();
// expected output:
// 'hello'
list.push(4); // <= req. #2

for (let a of list) { // <= req. #2
console.log(a);
}
// expected output:
// 1
// 2
// 3
// 4
list.serialize([2,3]);

for (let a of list) {
console.log(a);
}
// expected output:
// 2
// 3

typescript 可以吗?我寻找解决方案,但没有找到更接近这些要求的东西。谢谢!

最佳答案

您可以扩展 Array类并通过建立要求 #2。
这是我认为符合您所有要求的实现:

class MyArray<T> extends Array<T> {
constructor(items?: T[]) {
super();
items && this.addItems(items);
}

public serialize(items: T[]): void {
this.splice(0, this.length);
this.addItems(items);
}

private addItems(items: T[]) {
items.forEach(item => this.push(item));
}
}

class StringsList extends MyArray<string> {
public sayHello(): void { // req. #3
console.log("hello");
}
}

class NumbersList extends MyArray<number> {
public sum(): number { // req. #3
return this.reduce((prev: number, current: number) => prev + current);
}
}

如果您不喜欢泛型部分,您可以简单地扩展 Array<any> .

Examples :

let arr1 = new MyArray(["hey", 4, true]);
console.log(arr1); // ["hey", 4, true]

arr1.push(99);
console.log(arr1); // ["hey", 4, true, 99]

arr1.forEach(item => console.log(item)); // hey, 4, true, 99

let arr2 = new StringsList(["str1", "str2"]);
console.log(arr2); // ["str1", "str2"]

arr2.serialize(["str3", "str4"]);
console.log(arr2); // ["str3", "str4"]

let arr3 = new NumbersList([1,2,3,4,5]);
console.log(arr3.sum()); // 15

关于javascript - 如何使用 Typescript 的自定义方法实现类数组类?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37159090/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com