README.md

Quest 03. 자바스크립트와 DOM

자바스크립트는 현재 웹 생태계의 근간인 프로그래밍 언어입니다. 이번 퀘스트에서는 자바스크립트의 기본적인 문법과, 자바스크립트를 통해 브라우저의 실제 DOM 노드를 조작하는 법에 대하여 알아볼 예정입니다.

자바스크립트의 역사
기본 자바스크립트 문법
DOM API
- document 객체
- document.getElementById(), document.querySelector(), document.querySelectorAll() 함수들
- 기타 DOM 조작을 위한 함수와 속성들
변수의 스코프
- var, let, const

자바스크립트는 버전별로 어떻게 변화하고 발전해 왔을까요?
- 자바스크립트의 버전들을 가리키는 ES5, ES6, ES2016, ES2017 등은 무엇을 이야기할까요?
- 자바스크립트의 표준은 어떻게 제정될까요?
자바스크립트의 문법은 다른 언어들과 비교해 어떤 특징이 있을까요?
- 자바스크립트에서 반복문을 돌리는 방법은 어떤 것들이 있을까요?
자바스크립트를 통해 DOM 객체에 CSS Class를 주거나 없애려면 어떻게 해야 하나요?
- IE9나 그 이전의 옛날 브라우저들에서는 어떻게 해야 하나요?
자바스크립트의 변수가 유효한 범위는 어떻게 결정되나요?
- var과 let으로 변수를 정의하는 방법들은 어떻게 다르게 동작하나요?
자바스크립트의 익명 함수는 무엇인가요?
- 자바스크립트의 Arrow function은 무엇일까요?

(Quest 03-1) 초보 프로그래머의 영원한 친구, 별찍기 프로그램입니다.
- 이 그림과 같이, 입력한 숫자만큼 삼각형 모양으로 콘솔에 별을 그리는 퀘스트 입니다.
  - 줄 수를 입력받고 그 줄 수만큼 별을 그리면 됩니다. 위의 그림은 5를 입력받았을 때의 결과입니다.
- if와 for와 function을 다양하게 써서 프로그래밍 하면 더 좋은 코드가 나올 수 있을까요?
- 입력은 prompt() 함수를 통해 받을 수 있습니다.
- 출력은 console.log() 함수를 통해 할 수 있습니다.
(Quest 03-2) skeleton 디렉토리에 주어진 HTML을 조작하는 스크립트를 완성해 보세요.
- 첫째 줄에 있는 사각형의 박스들을 클릭할 때마다 배경색이 노란색↔흰색으로 토글되어야 합니다.
- 둘째 줄에 있는 사각형의 박스들을 클릭할 때마다 enabled라는 이름의 CSS Class가 클릭된 DOM 노드에 추가되거나 제거되어야 합니다.
구현에는 여러 가지 방법이 있으나, 다른 곳은 건드리지 않고 TODO 부분만 고치는 방향으로 하시는 것을 권장해 드립니다.