본문 바로가기

destructuring3

모던 자바스크립트 - Destructuring(구조 분해) With 함수 함수 + 배열 + Destructuring문법 함수가 리턴하는 값이 배열일 때 function getArray() { return ['컴퓨터','냉장고','세탁기'] } const [el1,el2,el3] = getArray(); Rest파라미터가 배열이라는 점을 이용 function printWinners(...args){ const [macbook, ipad, airpads, ...coupon] = args; console.log('이벤트 결과를 알립니다.'); console.log(`맥북의 주인공은 '${macbook}'님 입니다.`); console.log(`아이패드의 주인공은 '${ipad}'님 입니다.`); console.log(`에어팟의 주인공은 '${airpads}'님 입니다.`); con.. 2023. 2. 25.
모던 자바스크립트 - Destructuring(구조 분해) With 객체 일반적으로 객체의 프로퍼티 값에 접근할 때, 점 표기법으로 매번 작성하지 않고 프로퍼티네임 자체를 변수처럼 사용한다. const macbook = { title: '맥북 프로 16형', price: 3690000, memory: '16GB', storage: '1TB SSD 저장 장치', display: '16형 Retina 디스플레이' } const title = macbook.title; const price = macbook.price; 이런 상황에서 Destructuring을 활용할 수 있다. const macbook = { title: '맥북 프로 16형', price: 3690000, memory: '16GB', storage: '1TB SSD 저장 장치', display: '16형 Retin.. 2023. 2. 25.
모던 자바스크립트 - Destructuring(구조 분해) With 배열 Destructuring(구조 분해) ES2015 배열과 객체는 여러 값을 담는 데 유용하며, 이를 분해하는 문법 배열과 객체는 구조가 다르므로, Destructuring 문법도 적용 방법이 다르다. 배열 - 인덱스로 여러 값의 순서가 있음 객체 - 프로퍼티 네임으로 여러 값의 이름이 있음 Destructuring(구조 분해) - 배열 코드 설명 : 등수에 따라 상품을 나누기 위해, 상품 이름으로 만든 변수에 배열의 요소를 순서대로 할당 const rank = ['효준','재하','수민','상훈']; const macbook = rank[0]; const ipad = rank[1]; const airpods = rank[2]; const coupon = rank[3]; 처음부터 상품이름에 멤버 이름을 할.. 2023. 2. 25.