JSON Массив Манипуляции с использованием простого JavaScript или Lodash

Question

У меня есть массив JSON, похожий на структуру ниже.

[{ 
"variable_name": "VAR1_XYZ", 
"variable_values": [ 
      { 
       "DomainName": "Env1", 
       "Value": "ABC Process 1", 
       (some more key-value pairs) 
      }, 
      { 
       "DomainName": "Env2", 
       "Value": "DEF Process 1", 
       (some more key-value pairs) 
      }], 
},{ 
"variable_name": "VAR2_UVW", 
"variable_values": [ 
      { 
       "DomainName": "Env1", 
       "Value": "ABC Process 2", 
       (some more key-value pairs) 
      }, 
      { 
       "DomainName": "Env2", 
       "Value": "DEF Process 2", 
       (some more key-value pairs) 
      }], 
}]; 

Я представляю эти данные в структуре таблицы с «variable_name» (как/клетка строки)-значения для работы с несколькими «ИмяДоменом» с (как колонки) в „нг-сетке“.

У меня также есть требование, когда пользователь выбирает одно из «доменных имен», значения «variable_name» в выбранном домене должны быть сопоставлены с значениями с другими доменами и в зависимости от о том, есть ли совпадение или нет, ячейки таблицы «ng-grid» должны быть закодированы цветом как «зеленые» или «красные» в зависимости от того, существует ли совпадение или нет.

Я просматривал простой манипуляции с javascript/json и подчеркивание/lodash, чтобы понять, что является наиболее эффективным способом сравнения объектов JSON со следующими структурами, и я не мог прийти к какому-либо выводу о том, как его достичь. Я также новичок в библиотеке lodash/underscore и, возможно, это вызывает эту путаницу, если я над инженерией, или если я принимаю правильный путь для решения этой проблемы.

Моя конечная цель - создать общую функцию, которая принимает выбранное доменное имя и приведенный ниже массив, чтобы предоставить выходной массив, который имеет список истинных/ложных логических значений для каждого «variable_name»/«DomainName», которое я могу используйте для окраски сетки.

Так, например, если пользователь выбирает DomainName как «Env1», я хочу получить все «переменное имя» под «Env1» и сравнить значения соответствующих «переменных_имя» с другими доменами и создать результат объекта, аналогичный

{Env1 : true, Env2: false, Env3 : true} 

, который я могу использовать для окраски ng-сетки. Не могли бы вы предложить, какой подход следует предпринять, если это нужно сделать, используя lodash/underscore? вместо простого javascript?

Answer 1

В зависимости, какие браузеры вы поддерживаете, вы могли бы сделать что-то подобное с ванильным ES5:

var arr = [{ 
    "DomainName": "Env1", 
    "Value": "ABC Process 1" 
}, { 
    "DomainName": "Env2", 
    "Value": "DEF Process 1" 
}, 
{ 
    "DomainName": "Env3", 
    "Value": "DEF Process 1" 
}]; 

function constructDomainObject(collection, selectedDomains) { 
    return collection.reduce(function (memo, domain) { 
     var domainName = domain["DomainName"]; 
     var selected = selectedDomains.some(function (domain) { 
      return domain === domainName 
     }); 
     memo[domainName] = selected; 
     return memo; 
    }, {}); 
} 

var data = constructDomainObject(arr, ['Env1', 'Env3']); 
// data = {Env1 : true, Env2: false, Env3 : true} 

Если вы поддерживаете устаревшие версии браузеров, вы можете polyfill reduce и some или использовать аналогичный lodash/подчеркивание методы.

Fiddle