javascript - 实现泛型类型的 Typescript 泛型类

Question

有没有办法把下面这段代码变成通用的 typescript 代码？我想要一个实现某些接口(interface) A 的类，它采用 A 类型的两个元素，并为接口(interface) A 的属性返回不同的值取决于一些 bool 标志。我查看了 typescript 泛型和自定义类型，但无法弄明白。

本质上，我希望元素在纵向和横向中返回不同的值，而不必求助于 mySprite.setPosition(new Vector(10,10)) 之类的东西。每次我的应用程序的方向发生变化。我出于好奇问这个，我不是在寻找解决这种情况的其他方法，我知道还有很多。

我可以定义一些泛型类型，比如 Variant 这样对于我的 sprite 具有的 A 类型的任何属性，我可以做类似 mySprite.myPropOfTypeA=new Variant<A>(new A("landscape value"), new A("portrait value")) 的事情这样mySprite.myPropOfTypeA.value根据 isLandscape() 的结果返回不同的值？我希望它是通用的，这样我就不必为我想要的每个属性创建一个派生类。谢谢!

interface IVector{
    x:number,
    y:number;
}

class Vector implements IVector{
    private _x:number;
    private _y:number;

    public get x() {return this._x;}
    public get y() {return this._y;}

    constructor(x:number, y:number){
        this._x=x;
        this._y=y;
    }
}

class VariableVector implements IVector{

    private _landscape: IVector;
    private _portrait: IVector;

    constructor(landscape: IVector, portrait: IVector){
        this._landscape=landscape;
        this._portrait=portrait;
    }

    public get x() {return isLandscape()? this._landscape.x:this._portrait.x;}
    public get y() {return isLandscape()? this._landscape.y:this._portrait.y;}

}

let mySprite=new Sprite(new VariableVector(new Vector(0,0), new Vector(10,10)));

谢谢!

Answer 1

以编程方式更改所有 属性的能力在 A 上读取以同样的方式不是真正的东西 class给你(特别是因为没有办法扩展通用类型...... class Variant<A> extends A 是无效的)。在这种情况下你真正想要使用的是 Proxy .冒着给你一个你不想要的答案的风险(不确定这是否违反“我不是在寻找这种情况的其他解决方案”)，这是你可以做出这样的一种方式 Proxy对象:

function makeVariant<A extends object>(
  condition: () => boolean, 
  trueValue: A, 
  falseValue: A
): A {
  return new Proxy(trueValue, {
    get(target, prop: keyof A, receiver) {
      return condition() ? trueValue[prop] : falseValue[prop];
    }
  });
}

函数makeVariant接受一个回调和两个通用类型的值 A , 并返回一个对象，其属性将从一个或另一个值中提取，具体取决于回调是否返回 true。或 false .我不确定您是否希望回调函数的范围超出 makeVariant 的定义范围所以它不需要作为参数传入，但如果需要，您可能会摆弄它。

让我们看看它是否有效:

// not sure if isLandscape() is meant to be global    
let landscape: boolean = true;
function isLandscape() {
  return landscape;
}

const variantVector = makeVariant(isLandscape, new Vector(1, 2), new Vector(3, 4));

landscape = true;
console.log(variantVector.x, variantVector.y) // 1, 2
landscape = false;
console.log(variantVector.x, variantVector.y) // 3, 4

我觉得很合理。希望这能为您指明有用的方向。祝你好运!