JS ES new features: Introduction to extension operators

// Define an array let arr = [1, 2, 3, 4, 5, 6]
// Expand using the ... spread operator console.log(...arr); // 1 2 3 4 5 6

// Define a function function fun(...item) {
  console.log(...item);
}
// Call function fun(1, 2, 3, 4, 5, 6) // 1 2 3 4 5 6

// Use with expressions let x = 10
arr = [
  ...(x > 0 ? ['a'] : []),
  'b',
];
console.log(...arr); //ab

// define a function function fun(a, b, c, d, e) {
  console.log(a, b, c, d, e);
}
// Define an array let arr = [1, 2, 3, 4, 5]
// ES5 calling method fun.apply(null, arr) //1 2 3 4 5
// ES6 calling method fun(...arr) // 1 2 3 4 5

let arr = [1, 20, 30, 50, 3, 88, ]
// ES5 let max = Math.max.apply(null, arr)
console.log(max); // 88

let arr = [1, 20, 30, 50, 3, 88, ]
// ES6 let max = Math.max(...arr)
console.log(max); // 88

let arr1 = [1, 2, 3, 4, 5]
let arr2 = arr1
console.log(arr2); // [ 1, 2, 3, 4, 5 ]
// Modify the data content of arr2 arr2[2] = 6;
// Both will change console.log(arr1, arr2); // [ 1, 2, 6, 4, 5 ] [ 1, 2, 6, 4, 5 ]

let arr1 = [1, 2, 3, 4, 5]
let arr2 = []
// ES5 for (let i = 0; i < arr1.length; i++) {
  arr2[i] = arr1[i];
}
arr2[2] = 6;
// Only arr2 changes console.log(arr1, arr2); // [ 1, 2, 3, 4, 5 ] [ 1, 2, 6, 4, 5 ]

// ES6 arr2 = [...arr1]
arr2[2] = 6;
// Only arr2 changes console.log(arr1, arr2); // [ 1, 2, 3, 4, 5 ] [ 1, 2, 6, 4, 5 ]

const arr1 = ['a', 'b'];
const arr2 = ['c'];
const arr3 = ['d', 'e'];

// ES5 merged array console.log(arr1.concat(arr2, arr3)); // [ 'a', 'b', 'c', 'd', 'e' ]


// ES6 merged array console.log([...arr1, ...arr2, ...arr3]); // [ 'a', 'b', 'c', 'd', 'e' ]

// Scenario analysis: get the first and last values ​​in the array let arr = [1, 2, 3, 4, 5]
let first, rest;
// ES5 writing: borrow Array.slice() function first = arr[0]
rest = arr.slice(1)
console.log(first, rest); // 1 [ 2, 3, 4, 5 ]
// ES6 way of writing [first, ...rest] = arr
console.log(first, rest); // 1 [ 2, 3, 4, 5 ]

let str = 'Fox Demon Little Matchmaker'
console.log([...str]); // [ 'fox', 'demon', 'little', 'red', 'mother' ]