如何从同一对象的方法中引用属性？

Question

你能告诉我为什么这行不通吗？ （注意 this 关键字）

var post = {
    url: 'http://myurl.com',
    add: function() {
        window.location = this.url + '/add';
    },
    edit: function() {
        window.location = this.url + '/edit';
    }
};

代码中的其他地方：

post.url = '<?php echo BASE_ADMIN . $postType ?>';

$(document).ready(function() {

    $("#listing").aJqueryPlugin({
    ...
    // Buttons and their callbacks
    buttons : [
        {name: 'Add', bclass: 'add', onpress : post.add},
        {name: 'Edit', bclass: 'edit', onpress : post.edit},
    ],
   ...
});

线

post.url = ....

按预期运行。 post 中的 url 属性已更新。

但是，当我点击 Add 或 Edit 按钮并输入它们的功能时，this.url 是 undefined 因为 this 引用了按钮而不是 post 对象。为什么？那么我应该怎么做才能从回调中引用 url 属性？

Answer 1

由于您使用的是 jQuery，您可以使用$.proxy。

    {name: 'Add', bclass: 'add', onpress : $.proxy(post, "add")},
    {name: 'Edit', bclass: 'edit', onpress : $.proxy(post, "edit")},

这将返回一个新函数，该函数将调用由字符串命名的对象的方法。

---

它正在有效地做到这一点：

{name: 'Add', bclass: 'add', onpress : function() {
                                           return post["add"].apply(post, arguments);
                                       },
{name: 'Edit', bclass: 'edit', onpress : function() {
                                           return post["edit"].apply(post, arguments);
                                         },

---

由于函数中this 的值取决于函数的调用方式，因此您有时需要其他方法来确保获得正确的值。

---

你也可以在你的原始对象中设置这些，只要你知道你总是希望this 引用那个对象。

var post = {
    url: 'http://myurl.com'
};
post.add = $.proxy(function() {
    window.location = this.url + '/add';
}, post);
post.edit = $.proxy(function() {
    window.location = this.url + '/edit';
}, post);

这使用了$.proxy 的另一个签名，它允许您直接传递函数，后跟所需的this 值。