본문 바로가기
Programming/JavaScript

자바 스크립트 완전 기본 문법 및 예시 (let, prompt, if, alert) - Javascript, JS

by 심코딩 2022. 5. 16.

오늘은 처음으로 자바스크립트에 대해 업로드 해보려 합니다.

 

요즘 새로 Jupyter Notebook이랑 같이 공부하고 있는거라 기본개념부터 천천히 적어보려 합니다.


자바스크립트도 저는 비쥬얼스튜디오 코드를 이용해 실행을 합니다.

 

자바스크립트는 우리가 흔히들 쓰는 인터넷, 크롬과 같은 웹사이트를 같이 사용한다. 파일 확장자명은 html 이다.

비쥬얼 스튜디오코드에서 새파일을 만들고, 해당 파일이름을 "파일명".html로 지정해주면 된다.

 

다음 html:5 를 타이핑한 후 엔터를 치면 아래와 같이 기본 구조는 완성이 된다.

 

지금은 기본 문법만 배우면 되니 다른 것들은 모두 놔두고 body 안에서만 놀 것이다.

오늘은 기본 문법 중에서 let, prompt, alert, if를 이용하여 간단한 예시를 만들어 볼 것이다.

 

항상 느끼지만 코딩을 공부할 때에는 배우는 것도 중요하지만 배운걸 써먹어 보는게 가장 중요한 것 같다.

 


내가 입력한 지금 시간이 오전인가 오후인가?

 

코드를 실행을 하면, 시간이 몇시인지 입력해야 하며, 입력을 했으면 12시보다 낮은 숫자면 오전, 12시와 같거나 높은 숫자면 오후라고 안내해주는 코드를 만들어 보자. body 부분만 보자.

 

<body>
    <script>
        let num = prompt("지금 몇시입니까")

    
        if (num < 12) {
            alert("지금 시간은 " + num + "시 이므로 오전입니다")
        }
        if (num >= 12) {
            alert("지금 시간은 " + num + "시 이므로 오후입니다")
        } 
    
    </script>
</body>

 

코드를 실행을 하면,

 

몇 시인지 물어본 후
12시보다 낮으면 오전 출력
12시와 같거나 높으면 오후를 출력


이제 이 코드를 하나하나 설명하면서 기본 문법에 대해 설명해보겠다.

 

  • let은 자바스크립트에서 변수를 지정해주는 코드이다.
  • prompt는 파이썬으로 치면 input과 비슷한 역할을 한다. html 창을 실행 했을 때 컴퓨터가 질문을 하고 답을 적게끔 하는 코드이다.
let num = propmt("지금 몇시입니까")

즉 위에 있는 이 코드는 코드를 실행했을 시 컴퓨터가 지금 몇시냐고 물어보고, 내가 적은 답을 num 이라는 변수로 지정해두는 것이다.

 

  • if 함수는 파이썬과 동일하다. 조건부를 만드는 것이다. 만약 A라면 B를 실행해라. 하지만 파이썬과 구조가 다르다.
if (불_표현식) {

}

이렇게 된다. { } 사이에 원하는 실행값을 넣어주면 된다.

 

  • alert 함수는 결과값을 html에 경고창을 하나 띄워 알려주는 함수이다.
if (num < 12) {
	alert ("지금 시간은" + num + "시 이므로 오전입니다")
}

if (num >= 12) {
	alert ("지금 시간은" + num + "시 이므로 오후입니다")
}

즉 위에 있는 코드는 

 

만약 num이 12 이하이면, "지금 시간은 num시 이므로 오전입니다" 라는 alert를 띄워라

만약 num이 12 와 같거나 이상이라면, "지금 시간은 num시 이므로 오후입니다" 라는 alert를 띄워라

 

라는 코드가 된다.

 

아주 기본중의 기본이니 꼭 익숙해지도록 하자! (나한테 하는말)

댓글