[자바스크립트] 구조 분해 할당(Destructuring assignment)
1833 단어 JavaScript구조분해할당JavaScript
Destructuring assignment
구조 분해 할당 구문은 배열의나 객체의 속성을 분해해서 그 값을 변수에 담을 수 있게 하는 표현식
let users = ['Mike', 'Tom', 'Jane'];
let [user1, user2, user3] = users; // let user1 = users[0]; , let user2 = users[1] , let user3 = users[2]
console.log(user1); // 'Mike'
console.log(user2); // 'Tom'
console.log(user3); // 'Jane'
배열 구조 분해 : 기본값
let [a,b,c] = [1,2]; // c 는 undefined!
let [a=3, b=4, c=5] = [1,2];
cosole.log(a); //1 배열에서 얻어온 값
cosole.log(b); //2 배열에서 얻어온 값
cosole.log(c); //5
배열 구조 분해: 일부 반환값 무시
let [user1, ,user2] = ['Mike', 'Tom', 'Jane', 'Tony']; // 무시가능
console.log(user1); // 'Mike'
console.log(user2); // 'Jane;
배열 구조 분해 : 바꿔치기
let a = 1;
let b = 2;
let c = a;
a = b;
b = c; // b와 a는 바뀌게 되고 c는 임시로 만들어준 변수이다.
[a,b] = [b,a]; // 여기서 구조 분해 할당은 유용하게 쓰인다.
객체 구조 분해
let user = {name: 'Mike', age: 30};
let {name, age} = user; // let name = user.name , let age = user.age
console.log(name); // 'Mike'
console.log(age); // 30
객체 구조 분해 : 새로운 변수 이름으로 할당
let user = {name: 'Mike', age: 30};
let {name: userName, age: userAge} = user;
console.log(userName); // 'Mike'
console.log(userAge); // 30
객체 구조 분해 : 기본값
let user = {name: 'Mike', age: 30};
let {name, age, gender} = user; // gender 값 undefined
let {name, age, gender = 'male'} = user; // undefined일 경우 새로운 객체가 생성된다.
let user = {
name: 'Jane',
age: 18,
gender: 'female'
};
let {name, age, gender = 'male'} = user;
console.log(gender); // 'female' 원래 할당된 객체의 값이 나온다
Author And Source
이 문제에 관하여([자바스크립트] 구조 분해 할당(Destructuring assignment)), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://velog.io/@tmdckzm/자바스크립트-구조-분해-할당Destructuring-assignment
저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
let users = ['Mike', 'Tom', 'Jane'];
let [user1, user2, user3] = users; // let user1 = users[0]; , let user2 = users[1] , let user3 = users[2]
console.log(user1); // 'Mike'
console.log(user2); // 'Tom'
console.log(user3); // 'Jane'
let [a,b,c] = [1,2]; // c 는 undefined!
let [a=3, b=4, c=5] = [1,2];
cosole.log(a); //1 배열에서 얻어온 값
cosole.log(b); //2 배열에서 얻어온 값
cosole.log(c); //5
let [user1, ,user2] = ['Mike', 'Tom', 'Jane', 'Tony']; // 무시가능
console.log(user1); // 'Mike'
console.log(user2); // 'Jane;
let a = 1;
let b = 2;
let c = a;
a = b;
b = c; // b와 a는 바뀌게 되고 c는 임시로 만들어준 변수이다.
[a,b] = [b,a]; // 여기서 구조 분해 할당은 유용하게 쓰인다.
let user = {name: 'Mike', age: 30};
let {name, age} = user; // let name = user.name , let age = user.age
console.log(name); // 'Mike'
console.log(age); // 30
let user = {name: 'Mike', age: 30};
let {name: userName, age: userAge} = user;
console.log(userName); // 'Mike'
console.log(userAge); // 30
let user = {name: 'Mike', age: 30};
let {name, age, gender} = user; // gender 값 undefined
let {name, age, gender = 'male'} = user; // undefined일 경우 새로운 객체가 생성된다.
let user = {
name: 'Jane',
age: 18,
gender: 'female'
};
let {name, age, gender = 'male'} = user;
console.log(gender); // 'female' 원래 할당된 객체의 값이 나온다
Author And Source
이 문제에 관하여([자바스크립트] 구조 분해 할당(Destructuring assignment)), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@tmdckzm/자바스크립트-구조-분해-할당Destructuring-assignment저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)