Javascript 문법 정리

object shorthand assignment

//object shorthand assignment
let name="soyoung"
let age=20

let person={
    name:name,
    age:age
}
console.log(person)

{name: 'soyoung', age: 20}

 

 

키와 키 값에 들어가는 변수의 이름이 같다면

let name="soyoung"
let age=20

let person={
    name,
    age
}
console.log(person)

 

 

---

 

 

Destructuring

//Destructuring 구조 분해
let person = {
    name:"soyoung",
    age:20
}

/* let name = person.name
let age = person['age'] */

let{name,age}=person

console.log(name, age)

soyoung 20

 

 

값 가져올 때 많이 쓰이는 문법

let array = [1,2,3,4]
let [a,b]=array //array의 0번째부터 순서대로 대입이 된다
console.log(a,b)

1 2

 

 

 

rest 파라미터

let array = [1,2,3,4]
let [a,b,...rest]=array //a,b를 제외한 나머지 값을 rest에 넣는다
console.log(rest) //rest 값들은 array에 들어가있다 [3,4]

[3, 4]

 

 

---

 

spread (...)

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

let person2 = {...person} //객체의 깊은 복사 => 새로운 객체가 생성 됨
let person3 = person
console.log(person2)
console.log(person3)

console.log(person==person2)
console.log(person==person3)

{name: 'soyoung', age: 20}

{name: 'soyoung', age: 20}

 

false
true

 

출력은 똑같이 나오지만, 두 개의 복사 방법이 다르다

let person2 = {...person} //실제로 객체를 하나 더 생성하는 것 (두 개의 객체가 있게 되는 것)
let person3 = person // 객체의 주솟값만 복사 (객체는 하나이고 그 객체를 참조하는 변수가 두개=>person과 person3)

 

따라서 위의 두 객체는 완전 다른 객체가 되는 것이다

 

 

spread 뒤에 내용 추가도 가능

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

let person2 = {...person, address:"korea"} //객체의 깊은 복사 => 새로운 객체가 생성 됨
let person3 = person
console.log(person2)
console.log(person3)

{name: 'soyoung', age: 20, address: 'korea'} //기본에 있던 값에 address가 추가 됨

{name: 'soyoung', age: 20}

 

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

let person2 = {...person, name:"mimi"} //객체의 깊은 복사 => 새로운 객체가 생성 됨
let person3 = person
console.log(person2)
console.log(person3)

{name: 'mimi', age: 20} // 기본값을 복사하고, (name)키 값을 변경하면 그렇게 반영 된다

{name: 'soyoung', age: 20}

 

 

 

배열에도 똑같이 적용 됨

let a=[1,2]
let b=[...a,3]
console.log(b)

[1, 2, 3]

 

 

let c=[...a,...b]
console.log(c)

[1, 2, 1, 2, 3]

 

 

 

---

삼항연산자

//삼항연산자
let person = {name:"soyoung", age:20}

if(person){
    console.log(person.name)
}else{
    console.log("there is no person")
}

soyoung

 

 

 

let person = null

if(person){
    console.log(person.name)
}else{
    console.log("there is no person")
}

console.log(person? person.name:"there is no person")

there is no person

there is no person