기초/JavaScript
JS 기초 ) 구조분해할당 (Destructuring assignment)
디깅
2022. 8. 3. 15:05
728x90
구조분해할당 (Destructuring assignment)
: 배열이나 객체의 속성을 분해해서 그 값은 변수에 담을 수 있게 하는 표현식
let [x, y] = [1,2];
console.log(x); // 1
console.log(y); // 2
let usres = ["Mike", "Tom", "Jane"];
let [ user1, user2, user3] = users;
// user1 = users[0] Mike
// user2 = users[1] Tom
// user3 = users[2] Jane
배열 구조 분해
let str = "Mike-Tom-Jane";
let [user1, user2, user3] = str.split('-');
// "Mike" "Tom" "Jane"
해당값이 없으면 undefined 으로 들어간다.
미리 기본값을 지정해둬서 , 해당값 없을 땐 기본값으로 지정할 수도 있다
let [a,b,c] = [1,2];
let [a=3, b=4, c=5] = [1,2];
console.log(a); // 1
console.log(b); // 2
console.log(c); // 5
일부 반환값을 무시할 수도 있다.
let [usrer1, ,user2] = ["Mike", "Tom", "Jane","Tony"];
console.log(user1); // 'Mike'
console.log(user2); // 'Jane'
바꿔치기도 편리하게 가능하다.
[a,b] = [b,a]
let a = 3;
let b = 5;
[a.b0 = [b,a]
let user = {name: "Mike" , age : 30};
let {name,age} = user;
let {age, name} = user;
// 순서는 상관없다
console.log(name); //"Mike"
console.log(age); //30
//이름도 변경 가능하다
let {name: userName, age: userAge} = user;
console.log(name); //"Mike"
console.log(age); //30
기본값을 줄 수 있다.
let user = {name: "Mike" , age : 30};
let {name,age,gender} = user; //gender = undefined
let {name,age,gender="male"} = user;
반응형