"간만에 찾아온 휴식"
Section 2 감상
Section 2 의 HA 를 잘 마쳤습니다. 이렇게 빨리 끝날거라고는 생각하지 않았어서 사실 조금 얼떨떨하기도 하네요. 자만하지 않아야 하겠지만, 적어도 오늘만큼은 성장했다는 증거로 받아들이고 자축해볼까 합니다.
내일은 그동안의 과정을 돌아볼 수 있도록 주어지는 Solo day 입니다. 내일과 주말에 걸쳐서 부족한 부분들을 돌아보려고 하는데요. 특히 비동기 부분이 많이 약하다는 생각이 들어 이 부분을 좀 더 중점적으로 공부해야겠다 마음먹고 있습니다.
그리고 시간이 되면 풀지 못한 추가적으로 주어졌던 자료구조의 코플릿 문제들과, toy 에서 이해하지 못했던 부분들도 살펴보려고 해요. 열심히 쫓아가보려고 했지만 일부 문제들은 풀기가 힘들거나, 아예 개념 자체를 이해하지 못했던 적도 있는 것 같습니다.
Section 3?
아주 약간 설명을 듣기는 했는데, 정확히 어떤 과정을 밟게될지는 아직 잘 모르겠습니다. 다만 알고리즘 공부에 앞으로 수학적인 부분이 들어간다고 하는데, 조금 걱정되기는 하네요. 난이도야 당연히 한번 더 올라가겠지만, 이 부분이야 22주 공부를 시작할 때부터 감안했던 것이기는 합니다. 최대한 힘을 내봐야죠.
구조 분해 할당
그래도 TIL 을 아무 것도 안하고 넘어가기는 좀 그래서 아주 간단하게 구조 분해 할당 구문을 짚어보려고 합니다. 전개(spread) 구문과 더불어서 정말 많이 쓰이는 것 같아요. 오늘은 아주 짧게만 짚어보고, 나중에 한 번 제대로 정리해볼 수 있는 기회를 만들어보려고 합니다.
공식 문서에서는 구조 분해 할당 구문을 다음과 같이 설명하고 있습니다.
구조 분해 할당 구문은 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 JavaScript 표현식입니다.
구조 분해 할당에서 아주 중요한 키포인트는 할당문의 좌변에서 사용한다는 점입니다. 기존의 변수 선언 그리고 할당의 과정이 변수의 이름을 좌변에 그리고 할당할 것을 우변에 배치했다면, 구조 분해 할당 구문은 역으로 사용한다고 할 수 있죠.
let a = [1, 2, 3, 4, 5];
let [b, c, ...d] = a;
console.log(b); // b = 1;
console.log(c); // c = 2
console.log(d); // d = [3, 4, 5];예시를 보면 a 라는 배열을 우변에 배치하고, 구조 분해 할당 구문을 활용한 b, c, d 를 좌변에서 선언하고 있죠. 이렇게 사용하게 되면 a 라는 배열의 요소를 하나씩 순차적으로 좌변의 변수에 할당하게 됩니다. 만약 [b, c] 까지만 있었다면 b = 1, c = 2 까지만 진행되지만, 위의 예시에서는 ...d 를 이용해 남은 배열 전부를 d 에 할당하고 있습니다. 이 경우 ... 의 활용은 전개 구문이 아닌 rest pattern 이 된다고 합니다.
효율적이면서 실용적인 구조 분해 할당 구문의 예시를 하나 살펴보고 마무리하도록 하겠습니다. 바로 변수의 두 값을 서로 교환해야 할 때인데요. 기존에는 임시 변수를 생성해 어느 한 값을 임시 변수에 할당해두고서 교환하는 형태여야 하지만, 구조 분해 할당 구문을 활용하면 새로운 임시 변수를 생성할 필요 없이 바로 교환이 가능합니다.
let a = 1;
let b = 2;
// 기존의 방법
let temp = a;
a = b;
b = temp;
// 구조 분해 할당 구문의 활용
[a, b] = [b, a];