[JS 1일차]

구조 분해 할당

객체 이름을 지정할수있고 변수에 담을수도있다.

// 구조 분해 할당

const user = {

  name: 'Heropy',
  age: 85,
  email: 'thesecon@gmail.com',
  address: 'USA'
}

const {name: heropy ,age, address = 'Korea'} = user 
// E.g, user.address

console.log(`사용자 이름은 ${heropy}입니다`)
console.log(`${heropy}의 나이는 ${age}세입니다`)
console.log(`${heropy}의 이메일 주소는 ${user.email}입니다`)
console.log(address)

const fruits = ['Apple', 'Banana', 'Cherry']
const [, , b] = fruits
console.log(b)

전개연산자 (Spread)

객체데이터를 화살표함수에서 축약형으로 반환하고싶다면 소괄호 열어서 대괄호로 감싸줘야 출력된다.

const fruits = ['Apple', 'Banana', 'Cherry', 'Orange']
console.log(fruits)
console.log(...fruits)

// ...C 나머지 등등
const toObject = (a, b, ...c) => ({a, b, c})
console.log(toObject(...fruits))

데이터 불변성 (Immutability)
원시 데이터: String, Number, Boolean, undefined, null
참조형 데이터: Object, Array, Function

|1: |2: |3: |4:

참조형 데이터

불변의 데이터가 아니기때문에 생김새가 똑같더라도 같은 데이터가 아닐수가있으며 한쪽을 수정하면 다른쪽도 수정될수도있다.

let a = {k : 1}
let b = {k : 1}
console.log(a, b, a === b)
a.k = 7
b = a
console.log(a, b, a === b)
a.k = 2
console.log(a, b, a === b)
let c = b 
console.log(a, b, c, a === c)
a.k = 9 
console.log(a, b, c, a === c)

복사

import _ from 'lodash'

// 얕은 복사(Shallow Copy), 깊은 복사(Deep copy)

const user = {
  name: 'Heropy',
  age: 85,
  emails: ['bulehychoi@naver.com']
}
// copyUser = user를 새로운 객체데이터로 반환한다. (Object.assign({}, user))
// _.cloneDeep(user) 깊은복사
// const copyUser = Object.assign({},user) 얕은복사 왜냐면 emails의 배열까지는 반환못한다.
const copyUser = _.cloneDeep(user)
console.log(copyUser === user)

// 같은 곳을 바라보기때문에 copyuser도 바뀐다. 이런걸 방지하기위해 복사라는 개념을 사용한다.
user.age = 22 
console.log('user', user)
console.log('copyUser', copyUser)

console.log('------')

// emails는 배열데이터라서 
user.emails.push('neo@zillinks.com')
console.log(user.emails === copyUser.emails)
console.log('user', user)
console.log('copyUser', copyUser)