JSON 和耦合

Question

我不确定我是否正确理解了耦合。有人告诉我，如果我将数据移出到外部数据文件（如 JSON）中，它会减少整体耦合。 （我同意这一点。）

但是，如果我要创建一个对象来保存包含在 JSON 中的数据，其字段直接映射到 JSON 的结构，那是否仍会在对象和 JSON 之间创建紧密耦合的链接？

例如：

"images": [{
    "source" : "images/foo.png",
    "size" : "thumbnail",
    "alt" : "Foo"
},
{
    "source" : "images/bar.png",
    "size" : "thumbnail",
    "alt" : "bar"
}]

然后我们有一些对象，应用程序模型的一部分：

function FooBarImage (jsonObj) {
    this.source = jsonObj.source;
    this.size = jsonObj.size;
    this.alt = jsonObj.alt;
}

FooBarImage.prototype.doStuff = function () { ... }

这里，FooBarImage 对象知道 JSON 对象的内部格式。如果 JSON 数据的格式发生变化（例如，我们要添加一个新字段，或者重命名一个现有字段），我们是否也必须对构造函数进行更改？

是我误解了什么，还是有其他方法可以进一步解耦代码和数据？

Answer 1

您可以轻松地“反映”/“映射”您的 jsonObject（由提供的 JSON 字符串反序列化产生的文字对象）。您可以遍历对象属性并将它们分配给您的实例：

function FooBarImage (jsonObj) {
    Object.keys(jsonObj).forEach(function(prop) {
        this[prop] = jsonObj[prop];
    }
}

FooBarImage.prototype.doStuff = function () { ... }

示例：

function dirtyMap(fromObj, toObj) {
	Object.keys(fromObj).forEach(function(prop) {
		toObj[prop] = fromObj[prop];
	});
	return toObj; // chain me?
};

function FooBarImage (jsonObj) {
    dirtyMap(jsonObj, this);
};
FooBarImage.prototype.doStuff = function () { 
	console.log(this);
};

var json = `[{
    "source" : "images/foo.png",
    "size" : "thumbnail",
    "alt" : "Foo"
},
{
    "source" : "images/bar.png",
    "size" : "thumbnail",
    "alt" : "bar"
}]`
  , images = JSON.parse(json)
  , instances = images.map(function(img) { return new FooBarImage(img); })
  ;

instances.forEach(function(instance) { instance.doStuff(); });

另一种解决方案（当然还有其他解决方案）是使用工厂：

var createFooBarImage = function createFooBarImage(img) {
    var fooBarImage = Object.create(img);
    fooBarImage.doStuff = function () { 
        console.log(this);
    };
    return fooBarImage;
}

示例：

var json = `[{
	"source" : "images/foo.png",
	"size" : "thumbnail",
	"alt" : "Foo"
},
{
	"source" : "images/bar.png",
	"size" : "thumbnail",
	"alt" : "bar"
}]`
  , createFooBarImage = function createFooBarImage(img) {
		var fooBarImage = Object.create(img);
		fooBarImage.doStuff = function () { 
			console.log(this);
		};
		return fooBarImage;
	}
  , images = JSON.parse(json)
  , instances = images.map(function(img) { return createFooBarImage(img); })
  ;

instances.forEach(function(instance) { instance.doStuff(); });