计算数组中的相似性答案

【问题标题】：compute similarities in arrays计算数组中的相似性
【发布时间】：2017-10-13 07:49:15
【问题描述】：

我正忙于制作过滤器。现在我想比较 5 个包含对象的数组。在计算变量中，我只想拥有在所有数组中找到的对象。

这些是创建不同过滤器（包含对象的数组）的计算变量

computed: 
    filteredOnColor () {
      this.presentOnColor = []
      for (var p = 0; p < this.paintings.length; p++) {
        for (var i = 0; i < this.kleur.length; i++) {
          if (this.kleur.length > 0 && this.paintings[p].kleur.includes(this.kleur[i])) {
            this.presentOnColor.push(this.paintings[p].title)
          }
        }
      }
    },
    filteredOnTechnique () {
      this.presentOnTechnique = []
      for (var p = 0; p < this.technique.length; p++) {
        for (var i = 0; i < this.technique.length; i++) {
          if (this.technique.length > 0 && this.paintings[p].technique.includes(this.technique[i])) {
            this.presentOnTechnique.push(this.paintings[p].title)
          }
        }
      }
    },
    filteredOnStyle () {
      this.presentOnStyle = []
      for (var p = 0; p < this.style.length; p++) {
        for (var i = 0; i < this.style.length; i++) {
          if (this.style.length > 0 && this.paintings[p].style.includes(this.style[i])) {
            this.presentOnStyle.push(this.paintings[p].title)
          }
        }
      }
    },

RAW DATA

presentOnColor: [A,B,C]
presentOnStyle: [B,C,D
presentOnTechnique: [B,C,F]

presentFilter: [B,C]

【问题讨论】：

请在过滤后添加原始数据和想要的结果。
我添加了我的原始数据。 presentFilter 是我想要的。
计算属性是为了返回一个值。为什么要在每个计算属性的方法中设置不同的数据属性？由于仅在访问计算属性时才调用这些方法，因此您的数据属性可能没有按照您的预期设置。

标签： javascript arrays vue.js

【解决方案1】：

您可以检查数组是否包含在所有数组中，并使用公共部分过滤数组。

var $scope = { presentOnColor: ['A', 'B', 'C'], presentOnStyle: ['B', 'C', 'D'], presentOnTechnique: ['B', 'C', 'F'] },
    presentFilter = [$scope.presentOnColor, $scope.presentOnStyle, $scope.presentOnTechnique].reduce(function(a, b) {
        return a.filter(function(c) {
            return b.indexOf(c) !== -1;
        });
    });

console.log(presentFilter);

ES6

var $scope = { presentOnColor: ['A', 'B', 'C'], presentOnStyle: ['B', 'C', 'D'], presentOnTechnique: ['B', 'C', 'F'] },
    presentFilter = [$scope.presentOnColor, $scope.presentOnStyle, $scope.presentOnTechnique]
        .reduce((a, b) => a.filter(c => b.includes(c)));

console.log(presentFilter);

【讨论】：

【解决方案2】：

这是解决问题的更好更有效的方法。我假设 A、B、C 是他数组中的字符。如果这恰好是对象，请给我对象的属性。如果你明白了，那就没问题了。

// Given input as these 3 arrays

const presentOnColor = ['A', 'B', 'C']
const resentOnStyle = ['B', 'C', 'D'];
const presentOnTechnique = ['B', 'C', 'F'];

// Expected outcome
// const presentFilter = ['B', 'C'];

const arrayMap = [
    ...presentOnColor,
    ...resentOnStyle,
    ...presentOnTechnique
].reduce((object, item) => {
    object[item] = (object[item] || 0) + 1;
    return object;
}, {});

const presentFilter = Object.keys(arrayMap).filter(item => arrayMap[item] === 3);

console.log('presentFilter: ', presentFilter);

【讨论】：