常用的JS相关操作

交集

在Vue中，如果你要取两个数组的交集，可以使用JavaScript的filter方法结合includes方法来实现。
下面是一个使用Vue.js的示例代码，演示如何取两个数组的交集：

<template>
  <div>
    <h2>数组A</h2>
    <ul>
      <li v-for="item in arrayA" :key="item">{{ item }}</li>
    </ul>

    <h2>数组B</h2>
    <ul>
      <li v-for="item in arrayB" :key="item">{{ item }}</li>
    </ul>

    <h2>交集</h2>
    <ul>
      <li v-for="item in intersection" :key="item">{{ item }}</li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      arrayA: [1, 2, 3, 4, 5],
      arrayB: [4, 5, 6, 7, 8]
    };
  },
  computed: {
    intersection() {
      return this.arrayA.filter(item => this.arrayB.includes(item));
    }
  }
};
</script>

在上面的示例中，arrayA和arrayB分别是两个数组。我们通过计算属性intersection来计算交集，使用了filter方法来筛选arrayA中存在于arrayB的元素。

运行这个示例，你将会看到该页面上展示了数组A、数组B以及它们的交集。请注意，交集会根据arrayA的顺序进行筛选，如果顺序不同，交集的结果也会不同。

两个对象合并

在Vue中，如果你想要将两个对象合并，并且对于相同的属性，保留一个对象中的值，可以使用Object.assign()方法或者展开运算符(…)来实现。
下面是一个示例代码，演示如何合并两个对象并保留相同属性的值：

// 对象A
const objectA = { a: 1, b: 2, c: 3 };

// 对象B
const objectB = { b: 4, c: 5, d: 6 };

// 合并对象并保留相同属性的值
const mergedObject = { ...objectA, ...objectB };

console.log(mergedObject);

在上面的示例中，我们使用了展开运算符(…)来合并objectA和objectB，并将结果赋值给mergedObject。对于相同的属性，展开运算符会保留objectB中的值，而忽略objectA中的值。
运行这个示例，你将会看到输出结果为{ a: 1, b: 4, c: 5, d: 6 }，其中b和c属性的值来自objectB，而a属性的值来自objectA。

去重

• 无序
  你可以使用JavaScript中的Set数据结构来实现两个列表的去重。Set是一种集合数据结构，它只能存储唯一的值，重复的值会被自动去重。
  以下是一种使用Set进行列表去重的方法：

const list1 = [1, 2, 3, 4, 5];
const list2 = [4, 5, 6, 7, 8];

// 将两个列表合并
const mergedList = [...list1, ...list2];

// 使用Set进行去重
const uniqueList = [...new Set(mergedList)];

console.log(uniqueList);

在上面的示例中，我们首先将两个列表list1和list2合并为一个新的列表mergedList，然后使用Set对mergedList进行去重。最后，我们将去重后的结果转换回数组形式，并打印输出。
运行这个示例，你将会看到输出结果为[1, 2, 3, 4, 5, 6, 7, 8]，其中重复的元素已经被去除。
请注意，Set是一种无序的数据结构，它不会保留原始列表的顺序。如果你需要保留原始列表的顺序，可以使用其他方法，例如使用Array.filter()和Array.indexOf()来进行去重。

• 有序
  如果你需要保证数据的有序性，并且进行列表去重，你可以使用JavaScript中的Array.filter()和Array.indexOf()方法来实现。
  以下是一种使用Array.filter()和Array.indexOf()进行有序列表去重的方法：

const list1 = [1, 2, 3, 4, 5];
const list2 = [4, 5, 6, 7, 8];

// 将两个列表合并
const mergedList = list1.concat(list2);

// 使用filter和indexOf进行去重
const uniqueList = mergedList.filter((item, index) => mergedList.indexOf(item) === index);

console.log(uniqueList);

在上面的示例中，我们首先将两个列表list1和list2合并为一个新的列表mergedList，然后使用filter方法和indexOf方法对mergedList进行去重。filter方法会遍历mergedList中的每个元素，并根据indexOf方法的返回值判断是否保留该元素。只有当元素第一次出现时，indexOf方法返回的索引与当前遍历的索引相等，才会保留该元素。
最后，我们将去重后的结果打印输出。由于我们使用的是filter方法，保留了原始列表的顺序，所以输出结果将会是有序的。
运行这个示例，你将会看到输出结果为[1, 2, 3, 4, 5, 6, 7, 8]，其中重复的元素已经被去除，并且保持了原始列表的顺序。

• 有序且根据对象的ID属性进行去重
  如果你想根据对象的ID属性进行去重，可以使用JavaScript中的Array.filter()和Array.findIndex()方法来实现。
  以下是一种使用Array.filter()和Array.findIndex()进行对象列表去重的方法：

const list1 = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Charlie' }
];

const list2 = [
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Charlie' },
  { id: 4, name: 'David' }
];

// 将两个列表合并
const mergedList = list1.concat(list2);

// 使用filter和findIndex进行去重
const uniqueList = mergedList.filter((item, index) => {
  const foundIndex = mergedList.findIndex(obj => obj.id === item.id);
  return foundIndex === index;
});

console.log(uniqueList);

在上面的示例中，我们首先将两个列表list1和list2合并为一个新的列表mergedList，然后使用filter方法和findIndex方法对mergedList进行去重。filter方法会遍历mergedList中的每个元素，并根据findIndex方法的返回值判断是否保留该元素。只有当元素第一次出现时，findIndex方法返回的索引与当前遍历的索引相等，才会保留该元素。

最后，我们将去重后的结果打印输出。由于我们使用的是filter方法，保留了原始列表的顺序，所以输出结果将会是有序的。

运行这个示例，你将会看到输出结果为：

[
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Charlie' },
  { id: 4, name: 'David' }
]

list对象获取其中一个属性的值

要获取列表中对象的一个属性的值，你可以使用JavaScript中的Array.map()方法来实现。
以下是一种使用Array.map()方法获取列表对象属性值的方法：

const list = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Charlie' }
];

// 使用map方法获取属性值
const propertyValues = list.map(item => item.name);

console.log(propertyValues);

在上面的示例中，我们有一个列表list，其中包含了多个对象，每个对象都有id和name属性。我们使用map方法遍历list中的每个对象，并返回对象的name属性值。最后，我们将属性值存储在propertyValues数组中，并打印输出。
运行这个示例，你将会看到输出结果为[‘Alice’, ‘Bob’, ‘Charlie’]，其中包含了列表中每个对象的name属性值。
如果你想获取其他属性的值，只需将item.name替换为你想要获取的属性即可。

根据对象去除list对象中的数据

如果你想根据对象的某个属性值去除一个列表（数组）中的对象，你可以使用 JavaScript 的 filter 方法。filter 方法可以根据指定的条件筛选出符合条件的元素，并返回一个新的数组。
下面是一个示例代码，展示了如何使用 filter 方法根据对象的某个属性值去除列表中的对象：

const list = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Charlie' }
];

const objectIdToRemove = 2;

const filteredList = list.filter(item => item.id !== objectIdToRemove);

console.log(filteredList);

在上述示例中，我们有一个包含多个对象的列表 list，每个对象都有一个 id 属性。我们想要根据 id 属性的值去除列表中的某个对象。在这个例子中，我们想要去除 id 为 2 的对象。我们使用 filter 方法来筛选出 id 不等于 2 的对象，并将结果存储在 filteredList 中。最后，我们在控制台输出 filteredList，可以看到被去除了的对象。

根据list对象去除另一个list对象中的

你可以使用 JavaScript 中的 filter 方法来根据一个列表对象去除另一个列表对象中的元素。下面是一个示例代码，展示了如何使用 filter 方法实现这个功能：

const list1 = [
  { id: 1, name: 'Apple' },
  { id: 2, name: 'Banana' },
  { id: 3, name: 'Orange' }
];

const list2 = [
  { id: 2, name: 'Banana' },
  { id: 4, name: 'Grape' }
];

const filteredList = list1.filter(item1 => {
  return !list2.some(item2 => item2.id === item1.id);
});

console.log(filteredList);

在上述示例中，我们有两个列表对象 list1 和 list2。我们想要从 list1 中去除那些在 list2 中存在的元素。
我们使用 filter 方法遍历 list1，并使用 some 方法在 list2 中检查是否存在具有相同 id 的元素。如果不存在，则保留该元素，否则将其过滤掉。
最后，我们得到了一个过滤后的列表 filteredList，其中包含了从 list1 中去除了在 list2 中存在的元素。