Javascript 如何处理从前端和后端同时具有配置和计算属性的实体？

在我开始我的问题之前，我必须说，我试图创建各种假设的例子来证明我的问题，但我没有成功。因此，我将尝试给出一个比我以前尝试过的更抽象的例子，并进行解释

重新措辞的问题是；让前端用户通过指示用户需要的值来配置实体的某些属性并获得其他计算属性的结果的最佳实践是什么

我正在设计对象结构以尽可能满足我的需求，但您可以建议更好的设计。它将受到欢迎

我将拥有可以保存在同一列表中的对象，这将导致抽象类继承或接口

public abstract class Option
{
     public bool IsBlocked { get; set; } = false;

     public abstract void MakeMove();
}

public class AttackOption : Option
{
    public int SomeProp_A { get; set; }
    public int SomeProp_B { get; set; }
    public double SomeResult_A { get; set; }
    public double SomeResult_B { get; set; }
    public override void MakeMove()
    {
        SomeResult_A = MoveMaker.CaluclateSomeResult_A();
        SomeResult_B = MoveMaker.CaluclateSomeResult_B();
    }
}

public class DefenceOption : Option
{
    public int OtherProp_A { get; set; }
    public double OtherResult_A { get; set; }
    public override void MakeMove()
    {
        OtherResult_A = MoveMaker.CaluclateSomeResult_B();
    }
}

然后，我将在一个列表中添加

攻击

和

防御

选项，以便在某个时间从每个选项调用

MakeMove（）

方法

问题有两个方面

1-用户应该能够创建其中一个选项的新实例 像
a-创建新的攻击选项
b-某种泛型 应打开具有动态呈现组件的窗体，以便 用户设置SomeProp_A和SomeProp_B属性。这怎么可能 渲染，其中是可用属性的源 攻击选项。
c-将值设置为属性，并将其保存到 数据库使用了一些restapi（不知何故）

在另一个窗口中，我希望用户看到一些下拉列表，并查看他/她有哪些选项。例如“攻击”、“防御”。无论何时选择其中一个选项，在第二个下拉列表中，应列出可用的计算属性，如在第二个dd中选择“攻击”，则应列出“其他结果”。在哪里可以获取这些选项，以及如何存储用户希望在未来执行中计算的道具

在应用程序的生命周期内。将调用MakeMove（），并且只应显示用户选择的计算属性

我不知道这些属性是否应该硬编码为下拉项。如何将这些用户交互映射到后端实体。如果将来在后端添加了一个新选项，这会迫使开发人员也对前端进行更新吗

我不知道这种设计的最佳实践是什么