머리글
React 프로젝트를 위한 최소한의 'JavaScript 문법'을 학습했다. 이전에 JS를 살짝 맛보기는 했다. 이미 아는 내용은 복습한다는, 그리고 모르는 내용은 더 알아가겠다는 마인드로 접근했다. 오늘은 크롬에서 시크릿 모드를 켠 후, 해당 창에서 콘솔 창을 띄워놓고 학습했다. 이유는 모르겠다. 중간에 불편해서 VScode로 넘어갔다.
자바스크립트 기초(2)
1) let, const와 scope(그리고 var)
let과 const에 관해 학습했다. let은 재할당이 가능하고 const는 상수이기 때문에 재할당이 불가능하다는 내용인데, 복습 차원에서 다시 한번 코드를 입력해봤다.
최초에 let을 통해 b라는 변수에 1을 할당했다가 이후 2로 재할당을 했다. 콘솔에 로그를 찍어보면 '2'라는 값으로 나온다. 재할당이 가능하다는 의미이다. 반면 const로 선언한 c라는 변수는 다른 값을 재할당함과 동시에 콘솔에 오류가 입력되었다. 재할당이 불가능하다는 뜻이다.
'scope'의 개념도 살펴보아야 한다. 'scope'란 특정한 변수를 선언했을 때, 그 변수를 사용할 수 있는 '유효범위'를 말한다. 보통 코드에서 중괄호(='{}')를 block이라 명명하는데, let과 const의 scope는 'block 단위'이다. 반면 var의 scope는 'function 단위'이다.
콘솔에 찍힌 '111'은 if문에 대한 값이다. let과 const는 block 단위이기에, if block을 넘은 이후에는 a와 b가 모두 0으로 출력되었다. 반면 var는 function 단위이기에 if block을 나왔다고 해서 0이 출력되는 것이 아니라, 마지막에 선언한 '1'이라는 값이 출력되었다.
오늘 TIL에서는 조금 더 deep하게 들어가겠다. ES6 문법에서 let과 const가 추가된 이유는 'var'의 불편함에서 비롯되었을 것이다. 'var'의 어떤 점이 그렇게 불편했는지 공부해봤다.
'var'는 기본적으로 '재선언'이 가능하다. 이미 선언한 변수와 같은 이름의 변수를 다시 선언할 수 있다는 것인데, let과 const는 '재선언'은 불가능하다. 변수를 유연하게 사용할 수 있다는 점은 장점일 수 있지만, 기존에 선언한 변수의 존재를 잊고 재선언하는 경우에는 문제가 될 수 있다. 길고 복잡한 코드에서 동일한 이름의 변수가 여러번 선언되면 어떤 부분에서 값이 변경되고 문제가 발생하는지를 파악하기가 어렵다.
2) 함수
해당 강의에서는 함수를, 형태를 살펴보는 정도로만 알려주었다. 복습 차원에서 함수의 형태를 다시 공부해봤다.
가장 상단의 코드는 '함수 선언식'이다. function 키워드를 사용했다.
그 다음 코드는 '함수 표현식'이다. 함수명을 변수로 선언하여 함수명에 실제 함수를 할당하는 형태를 취한다. 여전히 function 키워드를 사용한다.
마지막은 'Arrow Function'이다. 함수명을 변수로 선언했으나 function 키워드를 제거하고 괄호와 중괄호 사이에 화살표를 추가하는 방식을 택했다.
3) Class
예전 TIL에서 토토로 이미지를 업로드하고, 토토로가 '객체'라면 class는 '조립도'라고 하며 class에 관한 내용을 정리한 바 있다. 사실 조립도 내지 설계도라는 표현은 조금 어색한 비유였다고 생각된다. 코드를 다시 살펴보니 'class'를 '거푸집'이라고 이해하는 것이 더 괜찮은 것 같다.
constructor()는 객체의 기본상태를 설정해주는 생성자 method이다. 'new'에 의해서 자동으로 호출되기에 특별한 절차 없이 객체를 '초기화'할 수 있다.
-초기화: 객체를 선언하고 값을 최초로 할당하는 것
new Cat("perl")를 호출하면 새로운 객체가 생성된다. 넘겨받은 인수와 함께 constructor가 자동으로 실행되고, 이때 인수 "perl"이 this.name에 할당된다. 이후 cat.showName()과 같은 객체 method를 호출할 수 있게 된다.
회고
러닝타임 42분, 극악무도한 프로그래밍 인강계의 '아바타'를 견디지 못하고 24분(=class)에서 마무리 지었다. 내일은 'class의 상속', 'spread 연산자', '삼항 연산자'를 시작으로, 시간과 체력이 허락하는 선에서 array의 내장 함수를 몇 가지 살펴보도록 하겠다.
오늘 공부한 내용은 불과 며칠 전에 살펴보았던 내용들이다. 부끄러울 정도로 짧은 기간이지만 학습량이 계속 누적되다 보니 기존의 개념이 달리 보이기 시작한다. 특정 개념을 전보다 더 명확하고 간결하게 설명할 수 있을 것 같다. 물론 이해가 되지 않는 부분이 더 많지만 '재밌다'라는 감정을 느꼈다는 사실은 굉장히 고무적이다. '재밌다'라는 감정에 TIL 시스템도 한몫했다.
보통 '즉각적인 보상'은 '나쁜 습관'에서 찾기 쉽다. TIL을 작성하는 것은 '좋은 습관'에서 찾을 수 있는 '즉각적인 보상'인 것 같다. 성취감이 속된 말로 미쳤다. 공부를 하기 위해 TIL을 작성하는 것이 아니라, TIL을 작성하기 위해 공부를 하는 정도로 느껴진다. 어떤 식으로든 공부를 지속한다는 사실에는 변함이 없으니까... 참 좋은 system이다! 내일도 화이팅!
