[JavaScript] 1. es6 문법

es6 문법들

● let : 재할당은 가능, 재선언은 불가능

let value = "value1"
console.log(value) // value1

value = "value2" // 재할당 가능
console.log(value) // value2

let value = "value3" // 재선언 불가능
// -> SyntaxError: Identifier 'value' has already been declared

 

● const : 재할당, 재선언이 불가능. 초기값 없으면 선언 불가

const value; // 초기값 없이 선언 불가능
// -> SyntaxError: Missing initializer in const declaration

const value = "value1"
console.log(value) // value1

value = "value2" // 재할당 불가능
// -> TypeError: Assignment to constant variable.

const value = "value2" // 재선언 불가능
// -> SyntaxError: Identifier 'value' has already been declared

 

삼항 연산자 (ternary operator)

condition ? expr1 : expr2

console.log(true ? "참" : "거짓") // 참
console.log(false ? "참" : "거짓") // 거짓

- true ? "참" : "거짓" : "값"이 true이면 "참", false이면 "거짓

구조 분해 할당 (Destructuring)

- 배열(=[]) 이나 객체(={}) 속성을 분해해서 그 값을 변수에 담는 문법

 

// 배열의 경우
let [value1, value2] = [1, "new"];
console.log(value1); // 1
console.log(value2); // "new"

let arr = ["value1", "value2", "value3"];
let [a,b,c] = arr;
console.log(a,b,c) // value1 value2 value3

// let [a,b,c] = arr; 은 아래와 동일!
// let a = arr[0];
// let b = arr[1];
// let c = arr[2];

let [a,b,c,d] = arr
console.log(d) // undefined

let [a,b,c,d = 4] = arr
console.log(d) // 4

// 객체의 경우
let user = {name: "nbc", age: 30};
let {name, age} = user;

// let name = user.name;
// let age = user.age;

console.log(name, age) // nbc 30

// 새로운 이름으로 할당
let {name: newName, age: newAge} = user;
console.log(name, age) // ReferenceError: name is not defined
console.log(newName, newAge) //nbc 30

let {name, age, birthDay} = user;
console.log(birthDay) // undefined

let {name, age, birthDay = "today"} = user;
console.log(birthDay) // today

전개 구문 (Spread)

- 구조분해할당과 함께 매우 많이 사용됨

// 배열
let arr = [1,2,3];

let newArr = [...arr, 4];
console.log(newArr) // [1,2,3,4]

// 객체
let user = {name: "nbc", age: 30};
let user2 = {...user}

user2.name = "nbc2"

console.log(user.name) // nbc
console.log(user2.name) // nbc2

- "...arr" : 배열의 형태를 그대로 가져온다

템플릿 리터럴 (Template literals)

- 여러 줄로 이루어진 문자열과 문자 보간기능을 사용하게 만들어주는
  문자열 리터럴 표현식

- 백틱(= ` ), ${} 로 표현

"string"
'string'
new String("string")

`string text`

`string text 
string text line2`

`string text ${value} text`