🌎 Web/JavaScript

[JavaScript] JavaScript란?

오늘 ONEUL 2022. 3. 31. 03:27

JavaScript란?

JavaScript (객체 기반의 스크립트 언어)

HTML로 뼈대를 만들고 CSS로 디자인을 했다면, 자바스크립트로 웹의 동작을 구현한다.

 

 

 

 

JavaScript의 특징

  1. 서버가 아닌 브라우저가 해석한다.
  2. 동적이며, 타입을 명시할 필요가 없는 인터프리터 언어이다.
  3. 객체 지향형 프로그래밍과 함수형 프로그래밍을 모두 표현할 수 있다.

 

 

 

 

JavaScript 문법

var x = 10;
var result = x + 3;
  • 실행문(statement)은 세미콜론(;)으로 구분된다.
  • 대소문자를 구분하기 때문에 변수나 함수의 이름, 예약어 등을 작성할 때 정확히 구분해서 사용해야 한다.

 

 

 

 

식별자(identifier)

  • 식별자는 변수나 함수의 이름을 작성할 때 사용하는 이름을 의미한다.
  • 영문자(대소문자), 숫자, 언더스코어(_), 달러($)만 사용할 수 있다.
  • 숫자와 식별자의 구별을 빠르게 하기 위해 숫자로는 시작할 수 없다.
  • 자바스크립트는 유니코드(unicode) 문자셋을 사용한다.
  • 작성방식으로는 Camel Casesnake_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 탭에 노출된다!

 

 

 

 

※ 참고자료

http://www.tcpschool.com/javascript/intro

https://www.w3schools.com/js/default.asp