JS - ES6의 특징 본문
반응형
ES6의 특징
구조 분해 할당 가능
let person = {
name : "철수",
age : 7,
}
// 위와 같은 객체에서 name값의 value와 age의 value값을 가지고 오기 위해서는
// person.name 혹은, person.age로 접근을 해야 했지만 다른 방식도 존재한다.
let name = person.name
let age = person.age
// 위와 같은 방식으로 객체 안 요소를 직접 변수에 할당해줄 수 있다.
template literals == '백틱'을 활용한 동적값과 정적값을 함께 보여주기 가능
let name = "jinho"
let age = 18
console.log(`제 이름은 ${name}이며, 나이는 ${age}입니다.`)
위와 같은 경우, 동적값으로 보여주고 싶은 값은 ${}을 통해 묶어주면 원하는 대로 나와주게 된다.
배열에서의 분해 할당 가능
let arr = [1,2,3]
let a = arr[0]
let b = arr[1]
let c = arr[2]
// 또는
let [a,b,c] = arr
a == 1
b == 2
c == 3 // 의 값을 출력하게 된다.
스프레드 문법 : 만약 위와 같은 상황에서 a값만 필요한 경우 // 또는 a값만 필요하지 않은 경우 == rest parameter
let [a,...rest] = arr
console.log(a) // 1
console.log(rest) // 2, 3
배열합 가능
let a = [1,2]
let b = [3,4]
let c = [5,6]
let result = a.concat(b,c)
console.log(result) = [1,2,3,4,5,6]
스프레드 문법을 활용한 방식도 가능하다
let a = [1,2]
let b = [3,4]
let c = [5,6]
let result = [...a,...b,...c]
console.log(result) // [1,2,3,4,5,6]
에로우 함수 / 화살표 함수라고도 함
let test = () => "애로우 함수"
console.log(test()) // "애로우 함수"
함수 표현을 위와 같이 짧게 표현할 수도 있다.
반응형
'개발 > JavaScript' 카테고리의 다른 글
JS - null과 undefined 차이 (0) | 2023.01.11 |
---|---|
JS - let, const, var (스코프, 호이스팅) (0) | 2023.01.11 |
JS - ==, ===의 차이점 (0) | 2023.01.10 |
JS - Class 문법 / constructor() / import (0) | 2023.01.05 |
JS - 허들넘기 / canvas태그 (0) | 2023.01.05 |
Comments