JavaScript (개념, 변수, 주석)

1. 자바스크립트 (JavaScript)?

자바스크립트는 객체(Object) 기반의 스크립트 언어이다.

HTML로는 웹의 내용을 작성하고, CSS로는 웹을 디자인하는 것과 같이 자바스크립트는 웹의 동작 및 이벤트를 구현할수 있다. 자바스크립트는 주로 웹 브라우저에서 사용되나, Node.js와 같은 프레임워크를 통해 서버 측 프로그래밍에서도 사용 가능하다. 

 

1-1. 자바스크립트의 특징

• 객체 기반의 스크립트 언어이다.
• 동적으로 작동하며, 타입을 명시할 필요가 없는 인터프리터 언어이다.
• 객체 지향형 프로그래밍과 함수형 프로그래밍을 모두 표현할 수 있다.

---

2. 자바스크립트 코드 기초

2-1. 자바스크립트 적용

 

<script src="파일명.js"> </script>

로컬에 저장된 js파일을 HTML에 적용하는 방법이다. 

 

2-2. 변수(Variable)

변수는 var, let, const로 선언할 수 있다.

어떤것을 사용하는가에 따라서 변수의 유효범위가 달라진다.

 

var

 

var a = ''; // 문자열
var b = 0; // 숫자
var c = false; // Boolean
var d = null; // Null값
var e = undefined; // 언디파인드
var f = []; // 배열
var g = {}; // 객체
var h = function() {}; // 함수

자바스크립트 프로그램에서 앞으로 사용될 데이터를 저장할 변수를 지정해주는 과정이다.

그 변수들은 기본적으로 숫자나 문자열 등의 기본적인 값들을 저장하고 있다.

변수는 앞에 "var" 라는 키워드를 붙여서 선언해주고 값을 대입해주는 것을 "초기화"라고 한다.

또한 문장의 마지막마다 ";(세미콜론)"을 붙여서 하나의 문장을 끝내는 것이 원칙이다.

 

const

 

상수와 같이 한번 선언한 값에 대해서 변경할 수 없는 변수이다.

const a = 10;
a = 20; // Uncaught TypeError: Assignment to constant variable

 

하지만 객체나 배열의 내부는 변경할 수 있다는 것이 특징이다.

const a = {};
a.num = 10;
console.log(a); // {num: 10}

const b = [];
b.push(20);
console.log(b); // [20]

 

let

 

const는 변수의 재선언, 재할당이 모두 불가능하지만 let은 재할당이 가능하다.

let testCase1 = 'let' // output: let
let testCase1 = 'let2' // output: Uncaught SyntaxError: Identifier 'testCase' has already been declared
testCase1 = 'let3' // output: let3

const testCase2 = 'const' // output: const
const testCase2 = 'const2' // output: Uncaught SyntaxError: Identifier 'testCase' has already been declared
testCase2 = 'const3' // output: Uncaught TypeError:Assignment to constant variable.

이를 보면 let과 const에는 분명한 차이가 있다.

 

---

3. Comment 달기(주석)

한줄 주석

 

// single line 주석

 

여러줄 주석

 

/*
  Comment 1
  Comment 2
​*/

 

※ HTML 문서에 넣은 자바스크립트 주석은 소스보기를 통해서 일반 사용자들도 보는 것이 가능하다. 따라서 개발 과정에서 작성했지만 공개되면 안되는 주석들이 있다면 공개전에 삭제해두는 것이 좋다.