如何在 JavaScript 中找到两个数组之间的差异？

Question

I'm a new JavaScript user, but I've been tasked with creating a spreadsheet for my community and it seems I've run into a bump. I've been using Google Scripts along with Google Sheets (so my community can also see the information).

Basically I have two arrays, both populated with lists of players.

1. My first array is populated with a list of active players, these change every other day. Some people drop, some people get added, others stay on the list.

2. My second array is used to keep track of everyone, so it contains a list of all previous members.

My issue: Suppose my second array contained the values "Player1","Player2", and "Player3", and my first array contains the values "Player1","Player2", and "Player3".

Now consider the change in the first array, perhaps Player1 is removed, and Player 4 is added (in random order), where the second array contains "Player1","Player2", and "Player3", but my first array contains the values "Player4","Player2", and "Player3". I want a something that compares the two arrays (in any order) and returns the difference between the first array and the second array, and then subsequently adds them onto the second array.

IE:
Array 1 -- Active Members = Player1,Player2,Player3,Player6,Player9,Player4
Array 2 -- Total Members = Player1,Player2,Player3,Player4,Player6,Player9

would return NO difference, but

Array 1 -- Active Members = Player1,Player4,Player3
Array 2 -- Total Members = Player2,Player3

would return Player1 and Player4, and then add them to Array 2 to make Array 2:
Player2,Player3,Player1,Player4

I know it's really confusing, but I can't wrap my head around how to get this to work!

Here's some pseudo code to demonstrate what I want:

if Array1[x] is found in Array2
ignore

but

if Array1[x] is not found in Array2
add the value of [x] to the end of Array2

I'm using Google Scripts to code for a Spreadsheet in Google Spreadsheet here's the basic outline of my code:

 for (var i=0;i<=range.length;i++){
 var playerName = sheetWAR.getRange(i+4,4).getValue(); // first 3 rows are for information
 }

where range is a value I insert view the Browser.inputBox command.

I then take this data and paste it to another sheet:

for (var j=0;j<=playerName.length;j++){
sheetRANK.getRange(j+2,3).setValue(playerName[j]);
}

Good, now I want to take those values and compare them with a list (that will default to empty!

var maxRow = sheetRANK.getLastRow();
for (var k=0; k<=maxRow; k++){
var activeRange = sheetRANK.getRange(k,1).getValue();
}

activeRange = Array2
playerNumber = Array1

I've tried both of the suggestions below and here's what happens:

If I have these values for each array:

activeRange = {"Viper", "Cobra", "Diamondback", "Python"}
and
playerName = {"Viper", "Cobra", "Anaconda", "Diamondback", "Python"}

resulting activeRange = {"Viper", "Cobra", "Diamondback", "Python", "", "", "Anaconda", "undefined"}

for both of the posted solutions.

I failed to realize that I had copied 1 above the playerName into the array, so a simple playerName.length-1 in the for loop solved that issue, the other issue was with a blank space appearing in the compiled list: this is probably the best demonstration of a new-to-JavaScript mistake. I simply forgot that I was using lastRow as the length, so if I had fewer values in the activeRange (array2) than in playerNum (array1), it would copy down to the last row in array1, which would be a blank space in array2, then once it compiled those two arrays together, with array2 coming before array1, the blank space would separate the two.

Answer 1

Hope this help:

var arr1 = ["Player1", "Player4", "Player3"];
var arr2 = ["Player2", "Player3"];

arr1.forEach(function(player) {
    if(arr2.indexOf(player) == -1) arr2.push(player);
});
console.log(arr2);

// ["Player2", "Player3", "Player1", "Player4"]