JavaScript 中两个数组的区别

介绍用于确定元素是否属于数组的 .includes 数组实体方法，我们将使用它来获取第一个数组的哪些元素也包含在第二个数组中。

我们将在 .filter 方法的 condition() 函数中使用它。这个回调函数既可以是箭头函数，也可以是普通函数作为回调函数。

.filter 可用于根据条件过滤数组元素，回调函数将指示 .filter 将添加或不添加到返回的数组中的元素。

JavaScript 中两个数组的区别

.include 是 Array 实体的一种方法。如果作为参数传递的元素包含在调用方法的数组中，则返回 true，如果不包含元素，则返回 false。举个简单的例子：

// Input
let array = ['a', 'b', 'c', 'd'];
console.log(array.includes('a'))

输出：

// Output
true

如果元素不属于数组，我们有：

// Input
let array = ['a', 'b', 'c', 'd'];
console.log(array.includes('z'))

输出：

// Output
false

该方法只能接收两个参数。如果你传递多个，它可能会向作为参数传递的元素集返回错误值。如上所见，第一个参数是元素；第二个是索引或 fromIndex，这是可选的。

fromIndex 是 .includes 将在其中搜索元素的索引。让我们看看下面的例子。

// Input
let array = [1, 2, 3, 4, 5];
console.log(array.includes(3, 3))

由于值 3 在索引 array[2] 上，所以从索引 array[3] 到末尾的数组具有等于 3 的元素是 false。

// Output
false

现在对于 .filter 方法来说，它也是数组实体的一个方法，并且该方法返回一个由其中的 condition() 函数提供的条件过滤的新数组。返回一个新数组意味着调用该方法的原始数组将保持不变。

此外，这个 condition() 函数是一个回调函数。回调函数作为参数传递给另一个称为外部函数的函数或方法。

外层函数会调用回调函数做某事；在 .filter 方法的情况下，它会调用条件回调函数来根据这个条件过滤数组。

.filter 方法将为数组中的每个元素调用回调函数。因此，.filter 将有一个 array.length 迭代，并最终返回一个新数组，其中的几个元素等于回调函数返回的值等于 true 的迭代次数。

例如，如果我们想要所有大小等于 3 的元素，我们可以使用下面的 .filter。

// Input
let array = ['one', 'two', 'three', 'four', 'five']
array = array.filter(element => element.length == 3)
console.log(array)

在这种情况下，它接收一个元素作为参数，如果这个元素的大小等于 3，它返回 true，否则返回 false。因此，.filter 方法会添加条件结果为 true 的任何元素。

// Output
[ 'one', 'two' ]

正如预期的那样，.filter 方法返回了一个基于 element.length == 3 条件的数组。大小等于 3 的数组的每个值都被添加到返回的数组中。

但是我们想要得到两个数组之间的差异，这将是可能的。

将在我们想要获取差异的数组上使用 .filter 方法，在其中，我们将使用 .include 作为条件，验证数组上的元素是否调用 .filter 包含在第二个元素中。让我们看看这个例子：

// Input
let array1 = ['a', 'b', 'c', 'd', 'e'];
let array2 = ['a', 'b', 'c'];
console.log(array1.filter(element => array2.includes(element)))

输出：

// Output
[ 'a', 'b', 'c' ]

好吧，看到输出不是两个数组之间的差异，而是它们的交集。并不是说条件 array2.includes(element) 比较 element 是否包含在第二个数组中，如果它是 true，.filter 会将这个元素添加到结果数组中。

但是，如果我们输入一个合乎逻辑的 not 或!在什么情况下？这样，.filter 将只添加不包含在第二个数组中的元素。检查示例：

// Input
let array1 = ['a', 'b', 'c', 'd', 'e'];
let array2 = ['a', 'b', 'c'];
console.log(array1.filter(element => !array2.includes(element)))

输出：

// Output
[ 'd', 'e' ]

最后，我们有两个数组之间的区别。

另外，如果我们想获取所有不在交集中的元素，我们可以执行以下操作。

// Input
let array1 = ['a', 'b', 'c', 'd', 'e', 'f'];
let array2 = ['a', 'b', 'c', 'x', 'y', 'z'];
let array3 = array1.filter(element => !array2.includes(element)).
    concat(array2.filter(element => !array1.includes(element)))
console.log(array3)

在这个例子中，我们想要所有不是'a'、'b'或'c'的元素，所以输出是：

// Output
[ 'd', 'e', 'f', 'x', 'y', 'z' ]

最后，作为最后一件事，我们可以将我们的解决方案添加到 Array 实体的原型方法中的两个数组之间的差异。.prototype 是 Array 实体的一个属性，它允许我们向实体添加自定义属性和方法。

要对 Array 实体创建 .difference 方法，我们可以使用以下结构：

// Input
// Declaring the prototype .difference method
Array.prototype.difference = function(array2){
    return this.filter(element => !array2.includes(element))
}
let array1 = ['a', 'b', 'c', 'd', 'e'];
console.log(array1.difference(['a', 'b', 'c']))

输出：

// Output
[ 'd', 'e' ]

这样，我们可以在每次必要时使用 .difference，而不是每次都重写逻辑。