0

我正在编写一个简单的 jQuery 插件，它将与 JSON 对象/数组交互。我想让该对象数组足够灵活，以便人们可以将自己的对象数组传递给插件函数。我希望用户能够通知插件如何获取 JSON 对象中的两个不同值。例如，假设这是 JSON——

[
    {
      name: "Baseball Opening Day",
      format: "jpg",
      urls: {
        small: "http://myurl.com/images/small/baseball.jpg",
        big: "http://myurl.com/images/big/baseball.jpg"
      }
    },

    // etc.
]

如果插件“知道”它将被传递一个图像对象数组，但是这些图像对象可能以多种方式格式化，我们如何传递一个选项来告诉它在哪里可以找到各种东西？例如，如果我想显示一个标题，我会要求对标题值的引用。这个相当简单：

$("gallery").myPlugin({
  references: {
    caption: "name"
  }
});

在插件内部，一旦我们遍历收集的图像对象，我们就可以得到这样的值：

// Assuming the value passed in is called "options"...
var caption = image[options.references.caption];

这将被解释为与 image.name 相同的 image["name"] 并且可以正常工作。

但是你如何告诉插件如何访问 image.urls.small 呢？你不能这样做：

$("gallery").myPlugin({
  references: {
    caption: "name",
    urlSmall: "urls.small"
  }
});

因为它会被解释为 image["urls.small"] 并返回undefined。

有没有办法通过这个？或者到那时我是否必须使用这样的回调函数：

$("gallery").myPlugin({
  references: {
    caption: "name",
    urlSmall: function () {
      return this.urls.small;
    }
  }
});

// Call it like this inside the plugin image loop
var urlSmall = options.references.urlSmall.call( image );

我知道这是一个选项，但我想知道是否有办法避免强迫用户编写回调函数，如果他们可以传递对嵌套对象属性的引用，而不是不知何故？

谢谢！

4

1 回答 1

2

您只需要一个可以拆分这些属性名称的方法。http://jsfiddle.net/mendesjuan/CUMgL/

var a = {
  b: {
    c: 2
  }
};

getProp(a, 'b.c') // returns 2


function ​getProp(obj, propName)​ {
    var parts = propName.split('.');

    for (var i=0; i < parts.length; i++) {
       obj = obj[parts[i]];
    }
    return obj;
}

在你的插件里面，你可以做

// Assuming the value passed in is called "options"...
var caption = getProp( image, options.references.caption );

理想getProp也可以与 一起使用getProp('a[b]')，但这有点困难，因此您可以根据需要实现它。Ext-JS 有一个叫做 a 的东西Ext.data.reader.JsonReader，你可以用它作为灵感http://docs.sencha.com/ext-js/4-0/source/Json2.html#Ext-data-reader-Json看对于方法createAccessor

于 2012-04-06T16:21:28.450 回答