Arrays are one of the most common concepts in Javascript and offer many possibilities for working with data, so it’s important to be familiar with some of the common operations on arrays.

1. Array deduplication

1, from() method

A string or numeric array can be de-duplicated directly using the FROM method.

var plants = ['Saturn'.'Earth'.'Uranus'.'Mercury'.'Venus'.'Earth'.'Mars'.'Jupiter'];
var uniquePlants = Array.from(new Set(plants)); 
console.log(uniquePlants); // [ 'Saturn', 'Earth', 'Uranus', 'Mercury', 'Venus', 'Mars', 'Jupiter' ]
Copy the code

2, spread operator (…)

Extended operators are one of the big innovations of ES6, along with many powerful features.

var plants = ['Saturn'.'Earth'.'Uranus'.'Mercury'.'Venus'.'Earth'.'Mars'.'Jupiter'];
var uniquePlants = [...new Set(plants)]; 
console.log(uniquePlants); // [ 'Saturn', 'Earth', 'Uranus', 'Mercury', 'Venus', 'Mars', 'Jupiter' ]
Copy the code

2. Replace a specific value in the array

The splice() method adds/removes items from/to the array and returns the deleted items. This method changes the original array. Pay special attention to where the values are inserted!

// arrayObject.splice(index,howmany,item1,..... ,itemX)

var plants = ['Saturn'.'Uranus'.'Mercury'.'Venus'.'Earth'.'Mars'.'Jupiter'];
var result = plants.splice(2.1.'www.shanzhonglei.com')
console.log(plants); // ['Saturn','Uranus','www.shanzhonglei.com','Mercury','Venus','Earth','Mars','Jupiter']
console.log(result); // ['Mercury']
Copy the code

3. There is no mapping array for map()

The map() method returns a new array whose elements are the values of the original array elements. It processes the elements in the same order as the original array elements. Note: Map () does not alter the original array, nor does it detect an empty array.

// array.map(function(currentValue,index,arr), thisValue)

var plants = [
    { name: "Saturn" },
    { name: "Uranus" },
    { name: "Mercury" },
    { name: "Venus"},]var plantsName = Array.from(plants, ({ name }) = > name);
console.log(plantsName); // [ 'Saturn', 'Uranus', 'Mercury', 'Venus' ]
Copy the code

4. Empty array

If you want to empty an array, just set the length of the array to 0, well, that’s a little bit easy.

var plants = ['Saturn'.'Earth'.'Uranus'.'Mercury'.'Venus'.'Earth'.'Mars'.'Jupiter'];
plants.length = 0;
console.log(plants); / / []
Copy the code

5. Convert arrays to objects

The fastest way to convert an array to an object is the spread operator (…). .

var plants = ['Saturn'.'Earth'.'Uranus'.'Mercury'.'Venus'.'Earth'.'Mars'.'Jupiter'];
varplantsObj = {... plants }console.log(plantsObj); // {'0': 'Saturn','1': 'Earth', '2': 'Uranus','3': 'Mercury','4': 'Venus','5': 'Earth','6': 'Mars','7': 'Jupiter'}
Copy the code

6. Populate the array with data

If we need to fill an array with some data, or if we need a data with the same value, we can use fill().

var plants = new Array(8).fill('8');
console.log(plants); // ['8', '8','8', '8','8', '8','8', '8','8', '8','8']
Copy the code

7. Merge arrays

Of course you would think of the concat() method, but oh, the spread operator (…) It’s also nice, and this is another use of extension operators.

var plants1 = ['Saturn'.'Earth'.'Uranus'.'Mercury'];
var plants2 = ['Venus'.'Earth'.'Mars'.'Jupiter'];
console.log([...plants1, ...plants2]); // ['Saturn', 'Earth','Uranus', 'Mercury','Venus', 'Earth','Mars', 'Jupiter']
Copy the code

Intersection of two arrays

To ask for the intersection of two arrays, first make sure the arrays are not duplicated, and then use the filter() and includes() methods.

var plants1 = ['Saturn'.'Earth'.'Uranus'.'Mercury'.'Venus'.'Earth'.'Mars'.'Jupiter'];
var plants2 = ['Saturn'.'Earth'.'Uranus'];
var alonePlants = [...new Set(plants1)].filter(item= > plants2.includes(item));
console.log(alonePlants); // [ 'Saturn', 'Earth', 'Uranus' ]
Copy the code

Delete false values from array

We often need to remove false values when processing data. In Javascript, false values are false, 0, “”, null, NaN, undefined.

var plants = ['Saturn', 'Earth', null, undefined, false, "", NaN, 'Uranus', 'Mercury', 'Venus', 'Earth', 'Mars', 'Jupiter'];
var trueArr = plants.filter(Boolean);
console.log(trueArr); // ['Saturn', 'Earth','Uranus', 'Mercury','Venus', 'Earth','Mars', 'Jupiter']
Copy the code

Get a random value from the array

We can get a random index number based on the length of the array.

var plants = ['Saturn', 'Earth', 'Uranus', 'Mercury', 'Venus', 'Earth', 'Mars', 'Jupiter'];
console.log(plants[Math.floor(Math.random() * (plants.length + 1))])
Copy the code

The lastIndexOf() method

LastIndexOf () helps us find the index of the last occurrence of the element.

var plants = ['Saturn', 'Earth', 'Uranus', 'Mercury', 'Venus', 'Earth', 'Mars', 'Jupiter'];
console.log(plants.lastIndexOf('Earth')) // 5
Copy the code

12. Add all the values in the array

The reduce() method takes a function as an accumulator, and each value in the array (from left to right) starts to shrink and eventually evaluates to a value.

// array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

var nums = [1.2.3.4.5];
var sum = nums.reduce((x, y) = > x + y);
console.log(sum); / / 15
Copy the code