如何在不传递回调函数的情况下将嵌套对象属性作为选项传递?

时间:2012-04-06 15:58:13

标签: javascript json

我正在编写一个简单的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 );

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

谢谢!

1 个答案:

答案 0 :(得分:1)

您只需要一个可以拆分这些属性名称的方法。 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有一个名为Ext.data.reader.JsonReader的东西就是这样,你可以用它作为灵感http://docs.sencha.com/ext-js/4-0/source/Json2.html#Ext-data-reader-Json寻找方法createAccessor