javascript - 用于存储多个配置对象的模式

Question

我有几个对象要存储在一个总体配置对象中。各个对象具有各种共同的属性。我习惯了 JavaScript 中的函数式编程风格，但想不出一种 DRY 方法来在全局配置对象中实现这些对象的存储。

解决方案一

var config = {};

config['myKey'] = {
  'key': 'myKey',
  'name': 'My Key',
  'icon': '<h1>Category One</h1>',
  'filterFn': function(obj) {
     // function unique to this obj
     return obj;
   },
  'values': function() {
    // function unique to this obj
    return myData.filter(function(val) { return val['myKey']; };
  }
}

问题:为每个对象重复键(“名称”、“图标”等)，需要在几个不同的地方更改 myKey

config['myKey'] 对象分配对大约 5 个不同的对象重复进行。这些对象具有所有相同的共同属性。

这种方法有两种明显的“代码味道”。

1. 一个是我将相同的属性名称重复 5 次(键、名称、图标等)。

2. 第二个是我每次想使用时都必须重复“myKey”它在对象中(例如，在 config['myKey']['key'] 和配置['myKey']['values']。

我知道我可能会创建一个函数，例如 createMyKeyObject() 并且如果我传入参数。这样就省去了在多个地方重复 myKey 的需要，从而解决了第二个问题。它看起来如下:

解决方案2

function getMyKey(key, name) {
    
  var filterFn = function(obj) {
    return obj;
  };
    
  var values = data.filter(function(val) { return val[key]; };
    
  config.filters[key] = {
    'key': key,
    'name': name,
    'icon': '<h1>Category One</h1>',
    'filterFn': filterFn,
    'values': values
  };
}
    
getMyKey('myKey', 'My Key');

问题:为每个对象重复键(“名称”、“图标”等)，在两个不同的地方声明对象值(函数调用，函数内部)，修改函数内部的全局对象

这解决了重复键和名称的第二个问题，但产生了新问题。一是我会在两个不同的地方(函数内部和函数调用中)声明属于同一对象的值。这也是一个更详细的解决方案。最后，它具有修改函数内部全局 config 对象的副作用。

有没有合适的解决方案来消除这些“代码味道”？原型(prototype)继承能否以某种方式解决这个问题？

Answer 1

你可以使用构造函数，我认为不需要继承

function Config(key, name, icon, values, filterFn) {
    this.key = key;
    this.name = name;
    this.icon = icon;
    this.values = values;
    this.filterFn = filterFn;
}

var cfg = {};
// Don't want to repeat "someKey"? put it in a variable.
var myKey = 'someKey';
cfg[myKey] = new Config(myKey, 'someName', 'icon', 
                         [1,2], function(obj){ return obj + myKey});
myKey = 'otherKey';
cfg[myKey] = new Config(myKey, 'anotherName', 'anotherIcon',
                         [3,4], function(obj){ return obj + '_' + myKey});

// Or create a method to help, may be overdoing it...
function addConfig(key, name, icon, values, filterFn) {
    cfg[myKey] = new Config(key, name, icon, values, filterFn];
}

addConfig('someKey', 'thatName', 'thisIcon', [6,7], o => o);

在 EcmaScript 6 中，您可以节省一些输入

function Config(key, name, icon, values, filterFn) {
    Object.assign(this, {key, name, icon, values, filterFn});
}