본문 바로가기
바닐라코딩/Prep

바닐라코딩 prep 3주차 정리

by Dev_Dank 2021. 8. 10.

바닐라코딩의 prep 과정을 수강한 내용을 정리한 포스팅입니다.


강의

이번주 강의는 원시타입과 참조타입에관한여 그리고 es5 이후로 추가된 자바스크립트의 기능에대해 공부했습니다. 

-Primitive & Reference type

자바스크립트에서 객체(object)를 제외한 모든 자료형은 원시타입입니다. 즉 객체만 참조형입니다. 
참조형과 원시타입의 차이는 변수에 저장할때 해당 자료형의 메모리 주소를 저장하는지 아니면 실제 자료를 저장하는지로 구분됩니다.(실제로는 변수가 원시형이든 참조형이든 변수는 메모리주소가 저장됩니다. 다만 설명의 용이를 위해 대부분 위와 같이 구분하는 것 같습니다.) 코어자바스크립트 서적의 챕터 1과 모던 자바스크립트 deep dvie 서적의 원시형과 참조형에 관한 설명파트를 보면 이해가 더 쉽습니다.  

-ES5 and Beyond

es5이후 추가된 let, const의 경우 함수스코프가 아니라 블록레벨 스코프를 지니며 호이스팅이 되지만 Temporal Dead Zone이 존재하여 var와는 차이점을 보입니다. 

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const

그외에 rest와 spread 연산자를 사용하면 이터러블(배열, 문자열, 유사배열 등등)을 배열로 쉽게 만들거나 함수에서 인자를 갯수 제한없이 받을수 있습니다. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters

Destructuring은 배열과 객체에 사용가능한 문법으로 편하게 변수에 값을 할당 가능합니다. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment

화살표 함수는 this를 할당하지 않으며 더 간단하게 함수를 작성 가능하게 해줍니다. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions

과제

금주의 과제는 퀴즈카드 게임을 구현하는 것이었습니다. 

제한시간설정을 위해서 비동기로 settimeout setinterval등을 사용하는것에 주로 초점을 맞추었습니다. 

이번주 코드리뷰를 받은부분에서는 별달리 큰 개선점을 전달 받지 못했습니다. 로직이 괜찮은 것이라는 의미로 받아들이면 되는 걸까요? 


부족하다고 느낀점

-디자인능력?

예시로 주어진 UI에서 벗어나 뭔가 더 이쁜 작업물을 만드는건 아직 서툰것 같습니다. 향후 여러 작업을 하며 경험이 쌓이면 개선될까 싶습니다.

댓글