javascript - 添加到可能存在或可能不存在的 json 属性

Question

假设我想这样做:

  var dashboard = {};
  var page = "index";

  $('.check').click(function(){ 
    $(this).toggleClass("active").siblings().slideToggle('slow', function() {
        dashboard['pages'][page][$(this).closest('li').attr("id")]['show'] = $(this).is(":hidden") ? 'collapsed' : 'expanded';
    });
  }

我收到一条错误消息:

Dashboard.pages is undefined

是否可以动态添加 pages 和随后的子页面，而无需先检查它是否已定义然后是否未定义:

   dashboard['pages'] = {};

因为有时它们可​​能已经存在并且我不想先检查树我只想根据需要构建分支

编辑我将 pagename 更改为 page 以表明页面名称会发生​​变化，而且我还想指出页面实际上也可以是任何东西。这个想法是你有任何对象可以包含带参数的对象而不检查分支是否存在

看起来 $extend 就像声明的那样，只是不确定它是如何工作的。我得想办法解决这个问题。

Answer 1

在 Object 上定义 get 和 set 方法。实际上，它可以仅在 dashboard 对象及其后代上定义，但这很容易做到。

Object.prototype.get = function(prop) {
    this[prop] = this[prop] || {};
    return this[prop];
};

Object.prototype.set = function(prop, value) {
    this[prop] = value;
}

使用此 get() 方法遍历嵌套属性，并在必须设置值时调用 set()。

var dashboard = {};

dashboard.get('pages').get('user').set('settings', 'oh crap');
// could also set settings directly without using set()
dashboard.get('pages').get('user').settings = 'oh crap';

console.log(dashboard); //​​​​​​​​​​​​​​​ {pages: {user: {settings: "oh crap"}}};

您还可以扩展/修改 get 方法以接受嵌套属性作为单独的参数或数组或字符串。使用它，您只需调用 get 一次:

// get accepts multiple arguments here
dashboard.get('pages', 'user').set('settings', 'something');

// get accepts an array here
dashboard.get(['pages', 'user']).set('settings', 'something');

// no reason why get can't also accept dotted parameters
// note: you don't have to call set(), could directly add the property
dashboard.get('pages.user').settings = 'something';

更新:

由于 get 方法通常返回一个对象并且不知道您是否需要数组或其他类型的对象，因此您必须自己指定:

dashboard.get('pages.user').settings = [];

然后你可以将项目推送到设置数组中

dashboard.get('pages.user').settings.push('something');
dashboard.get('pages.user').settings.push('something else');

要真正让 get 函数从给定的字符串(例如 pages.user)构建对象层次结构，您必须将字符串拆分为多个部分并检查每个嵌套对象是否存在。这是 get 的修改版本，它就是这样做的:

Object.prototype.get = function(prop) {
    var parts = prop.split('.');
    var obj = this;
    for(var i = 0; i < parts.length; i++) {
        var p = parts[i];
        if(obj[p] === undefined) {
            obj[p] = {};
        }
        obj = obj[p];
    }
    return obj;
}

// example use
var user = dashboard.get('pages.user');
user.settings = [];
user.settings.push('something');
user.settings.push('else');

console.log(dashboard); // {pages: {user: {settings: ["something", "else"] }}}

// can also add to settings directly
dashboard.get('pages.user.settings').push('etc');