2020년 6월 17일 수요일

JavaScript Destructuring


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
const organizations = ['Pyke''Black Sun''Kanjiklub''Crimson Dawn'];
const [firstGang, secondGang, thirdGang, fourthGang] = organizations;
 
console.log(firstGang); // Outputs 'Pyke'
console.log(secondGang); // Outputs 'Black Sun'
console.log(thirdGang); // Outputs 'Kanjiklub'
console.log(fourthGang); // Outputs 'Crimson Dawn'
 
// first 2 values as variables the rest as an array
const organizations = ['Pyke''Black Sun''Kanjiklub''Crimson Dawn'];
const [firstGang, secondGang, ...theRest] = organizations;
 
console.log(firstGang); // Outputs 'Pyke'
console.log(secondGang); // Outputs 'Black Sun'
console.log(theRest); // Outputs ['Kanjiklub', 'Crimson Dawn']
 
// default values
const organizations = ['Pyke''Black Sun'];
const [
  firstGang = 'First Order',
  secondGang = 'Resistance',
  thirdGang = 'New Republic'
= organizations;
 
console.log(firstGang); // Outputs 'Pyke'
console.log(secondGang); // Outputs 'Black Sun'
console.log(thirdGang); // Outputs 'New Republic'
 
// 첫 게시물만 다른변수에... 나머진 배열로..
const [starPost, ...otherPosts] = blogPosts;
 
// object 값은 변수에 할당
const planet = {
  name'Hosnian Prime',
  faction: 'New Republic',
  weather: 'Temperate'
};
const { name, faction, weather } = planet;
 
console.log(name); // Outputs 'Hosnian Prime'
console.log(faction); // Outputs 'New Republic'
console.log(weather); // Outputs 'Temperate'
 
// 다른 이름으로 할당
const planet = {
  name'Hosnian Prime',
  faction: 'New Republic',
  weather: 'Temperate'
};
const {
  name: system,
  faction: team,
  weather: conditions
= planet;
 
console.log(system); // Outputs 'Hosnian Prime'
console.log(team); // Outputs 'New Republic'
console.log(conditions); // Outputs 'Temperate'
 
// default values
const planet = {
  name'Hosnian Prime'
};
const {
  name = 'Unknown planet',
  faction = 'Unknown faction',
  weather = 'Unknown conditions'
= planet;
 
console.log(name); // Outputs 'Hosnian Prime'
console.log(faction); // Outputs 'Unknown faction'
console.log(weather); // Outputs 'Unknown conditions'
 
 
// 활용법. 파라미터 기본값
function shipGenerator(options = {}) {
  const {
    cannons = 4,
    engines = 2,
    crew = 10
  } = options; // Default options
  
  return `This ship has ${cannons} cannons, ${engines} engines, and ${crew} crew members.`;
}
 
console.log(shipGenerator({ engines: 10, crew: 20 })); // Outputs 'This ship has 4 cannons, 10 engines and 20 crew members.'
console.log(shipGenerator({ cannons: 0 })); // Outputs 'This ship has 0 cannons, 2 engines and 10 crew members.'
console.log(shipGenerator()); // Outputs 'This ship has 4 cannons, 2 engines and 10 crew members.'
cs

댓글 없음:

댓글 쓰기