Javascript 문법 요약정리 (1편. 자료형과 기초 문법)

안녕하세요, 왕초보 코린이를 위한 코딩유치원에 오신 것을 환영합니다.

 

 

오늘 부터는 항상 다뤄오던 파이썬을 잠시 미뤄두고, 자바스크립트를 빠르게 공부해보려합니다.

 

빠른 시간 안에 최대한 핵심만 짚고 넘어가는 식으로 정리하였으며, 왕초보를 위한 Javascript 관련 글은 다음에 여유가 될 때 꼭 쓰도록 하겠습니다.

 

<자바스크립트 관련 글>

 

2021.04.21 - [웹 개발/프론트앤드] - Javascript 문법 요약정리 (1편. 자료형과 기초 문법)

2021.04.22 - [웹 개발/프론트앤드] - Javascript 문법 요약 정리 (2편. 연산자)

2021.04.23 - [웹 개발/프론트앤드] - Javascript 문법 요약 정리 (3편. 제어문_if/switch/while/for 문)

 

 

 

---

자바스크립트란?

웹 개발의 프론트엔드 개발을 이야기하면서 꼭 빠지지 않고 언급되는 JavaScript는 파이썬과 같은 언어의 일종입니다.

WEB은 뼈대와 내용을 구성하는 HTML, 디자인을 담당하는 CSS, 그리고 이것들을 살아움직이게 하는 JavaScript로 만들어집니다.

 

 

---

자료형 (data type)

모든 언어의 시작인 자료형에 대해서 가장 먼저 알아보겠습니다. 자바스크립트에서는 data type을 기본 타입이라고 부른다고 합니다. 기본 타입은 원시 타입과 객체 타입으로 구분할 수 있으며 아래와 같은 타입들이 있습니다.

 

원시 타입 (primitive type)

 

1. 숫자 (number)

 

다른 언어와 다른 자바스크립트만의 특이한 점은 숫자가 정수와 실수로 나뉘지 않고 모든 수를 실수로만 표현합니다.

var Num1 = 10;     // 정수가 아닌 실수

var Num2 = 10.00; // 소수점을 사용한 표현

var Num3 = 10e8;   // 1000000000

var Num4 = 10e-4; // 0.001

 

2. 문자열 (string)

 

문자열은 큰따옴표("")나 작은따옴표('')로 감싼 문자나 숫자를 의미합니다. 이 부분은 파이썬과 완전 동일하네요.

 

var string = "이것은 문자열"
var string2 = "파이썬과 똑같네"

 

3. 불리언 (boolean)

 

True / False, 따로 예약어로 True와 False를 사용

 

4. 심볼 (symbol)

 

심볼 타입은ECMAScript 6부터 새롭게 추가된 타입이라고 합니다. 심볼은 유일하고 변경할 수 없는 타입이라고 하네요. 일단 잘 모르겠거니와 잘 쓸것 같지도 않으니 이 정도만 알고 넘어가겠습니다.

 

5. undefined

 

아래의 코드와 같이 그냥 변수 a를 선언해주고 안에 값을 안넣어주면 a는 undefined 타입입니다. 초기화되지 않은 변수나 존재하지 않는 값에 접근할 때 undefined를 반환한다고 합니다.

var a

 

 

객체 타입 (object type)

 

6. 객체 (object)

 

객체는 여러 프로퍼티나 메소드를 같은 이름으로 묶어놓은 집합체입니다. 일단 프로퍼티나 메소드는 나중에 배울 예정이니, 객체라는 것도 기본 타입중에 하나구나라고 알고 넘어가도록 합시다.

 

var human = { name: "Roy", age: 31 };

 

---

자바스크립트 기초 문법

1. 실행문은 세미콜론(;)으로 구분됩니다.

 

2. 변수(variable)의 선언과 초기화

 

변수는 var이라는 예약어로 선언하며, 여기에 값을 넣어주는 것을 초기화라고 합니다. 참고로 자바 스크립트는 대소분자를 구분하므로 잘 신경써주어야 합니다.

var x; // 변수의 선언

x = 10; // 변수의 초기화

var x = 10; //한 번에 가능

 

3. 리터럴 (literal)

 

리터럴은 직접 표현되는 값 그 자체를 의미합니다. 참고로, 주석은 아래와 같이 // 혹은 /*(주석) */로 표현 가능합니다. 아직까지는 어디다 쓰는건지 잘 모르겠네요.

//숫자 리터럴
10

//문자열 리터럴
"Hello JavaScript"

//불리언 리터럴
True

 

4. 식별자(identifier)

 

식별자는 변수나 함수의 이름을 작성할 때 사용하는 이름을 의미합니다. 식별자는 영문자(대소문자), 숫자, 언더스코어(_) 또는 달러($)만을 사용할 수 있으며, 숫자와 식별자의 구별을 빠르게 할 수 있도록 숫자로는 시작할 수 없습니다.

 

5. 타입 변환(type conversion)

 

자바스크립트의 변수는 타입이 정해져 있지 않으며, 같은 변수에 다른 타입의 값을 다시 대입할 수도 있습니다. 단, 변수의 재선언은 불가능하며, 무시됩니다.

var num = 10; // 숫자 10

num = "10"; // 문자열 "10"

var num;    // 불가능한 코드. 재선언문은 무시됨.

 

 

---

 

오늘은 앞으로 코딩테스트를 위해 제가 필요하다고 생각하는 Javascript 문법만 다루어 봤습니다. 다음 시간에는 더하기, 곱하기, and, or 같은 '연산자'에 대해서 정리해보도록 하겠습니다.