ES6 deconstruction of objects and arrays

1. Object deconstruction

let saveFiled = {
  extension: "jpg",
  name:"girl",
  size:14040
};

ES5
function fileSammary(file){
  return `${file.name}.${file.extension}的总大小是${file.size}`;
}
console.log(fileSammary(saveFiled));


ES6
function fileSammary({name,extension,size}){
  return `${name}.${extension}的总大小是${size}`;
}

console.log(fileSammary(saveFiled));

2. deconstruction array

1. Return a value of the first array 
const names = [ "Henry", "Bucky", "Emily"]; 

the ES5 
the console.log (names [0]) 

for ES6 
const [NAME1, NAME2, NAME3] = names; 
the console.log (NAME1) 

2. returns the number of array 
the ES5 
the console.log (names .length) 

for ES6 
const} = {length names 
the console.log (length) 

3. expand binding operator 
const [name, ... REST] = names; 
Console .log (name, REST); 

4. Object array 
const people = [ 
  {name: "Henry", Age: 20 is}, 
  {name: "Bucky", Age: 25}, 
  {name: "Emily", Age: 30 } 
]; 

the ES5 
var people Age = [0] .age; 
the console.log (Age); 

for ES6 
const [Age] = people;
the console.log (Age) {// name: "Henry", Age: 20 is} 
const [{Age}] = people; 
the console.log (Age) // 20 is 

5. The use of the array into the object scene 
const points = [ 
  [4, 5], 
 [10, 1], 
 [0, 40] 
] 
@ desired data format 
[ 
  {X: 4, Y: 5}, 
  {X: 10, Y: 1}, 
  {X: 0, Y : 40} 
] 

for ES6 
the let newPoints = points.map (pair => { 
  // pair const = X [0]; 
  // const pair Y = [. 1]; 
  const [X, Y] = pair; 
  return {X, Y } 
}) 

the let newPoints points.map = (([X, Y]) => { 
  // pair const = X [0]; 
  // const pair Y = [. 1]; 
  // const [X, Y] = pair ; 
  return {X, Y} 
})
 
the console.log (newPoints)

  

Guess you like

Origin www.cnblogs.com/gqx-html/p/11277959.html