Web개발/JavaScript
[JavaScript] 자바스크립트 기초 문법 1
noobdev
2019. 11. 14. 20:01
자바스크립트는 html/css로 만들어진 정적인 웹을 동적으로 제어할 때 사용하는 언어이다.
html문서나 jsp문서등에서 쓰이는 언어이다.
프론트엔드를 지향하는 개발자에게는 필수적인 언어로써 배워둔다면 굉장히 도움이 되는 언어이다.
JQuery , Vue.js, React, Angular.js 등등 많은 프레임워크가 있다.
▶ 자바스크립트 선언문
<script>
자바스크립트 코드;
</script>
자바스크립트의 선언문은 <head> 태그 영역 또는 <body> 태그 영역 안에 <script> 소스코드;</script> 이렇게 선언한다.
우리나라의 대부분의 개발자는 <head>태그 영역에 선언하고 있다.
▶ 자바스크립트 주석
// 한 줄 주석인 경우
/*
여러줄 주석인 경우
*/
<!-- html 소스의 주석 -->
- 한 줄 주석인 경우 //를 사용
- 여러 줄 주석인 경우 /* */ 를 사용
- html 주석인 경우 <!-- -->를 사용
▶ 자바스크립트 파일을 분리해서 사용하기
- 자바스크립트를 html문서와 분리하여 사용하면 유지보수가 편리해진다.
- 자바스크립트를 분리할 경우 에디터에서 파일을 저장할 때 확장자를. js로 만든다.
- 따로 만든 자바스크립트 파일을 html 문서내에서 <script src = "자바스크립트 파일 경로">으로 선언하여 사용한다.
document.write('Hello World!'); //따로 분리할 자바스크립트 파일 .js확장자로 저장
위의. js파일은 Hello.js로 지정하였다.
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
<script src="Hello.js">
</script>
</head>
<body>
</body>
</html>
위와 같이 script 태그 안에 src속성을 주어 추가한다.
▶ 자바스크립트 코드 입력 시 주의 사항
1. 자바스크립트는 대소문자 구분하여 작성한다
New date(); // X
new Date(); // O
위의 코드는 날짜 객체를 생성하는 코드이다.
2. 코드는 할 줄을 작성한 후 세미콜론(;)을 붙여주는 게 좋다.
document.write("hi")document.write("bye") //X
document.write("hi"); document.write("bye"); //O
3. 코드를 작성할 때는 한 줄에 한 문장만 작성하는 것이 가독성에 좋다.
4. 문자형 데이터를 작성할 때는 큰따옴표(" ") 와 작은따옴표(' ')의 겹침 오류를 주의해야 한다.
document.write("나는 "초보 개발자"다!") //x
document.write("나는 '초보 개발자'다!") //o
5. 코드를 작성 할 때는 중괄호 또는 소괄호의 짝이 맞아야 한다.
document.write("welcome!"; //x
document.write("welcome!"); //o