Фильтрация ключей объекта по значениям и сопоставление с массивом - PullRequest
7 голосов
/ 11 октября 2019

Я создаю угловое приложение, и у меня есть элементы с флажками. Когда пользователь нажимает на флажок, я записываю проверенные элементы на объект. Объект выглядит так:

{1: false, 7: true, 8: true};

Когда пользователь нажимает кнопку удаления, мне нужно получить идентификаторы только выбранных элементов.

Поэтому мне нужно отфильтровать объекты по значениям и в результате, получить массив целых чисел.

Я пробовал следующий код с библиотекой lodash:

console.log(_.pick(this.selectedItems, _.identity));

return _.pick(this.selectedItems, function (value, key) {
        return value;
      });

Но это возвращает пустой массив.

Что мне нужно получитьтакое массив [7,8]

Что не так с моим кодом?

Ответы [ 7 ]

2 голосов
/ 11 октября 2019

Вы так близки к решению.

Если вы уже используете библиотеку lodash, вы можете получить желаемые результаты с помощью следующего фрагмента кода:

return _.keys(_.pickBy(this.selectedItems, function (value, key) {
  return value;
}));

Это вернетмассив выбранных идентификаторов.

Или вы можете просто использовать "vanilla" ES6, например:

const selectedItemsArray = [];
Object.keys(this.selectedItems).forEach((key, index) => {
  if (this.selectedItems[key] === true) {
    selectedItemsArray.push(key);
  }
});

Массив selectedItemsArray будет содержать выбранные идентификаторы.

2 голосов
/ 11 октября 2019

используйте _.pickBy и затем используйте _.keys для получения ключей отфильтрованных объектов.

var obj = {
  1: false,
  7: true,
  8: true,
};


var res = _.keys(_.pickBy(obj, function(value, key) {return value;}))
console.log(res);
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.5.1/lodash.js"></script>
1 голос
/ 11 октября 2019

На случай, если вы используете для этой цели только lodash, а не где-либо еще в проекте, вот решение, использующее только встроенные методы (Object.keys() в сочетании с Array.prototype.filter()):

const selectedItems = {
  1: false,
  7: true,
  8: true
};

const deleteIds = Object.keys(selectedItems).filter((item) => {
  return selectedItems[item] === true
});
console.log(deleteIds);
1 голос
/ 11 октября 2019

Вы можете использовать reduce для достижения того, что вы хотите:

const data = {1: false, 7: true, 8: true};

const filtered = Object.entries(data).reduce((acc, [key, value]) => {
  if (value) return [...acc, key];
  return acc;
}, [])


console.log(filtered)
1 голос
/ 11 октября 2019

Перебор ключей объекта

var obj = {
  1: false,
  7: true,
  8: true,
};

var filteredObj = Object.keys(obj).reduce((p, c) => {    
  if (obj[c]) p[c] = obj[c];
  return p;
}, {});

console.log(Object.keys(filteredObj))
1 голос
/ 11 октября 2019

Этого можно добиться без lodash, используя встроенную функцию filter

let vals = Object.keys(this.selectedItems).filter(k => this.selectedItems[k] == true)
0 голосов
/ 11 октября 2019

В lodash вам нужно использовать _.pickBy() вместо _.pick(), потому что _.pick() не принимает обратный вызов.

Это функция, сгенерированная _.flow(), которая получает ключи с true значение и преобразовать их в числа:

const { flow, partialRight: pr, pickBy, identity, keys, map } = _

const fn = flow(
  pickBy, // get the items by identity - this will remove keys with false values
  keys, // get the keys
  pr(map, Number) // map to numbers
);

const selectedItems = {1: false, 7: true, 8: true};

const result = fn(selectedItems);

console.log(result);
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.js"></script>

И версия lodash / fp terser:

const { flow, pickBy, identity, keys, map } = _

const fn = flow(
  pickBy(identity), // get the items by identity - this will remove keys with false values
  keys, // get the keys
  map(Number) // map to numbers
);

const selectedItems = {1: false, 7: true, 8: true};

const result = fn(selectedItems);

console.log(result);
<script src='https://cdn.jsdelivr.net/g/lodash@4(lodash.min.js+lodash.fp.min.js)'></script>
...