[JavaScript] 자주 쓰이는 자바스크립트 문법 정리

워네·2022년 5월 27일
0

🌙 JavaScript

목록 보기
4/4
post-thumbnail

📖 object shorthand assignment

let name = "noona"
let age = 17

// 원래 쓰던 문법
let person = {
	name : name,
    age : age
}

// 줄여쓰는 문법
let person = {
	name,
    age
}

✔️ 키와 키값에 들어가는 변수 이름이 같다면 줄여쓸 수 있다.


📖 Destructuring

let person = {
	name : "noona",
    age : 20
}

// 원래 쓰던 문법
let name = person.name
let age = person['age']

// 줄여쓰는 문법
let {name, age} = person

// 원하는 값만 가져올 수도 있다.
let {name} = person 

✔️ 객체 안에서 가져오고 싶은 key값을 mention하면 key값의 이름으로 변수가 만들어지고 그 값이 들어가게 된다.

💡 배열에서도 적용 가능

let array = [1,2,3,4]
let [a,b] = array

console.log(a,b) // 1 2

💡 나머지 값들을 넣고 싶을 때

// ... 문법
let [a,b,...rest] = array

console.log(rest) // [3,4]

📖 spread

let person = {name : "noona", age : 12}

let person2 = {...person}
✔️ person값이 person2에 복사된다.
   (실제로 객체를 하나 더 생성하는 것)

let person3 = person
💡 이렇게 복사하면 객체의 주소값만 복사되는 
   (, 객체는 하나이고 그 객체를 참조하는 변수가 두 개)

// 기존 값에 추가, 변경도 가능
let person2 = {...person, address : "incheon", name : "jimin"}

📖 삼항연산자

let person = {name : "noona", age : 17}

// 원래 쓰던 문법
if (person) {
	console.log(person.name)
} else {
	console.log("there is no person")
}

// 줄여 쓰는 문법
console.log(person ? person.name : "there is no persion")
profile
front-end developer 🐣

0개의 댓글