JavaScript란?
JavaScript (객체 기반의 스크립트 언어)
HTML로 뼈대를 만들고 CSS로 디자인을 했다면, 자바스크립트로 웹의 동작을 구현한다.
JavaScript의 특징
- 서버가 아닌 브라우저가 해석한다.
- 동적이며, 타입을 명시할 필요가 없는 인터프리터 언어이다.
- 객체 지향형 프로그래밍과 함수형 프로그래밍을 모두 표현할 수 있다.
JavaScript 문법
var x = 10;
var result = x + 3;
- 실행문(statement)은 세미콜론(;)으로 구분된다.
- 대소문자를 구분하기 때문에 변수나 함수의 이름, 예약어 등을 작성할 때 정확히 구분해서 사용해야 한다.
식별자(identifier)
- 식별자는 변수나 함수의 이름을 작성할 때 사용하는 이름을 의미한다.
- 영문자(대소문자), 숫자, 언더스코어(_), 달러($)만 사용할 수 있다.
- 숫자와 식별자의 구별을 빠르게 하기 위해 숫자로는 시작할 수 없다.
- 자바스크립트는 유니코드(unicode) 문자셋을 사용한다.
- 작성방식으로는 Camel Case 와 snake_case가 있다.
JavaScript 적용
1. 내부 자바스크립트 코드로 적용 - <script>
태그 이용, <head>
태그나 <body>
태그, 또는 양쪽 모두에 위치 가능
<script>
console.log(`백틱을 사용하여 출력`);
console.log('어퍼스트로피 사용하여 출력');
console.log("쿼테이션 사용하여 출력");
</script>
2. 외부 자바스크립트 코드로 적용 - .js 확장자인 외부 파일을 <script>
태그를 이용하여 웹 페이지에 적용
- HTML 코드와 자바스크립트 코드를 분리하면 가독성도 올라가고 유지보수도 쉬워진다.
- 웹 브라우저가 미리 읽어 오기 때문에 로딩속도 또한 빨라진다.
console.log(`js 파일 내부에서 콘솔 출력`);
<script src="example.js"></script>
주석(Comments)
// 한 줄 주석 : VScode, Eclipse : ctrl + /
/* 여러줄 주석 : 범위 선택 후 ctrl + shift + /
여러줄 주석
여러줄 주석
여러줄 주석
여러줄 주석 */
// 자바스크립트 주석도 브라우저에서 읽어 들이므로 source 탭에 노출된다!
※ 참고자료
'🌎 Web > JavaScript' 카테고리의 다른 글
[JavaScript] 함수 선언문 vs 함수 표현식 (0) | 2022.04.04 |
---|---|
[JavaScript] 자바스크립트의 함수(Function) (0) | 2022.04.01 |
[JavaScript] 자바스크립트의 연산자(Operator) (0) | 2022.03.31 |
[JavaScript] 자바스크립트의 데이터 타입(Data type) (0) | 2022.03.31 |
[JavaScript] 자바스크립트의 변수(Variable) (0) | 2022.03.31 |