J.S 데이터 타입과 기본 문법/ 동적타입 언어? 자스 -02-

오늘 다룰 내용:

• 데이터 타입의 구성
• 자바스크립트의 기초 문법

*주의: 이번에 다룰 내용들은 너무나도 기초적인 것이기 때문에 표를 통한 간단한 구성들과 기초적 문법들이 무엇이 있나를 쭉 훑어 보는 용도로 작성 되었으며, 더 알고 싶은 독자분들은 강의나 책을 통하여 학습 뒤 자스 -03-에 나오는 복습과 실습을 통해 지식을 쌓아 보는것을 추천 드립니다.

컴퓨터가 이해하는 코드는 어떤 바보도 쓸 수 있다.
하지만 휼륭한 프로그래머는 사람이 이해할 수 있는 코드를 쓴다.

- 마틴 파울러, <리팩토링>의 저자 -

무엇을 모르고 무엇을 아는지는 [시행착오]에서 부터 나오니 명심.

자바스크립트 -02-

데이터 타입의 구성

 

01. 데이터 타입

데이터 타입이 중요한 이유는 앞선 01에서 설명했다시피 값을 저장하기 위해 메모리에 공간을 컴퓨터가 설정을 하게 되는데, 메모리에 얼마만큼의 공간이 필요한지 알려주어 최소한의 공간 낭비와 손실을 이루기 위해서 이다.

 

밑에 표는 자바스크립트에 있는 데이터 타입들이다. 각각 어느정도의 크기인지는 정리 하지 않았다.

데이터 타입 표, 출처: 모던 자바스크립트

본론으로 돌아와, 변수 선언시가 데이터타입을 생각할 때 가장 중요할 수 있다,

쉽게 말해, 변수 선언시 어떠한 데이터 타입의 값이 들어갈지를 알고 알려주어야 우리의 컴퓨터가 어느정도의 공간을 확보할지를 계산 하고 준비를 할 수 있는 것이다.

 

여기서 우리는 자바스크립트의 특징인 동적타입에 대해 알고 넘어가자.

큰 카테고리로 두 가지의 타입이 있고 각각의 타입은 쓰이고 있는 언어가 다른데,

 

이 두가지가 정적 타입과 동적 타입이다.

02. 정적 타입/ 동적 타입

정적 타입이란 변수 선언시 타입이 결정되고 바뀌지 않는 것을 뜻하며,

동적 타입이란 변수 선언시 동적으로 타입이 결정되고 변수의 타입을 언제든 변경을 할 수 있다.

 

고로, 자바스크립트의 변수는 선언이 아닌 할당에 의해 타입이 결정되어 할당에 의해 변수의 타입이 동적으로 변하므로 자바스크립트는 동적 타입언어에 속한다; 같은 타입을 쓰는 언어로는 PHP, 파이썬, 루비, 리스트, 펄 등이 있으며, 정적 타입을 쓰는 언어는 자바 C등이 있다.

 

프로그램의 복잡도에 따라서 각각 타입의 장단점이 나오는데,

정적 타입을 쓰는 경우 복잡도가 낮을 때는 코드의 길이가 길어지고 생각해야 할 것이 많아지는 단점이 있는 반면 복잡도가 높을 경우 코드의 추적이 쉽다는 장점이 있다. (디버깅에 좋다)

동적 타입을 쓴는 경우 복잡도가 낮을 때는 컴퓨터가 자기 스스로 타입을 결정해주므로 코드를 작성하기 편한 반면 복잡도가 높을 경우 코드의 추적이 어려워 진다.

 

예를 들면, 자바스크립트의 경우 var A = 1 이라고 했을 경우 1이 문자열인지, 숫자인지를 알 수 없어 컴퓨터가 임의로 타입을 지정하게 되고 이로 인해 차후에 이 변수를 사용하는 로직에서 문제를 이르킬수 있는 것이다. 

 

이로 인해 자바스크립트를 쓸 때 const라는 상수를 활용하는 것과 변수 남발의 금지를 추천하고 있다고 자바스크립트 책에서 이야기 되고 있다.

 

자바스크립트의 기초 문법

 

01. 비교연산자

// 비교 연산자, 3개 짜리를 써야 타입까지 비교된다!
x == y
x === y
x != y
x !== y
// 대소 연산자
x > y
x < y
x >= y
x <= y
// 논리 연산자
x || y
x && y
!x
// 지수 연산자 (제곱)
2**2
Math.pow(2,2)

02. 조건문

// 조건문
if(x) {
	return x + y
} else if(y) {
	console.log("hello")
} else {
 	console.log("something went wrong")
}

switch(month){
	case 1: case 3: case 5: case7: case 8: case 10: case 12:
    	days = 31;
        break;
    case 4: case6: case9: case11:
    days = 30;
    break;
    case 2:
    //윤년 계산 알고리즘
    // 1. 연도가 4로 나누어 떨어지는 해 (2000, 2004, 2008, 2012 ...)는 윤년
    // 2. 연도가 4로 나누어 떨어지더라도 연도가 100으로 나누어 떨어지는 해 (2000, 2100, 2200 ...)
    // 3. 연도가 400으로 나누어 떨어지는 해 (2000, 2400, 2800...)
   	days = ((year % 4 === 0 && year % 100 !== 0 ) || (year % 400 ===9 )) ? 29 : 28;
    break;
    default:
    console.log('Invalid Month');
   }

03. 반복문

// 반복문
for ( var i = 0; i < 2; i++ ) {
  	console.log(i);
}
  
var count = 0;
while(count < 3) {
  console.log(count);
  count++;
  if (count === 3) breal;
}

04. break문/ continue문

// break문
// 식별자가 붙은 레이블
outer: for(var i=0; i<3; i++) {
	if(i+j === 3) break outer;
    console.log(`inner [${i}, ${j}]`);
    }
}

// continue문
stringA = ['a','b','c','e','l']
search = 'l'

var count = 0;
for (var i = 0; i < stringA.length; i++){
	if(string[i] === search) {
    count++;
    }
}
for (var i = 0; i < stringA.length; i++){
	if( string[i] !== search) continue;
	count++;
}