- Today
- Total
목록NomadCoders (34)
hye-log
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/6W5Wk/btrtlVifcH0/KPgHXkC3BHGuWoY8q8iKFk/img.png)
console.log() 함수는 괄호 안에 있는 숫자나 문자를 console 창에 출력한다. 우리는 계산기를 만들건데 계산기마다 값을 바꾸는 일을 하는 것은 귀찮은 일이다. variable(변수)는 값을 저장하거나 유지하는 역할을 한다. vairable을 정의할 때에는 주로 const와 함께 사용하는데, const(상수)는 바뀌지 않고 계속 유지되는 값을 의미한다. 변수의 이름에 띄어쓰기가 필요하다면 JavaScript에서는 camelCase 방법을 사용하여 단어를 구분할 때마다 대문자를 사용한다. 예를 들어서 myname을 camelCase 방법으로 작성하면 myName으로 정의할 수 있다. (파이썬에서는 snake_Case 방법으로 작성하는데 예를 들어 my_name 식으로 표현한다.)
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/r2hka/btrtjQhENrR/zT4fQyqjtLmeE6cJDCkfr1/img.png)
JavaScript에서는 크게 두 가지 자료형을 다룬다. 첫 번째로, 숫자(number)이다. 숫자는 정수형인 integer와 부동 소수점형인 float가 있다. console에 2+2 만 입력해도 JavaScript가 숫자를 인식하고 계산해야 하는 것을 알고 결과값을 출력해준다. 두 번째로, 문자(text)이다. string은 작은따옴표(')나 큰따옴표(")를 사용하여 처음부터 끝까지 문자로 구성된 형식이다. 따옴표를 쓰지 않으면 JavaScript는 이해하지 못한다.
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/GoIGT/btrtgr3KDqd/lAiAZfunOppkt7gjOuXCoK/img.png)
웹 페이지를 만들기 위해서는 index.html / app.js / style.css 세 가지가 필요하다. app.js는 JavaScript를 기반으로 작성하는 파일이고, style.css는 CSS를 기반으로 작성하는 파일이다. 이 두 파일을 웹 브라우저에서 실행하면 단순히 코드를 해석하는게 아니라 읽어오는 역할만 한다. 따라서 두 파일을 해석할 수 있는, 합쳐서 보여주는 '접착제' 역할이 필요하다. 바로 이 접착제 역할을 하는 것이 HTML이다. 웹 브라우저는 HTML을 열고, HTML에서 CSS와 JavaScript 파일을 가져오게 된다. 코드는 간단하다. VSCode에서 자동 완성 기능을 이용하여 '!' 입력 후 엔터를 치면 기본 양식을 제공해준다. 여기서 우리는 #11 에 app.js를 연결해주고..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/GRGM5/btrtifWgKnO/NOkGy8EABtOxtKRZj2Gtx0/img.png)
우리는 웹 브라우저를 통해서 JavaScript를 사용하고 있다. 웹 브라우저에서 F12(개발자 도구)를 눌러 console 창을 실행하면 JavaScript를 실행시킬 수 있다. 웹 브라우저에 내장되어 있기 때문에 사용 가능한 것이다. 하지만 여기서 JavaScript를 사용하기에는 어렵다. console 창에서는 한 줄씩만 코딩할 수 있는데, 우리는 스크롤하면서 코드 복붙도 하고 싶기 때문이다. 따라서 VSCode나 Replit을 이용하여 JavaScript를 코딩할 수 있다.