将前缀用于私有属性,同时返回不带私有属性的整个对象

时间:2018-12-06 13:53:35

标签: typescript

我有一个用Dashboard类实例化的对象仪表板:

export class Dashboard {
  private _id: string;
  private _name: string;
  private _dashboardComponents: DashboardComponent[];

  constructor() {
    this._id = someGenerator();
    this._name = 'some name';
    this._dashboardComponents = [];
  }

  get id(): string {
    return this._id;
  }

  get name(): string {
    return this._name;
  }

  set name(value: string) {
    this._name = value;
  }

  ...
}

由于使用了打字稿的getter和setters,我不得不在私有属性前加下划线。现在,我想将数据推送到服务器,但是一旦我发送了整个对象,它的所有属性都带有下划线。使用此类的实例时摆脱它们的最佳方法是什么。

2 个答案:

答案 0 :(得分:1)

这是否是最好的方法,我让您决定。我确实考虑过在JSON.stringify中使用replacer函数来实现它,但是我认为它可能更易读...

复制到普通对象

您可以复制到这样的对象中:

class Dashboard {
    private _id: string = 'id';
    private _name: string = 'name';
    private _dashboardComponents: any[] = ['a', 'b'];

    get id(): string {
        return this._id;
    }

    get name(): string {
        return this._name;
    }

    set name(value: string) {
        this._name = value;
    }

    toContract() {
        const result = {};
        for (let key in this) {
            result[key.replace('_', '')] = this[key];
        }
        return result;
    }
}

以下是输出:

const db = new Dashboard();

// {"_id":"id","_name":"name","_dashboardComponents":["a","b"]}
console.log(JSON.stringify(db));

//{"id":"id","name":"name","dashboardComponents":["a","b"]}
console.log(JSON.stringify(db.toContract()));

您可以执行更多的急剧转换-甚至使其可以在分层对象上使用。

委托给普通对象

您可以改为委托一个普通对象:

class DashboardContract {
    id: string = 'id';
    name: string = 'name';
    dashboardComponents: any[] = ['a', 'b'];
}

class Dashboard {
    private _contract = new DashboardContract();

    get contract(): DashboardContract {
        return this._contract;
    }

    get id(): string {
        return this._contract.id;
    }

    get name(): string {
        return this._contract.name;
    }

    set name(value: string) {
        this._contract.name = value;
    }
}

console.log(JSON.stringify(new Dashboard().contract));

卷积TypeScript端

您可以保持可序列化名称的整洁,并提供一种在围栏的TypeScript一侧命名事物的方法:

class Dashboard {
    private id: string = 'id';
    private name: string = 'name';
    private dashboardComponents: any[] = ['a', 'b'];

    get identity(): string {
        return this.id;
    }

    get dashboardName(): string {
        return this.name;
    }

    set dashboardName(value: string) {
        this.name = value;
    }
}

console.log(JSON.stringify(new Dashboard()));

答案 1 :(得分:1)

如果在设置/获取值时确实必须执行一些逻辑,则 我建议您使用代理,而不要使用获取器/设置器。

class Dashboard {
  private id: string;
  private name: string;
  private dashboardComponents: DashboardComponent[];

  constructor() {
    this.id = someGenerator();
    this.name = 'some name';
    this.dashboardComponents = [];
  }
}

const instance = new Dashboard()
const proxy = new Proxy(instance, {
   get() { /*...*/},
   set() { /*...*/}
})

JSON.stringify(proxy) // no underscores

参考:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy