What is the es6?

Here but more elaboration, I also follow Ruan Yifeng big man “ES6 introduction” to learn, ES6 added a lot of methods, attributes, let us get a very high promotion in the code, here only on the array piece of elaboration, the other is not introduced.

To get back to the point, in the project, we often encounter the requirement of processing data, filtering data, we will use the for loop to complete, such as: array deduplication, the traditional method is as follows (all the examples below are only one).

letA =,2,2,3,3,4,5 [1];let b = [a[0]];
for(let i = 0; i < a.length; i++){
    let flag = false;
    for(let j = 0; j < b.length; j++){
        if( a[i] === b[j] ){
            flag = true;
            break; }}if(! Flag) {p. ush (a) [I]}} to the console. The log (b) / / [1, 2, 3, 4, 5]Copy the code

The above is the pre-ES6 processing method, which can solve the problem, but the amount of code is really a lot of ah! In ES6, all it takes is one line of code!

Array.from && newSet()

letA =,2,2,3,3,4,5 [1];letB = Array. From the console (new Set (a)). The log (b) / / [1, 2, 3, 4, 5]Copy the code

Isn’t it super simple? New Set() filters duplicate data into an array-like object. Array.from() converts an array-like object into a real Array object. Interested students can learn more about these two properties.

An array of filtering

When we get the back-end data, we may conduct some screening and filtering on the data. The traditional way is as follows

// Select kele from arraylet a = [
    {
        name: 'kele',
        title: 'Coca-Cola'
    },
    {
        name: 'kele',
        title: 'the fender'
    },
    {
        name: 'wlg',
        title: Wong Lo Kat}]let b = [];

for(let i = 0; i < a.length; i++){
    if( a[i].name === 'kele' ){
        b.push(a[i])
    }
}

console.log(b) //[{name: 'kele', title: 'Coca-Cola'},{name: 'kele', title: 'the fender'}]
Copy the code

The processing method in ES6 is as follows

Array.filter(callback)

let a = [
    {
        name: 'kele',
        title: 'Coca-Cola'
    },
    {
        name: 'kele',
        title: 'the fender'
    },
    {
        name: 'wlg',
        title: Wong Lo Kat}]let b = a.filter(item => item.name === 'kele');

console.log(b) //[{name: 'kele', title: 'Coca-Cola'},{name: 'kele', title: 'the fender'}]
Copy the code

Similarly, array.filter () gets rid of the for loop and makes the code look cleaner!

Array.every(callback)

This method returns true if all elements in the array are true

letA = [1, 2, 3, 4, 5];let b = a.every(item => item > 2);
console.log(b) // false
Copy the code

Array.some(callback)

This method is slightly different from the previous one. This method checks that one element in the array meets the criteria and returns true

letA = [1, 2, 3, 4, 5];let b = a.some(item => item > 2);
console.log(b) // true
Copy the code

Array.find(callback)

This method returns the first element in the array that meets the criteria, otherwise undefined

letA = [1, 2, 3, 4, 5];let b = a.find(item => item > 2);
console.log(b) // 3
Copy the code

Array.findIndex(callback)

This method returns the index of the first eligible element in the array, or -1 otherwise

letA = [1, 2, 3, 4, 5];letb = a.findIndex(item => item > 2); Console. log(b) // 2 The one that matches is element 3, which has an index of 2Copy the code

Array.includes(item, finIndex)

This method checks whether the array contains the specified value. It returns true if the array contains the specified value, or false otherwise. It takes two arguments, the first being the value searched (mandatory), and the second being the position at which the search began (optional, starting from 0 by default).

letA = [1, 2, 3, 4, 5];let b = a.includes(2);
console.log(b) // true
Copy the code

Array.map(callback)

This method returns a new array based on the conditions in your callback function

letA = [1, 2, 3, 4, 5];letb = a.map(item => item * 2); The console. The log (b) / /,4,6,8,10 [2]Copy the code

Array.reduce(callback)

This method adds each element to the array based on the condition in callback, returning a new value

/** **/letA = [1, 2, 3];let b = a.reduce((i, j) => {
  returni + j; }, 0); Console. log(b) // 6 /** Second **/letA = [1, 2, 3];let b = a.reduce((i,j) => {
	i.push(j)
	returnLog (b) // [0,1,2,3]Copy the code

. Extended operator

This is a handy way to merge two arrays

letA = [1, 2, 3];letB = (4 and 6);letc = [...a,...b]; The console. The log (c) / / [6].Copy the code

Summary: Basically, some new methods use these methods. Some old methods like push, shift, sort, etc., are not listed here.