[JavaScript] 기본 문법

JavaScript 기본 문법

주석

• 주석은 JavaScript 코드에 대한 부연 설명이므로 실행 코드에 포함되지 않음
• JavaScript 주석은 한 줄 주석(Line Comment)과 블록 주석(Block Comment)가 있음
• 한 줄 주석 : //code
• 블록 주석 : /* code */

변수

• JavaScript는 변수를 선언할 때 타입을 명시하지 않고 var keyword를 사용하여 선언
• JavaScript는 동적 타입 (Dynamic/ Weak Type) 어
  • 변수의 타입 없이 값이 할당되는 과정에서 자동으로 변수의 타입이 결정
  • 같은 변수에 여러 타입의 값을 할당 가능
• 변수의 이름은 함수 이름과 혼동되지 않도록 유일한 이름을 사용하는 것을 권장
  • 변수 : 형용사, 명사
  • 함수 : 동사
• JavaScript는 ECMAScript 표준에 따라 Camel 표기법을 사용
• 키워드, 공백 문자 포함, 숫자로 시작할 수 없음
• 특수 문자는 _와 $ 허용

자료형

• 프로그램은 정적인 데이터 값을 동적으로 변환해 가면서 원하는 정보를 얻음
• 프로그램에서 다루는 데이터 값의 종류들을 자료형이라 표현
• JavaScript에서는 자료형을 원시 타입(primitive type)과 객체 타입(object type)으로 분류
• primitive type에는 숫자, 문자열, boolean, null, undefined가 있음
• 이를 제외한 모든 값은 객테 타입

숫자

• JavaScript는 숫자를 정수와 실수로 나누어 구분하지 않음
• 모든 숫자를 8-byte의 실수 형태로 처리
• 편의성을 위해 정수 리터럴과 실수 리터럴을 제공
• 숫자의 연산 처리시 실수 형태로 하기 때문에 특정 소수점을 정확하게 표현하지 못함
• JavaScript는 언더플로우, 오버플로우, 0으로 나누는 연산에 대해 예외를 발생시키지 않음
• JavaScript에는 숫자와 관련된 특별한 상수가 존대
  • Infinity : 무한대를 나타내는 상수, 어떠한 수를 0으로 나누거나 Infinity를 어떠한 수로 사칙연산한 결과
  • NaN(Not a Number) : 계산식의 결과가 숫자가 아님을 나타내는 상수

문자열

• JavaScript에서 문자열은 16비트의 Unicode 문자를 사용
• 문자 하나는 표현하는 char와 같은 문자형은 제공하지 않음
• 작은 따옴표, 큰 따옴표 둘 다 사용 가능하지만 혼용은 불가능
• 이스케이프 시퀀스(\)도 사용 가능
• ES6부터는 백틱 ``` 을 사용한 문자열 표현도 가능

boolean

• 비교 연산의 결과값으로 true 또는 false 중 하나의 값을 가짐
• 비어있는 문자열, null, undefined, 숫자 0은 false로 간주됨

null, undefined

• null은 값이 없거나 비어 있음을 뜻함
• 값이 초기화 되지 않았음 (정의되지 않음)을 의미
• null과 undefined는 의미가 비슷하지만
  • 값을 할당하지 않은 변수는 undefined가 할당(시스템 레벨)
  • 코드에서 명시적으로 값이 없음을 나타낼 때 null을 사용(프로그램 레벨)

자료형 변환

• JavaScript는 Java나 C++등과 같은 언어와는 달리 자료형에 대해 매우 느슨한 규칙이 적용
• 어떤 자료형이든 전달할 수 있고, 그 값을 필요에 따라 변환 가능
• 서로 다른 자료형의 연산이 가능
• 모든 자료형을 var로 선언하기 때문에 변수 선언은 쉽지만 이런 느슨한 규칙 때문에 혼란을 야기

변수 호이스팅(Variable Hoisting)

• var 키워드를 사용한 변수는 중복해서 선언이 가능
• 호이스팅이란, var 선언문이나 function 선언문 등 모든 선언문이 해당 Scope의 처음 옮겨진 것처럼 동작하는 특성. 즉 JavaScript는 모든 선언문이 선언되기 이전에 참조가 가능
• 변수의 생성
  • 선언 단계 : 변수 객체에 변수를 등록
  • 초기화 단계 : 변수 객체에 등록된 변수를 메모리에 할당 (undefined로 초기화 됨)
  • 할당 단계 : undefined로 초기화 된 변수에 실제 값을 할당
• 선언 단계와 초기화 단계는 동시에 이루어짐

console.log(num); // undefined
var num = 123;
console.log(num); // 123
{
	var num = 234;  // JavaScript는 블록 레벨 스코프를 가지지 않고 함수 레벨 스코프만 가짐
								  // num은 전역 변수이므로 전역에 선언한 변수 num에 두번째 num에서 재 할당 됨
}
console.log(num); // 234

상수

• ES6 이전까지는 상수 표현을 지원하지 않음
  • 변수의 값을 변경하면 안 되는 상수와 일반 변수를 구분하고자 변수 명명 규칙을 다르게하여 사용
  • 상수의 표기법은 모든 문자를 대문자를 사용하고, 단어 사이는 ‘_’로 표기
• ES6 에서 const 키워드가 추가되어 상수를 지원

ECMAScript6 - let, const keyword

키워드	구분	선언위치	재선언
var	변수	전역 스코프	가능
let	변수	해당 스코프	불가능
const	상수	해당 스코프	불가능

연산자

• JavaScript에서 기본적으로 제공하는 약속된 문자의 표현식을 연산자라 함
• 표현식에서 2개 이상의 연산자를 동시에 사용했을 경우 우선순위별로 표현식을 해석

연산자	설명
++	선위 연산자로 사용했을 경우 값을 증가하고 결과 값을 반환 후위 연산자로 사용했을 경우 현재 값을 반환하고 값을 증가
--	선위 연산자로 사용했을 경우 값을 감소하고 결과 값을 반환 후위 연산자로 사용했을 경우 현재 값을 반환하고 값을 감소
-	부호를 전환해서 결과값 반환
+	숫자로 값을 반환
~	비트단위 연산자에서 사용하며 NOT연산 수행
|	논리연산에서 사용하며 boolean 결과를 반환
delete	프로퍼티를 제거
typeof	피연산자 타입을 리턴
void	Undefined 값을 알려줌
*, /, %	곱하기, 나누기, 나머지 연산 결과를 반환
+, -	값이 숫자일 때는 더하기, 빼기의 연산결과 반환
+	값이 문자열이면 문자열을 서로 결합
<<	비트연산자로 값을 왼쪽으로 이동
>>	비트연산자로 값을 오른쪽으로 이동
>>>	부호비트 확장 없이 값을 오른쪽으로 이동
<, <=, >, >=	숫자의 대소비교
instanceof	객체가 특정 객체의 타입인지를 확인
in	프로퍼티가 존재하는지 확인
==	동등 관계인지 확인
!=	동등하지 않은 관계인지 확인
===	값이 일치하는지 확인 (타입 포함)
!==	값이 일치하지 않는지 확인 (타입 포함)
&	비트 단위 연산자로 AND 연산
^	비트 단위 연산자로 XOR 연산
|	비트 단위 연산자로 OR 연산
&&	AND 연산
||	OR 연산
?:	조건에 해당하는 구문을 수행
=	변수 또는 프로퍼티에 값을 할당
,	1번째 구문은 버리고, 다음 구문 값을 반환

조건문

if

• 표현 식의 값에 따라 특정 구문들을 실행하거나 실행하지 않도록 제어
• 조건 구문을 분기 구문이라고도 표현하는데 2개 이상의 경로 중에서 특정 경로를 선택 가능
• if 구문은 단순한 결정을 내리거나 정료한 구문들을 표현하는데 사용
• if와 else의 표현식 결과 값이 참(true)일 경우 구문을 실행

if (조건식1) {
} else if (조건식2) {
} else {
}

switch

• switch 구문은 동일한 표현식이 반복될 때 효과적인 구문
• 값이 case와 동일할 경우 해당 구문 내용이 실행
• break문은 switch 구문을 종료하며, break문이 없을 경우 다음 case를 실행
• 동일한 case가 없을 경우 default 구문 실행

switch(값) {
	case 값1:
	
	break;
	case 값2:
	
	break;
	default: 

}

반복문

while

• 표현식의 값이 참일 때 선언된 구문을 실행
• 표현식의 값이 거짓일 경우 while문 종료

while (조건식) { 
}

do while

• 표현식의 값을 확인하는 시점이 구문의 마지막이므로 최소 한번 반복 구문을 수행
• 최초 1회 수행하고, 표현식의 값이 참일 때 다음 내용을 수행

do {
} while(조건식);

for

• for 구문은 카운터 변수를 사용하는 구문과 in keyword를 사용하는 구문으로 분류
• 카운터 변수를 사용하는 for 구문은 카운터 변수가 표현 식에 명시된 조건이 거짓이 나오면 반복 종료
• in keyword를 사용하는 for 구문은 배열 또는 객체가 가진 프로퍼티를 순회하며 키(index)값을 조회

for (초기화; 조건식; 증감표현식) {
}

for (var 변수 in 배열/객체 {
	// 변수에서는 배열의 인덱스가 담김
	// 객체의 프로퍼티명이 담김
}