const[새로운 변수명, 새로운 변수명] = 배열
const array = ['i', 'love', 'you']
const [1, 2] = arr
Uncaught SyntaxError: Invalid destructuring assignment target
변수 선언이 안되는 타입은 실행이 되지 않는다.
const ['1st', '2st'] = arr
Uncaught SyntaxError: Invalid destructuring assignment target
변수 선언이 안되는 타입은 실행이 되지 않는다.
const [first, second] = array
console.log(first)//'i'
console.log(second)//'love'
array[1] = 'do not'
console.log(second)//'love'
깊은복사라 바뀌지 않는다.
const result = []
function foo([first, second]) {
result.push(second)
result.push(first)
}
foo(array)
console.log(result)//['love', 'i']
const array = ['code', 'states', 'im', 'course']
const [start, ...rest] = array
console.log(start)//'code'
console.log(rest)//["states", "im", "course"]
const name = '김코딩'
const age = 28
const person = {
name,
age,
level: 'Junior',
}
name 하고 age에 밖에 변수가 key값으로 할당된 내용이 value값으로 들어갑니다.
console.log(person.name) ='김코딩'
const student = { name: '박해커', major: '물리학과' }
const { name } = student
console.log(name)//'박해커'
console.log({name})//{name: "박해커"}
student.name = '김코딩'
console.log(name)//'박해커'
깊은복사라서 바뀌지 않는다.
const student = { name: '최초보', major: '물리학과', grade: 'A' }
const { name, ...args } = student
console.log(name)//'최초보'
console.log(args)//{major: "물리학과", grade: "A"}
const student = { name: '최초보', major: '물리학과', lesson: '양자역학', grade: 'B+' }
function getSummary({ name, lesson: course, grade }) {
return `${name}님은 ${grade}의 성적으로 ${course}을 수강했습니다`
}
console.log(getSummary(student))//`최초보님은 B+의 성적으로 양자역학을 수강했습니다`
const student = { name: '최초보', major: '물리학과', lesson: '양자역학', grade: 'B+' }
function getSummary({ name, lesson, grade }) {
return `${name}님은 ${grade}의 성적으로 ${lesson}을 수강했습니다`
}
console.log(getSummary(student))//`최초보님은 B+의 성적으로 양자역학을 수강했습니다`
const user = {
name: '김코딩',
company: {
name: 'Code States',
department: 'Development',
role: {
name: 'Software Engineer'
}
},
age: 35
}
const changedUser = {
...user,
name: '박해커',
age: 20
}
console.log(changedUser)
{
name: '박해커',
company: {
name: 'Code States',
department: 'Development',
role: {
name: 'Software Engineer'
}
},
age: 20
}
const overwriteChanges = {
name: '박해커',
age: 20,
...user
}
console.log(overwriteChanges)
{ name: '김코딩',
age: 35, company: {
name: 'Code States',
department: 'Development',
role: {
name: 'Software Engineer'
}
}
}
const changedDepartment = {
...user,
company: {
...user.company,
department: 'Marketing'
}
}
console.log(changedDepartment)
{ name: '김코딩',
company: {
name: 'Code States',
department: 'Marketing',
role: {
name: 'Software Engineer'
}
},
age: 35
}
const changedDepartment = {
...user,
company: {
department: 'Marketing',
...user.company
}
}
console.log(changedDepartment)
{ name: '김코딩',
company: {
name: 'Code States',
department: 'Development',
role: {
name: 'Software Engineer'
}
},
age: 35
}
출처: 코드스테이츠