본문 바로가기
JavaScript

JavaScript에서의 변수와 자료형, camelCase

by Dodledd 2024. 3. 16.

자료형

JavaScript에서는 예전에 사용했지만 지금은 사용하지 않는 자료형이 있다. 바로 var다.

 

자바스크립트는 굉장히 유연한 녀석이기 때문에 우리가 알고있는 Java와 C 같이 int형, String형, char형 등등으로 나누지 않는다. 모두 하나의 자료형 선언 let 으로 통일한다. (사실은 내부적으로 알아서 바꿔주고 있던 것)

 

위처럼 아주 자유롭게 선언하는 자바스크립트의 변수는 자료형에 관계가 없다.

따라서 변수는 어떤 순간에 문자열일 수 있고 다른 순간엔 숫자가 될 수도 있습니다.

이처럼 자료형은 있지만 변수에는 순간순간 다른 자료형으로 들어간는 것을 동적 타입(dynamically typed) 이라고 한다.

 

변수 선언시 자료형을 별도로 지정하지 않음(자료형의 개념이 없는 건 아니다)        -> 한줄씩 실행되는 인터프리터 언어 특성상 변수에 대입되는 값에 따라서 알아서 자료형이 결정된다

 

우선 자바스크립트는 기본적으로 8개의 자료형을 가지고 있다.

숫자형

let n = 123;

일반적인 숫자에 더해 Infinity, -Infinity, NaN 으로 불리는 특수 값도 있다.

alert( 1 / 0 ); //infinity

infinity를 직접 만들 수 있다.

 

NaN(not a number)

보통 숫자가 아닌 녀석을 집어넣었을 때 반환되는 오류이다.

영어 번역 그대로 "숫자가 아니다" 라는 느낌.

또 NaN과 다른 자료형이 부딪이면 무조껀 NaN이 반환된다. (조심)

 

BigInt

(2^53-1)(9007199254740991) 보다 큰 값 혹은 -(2^53-1) 보다 작은 정수는 '숫자형’을 사용해 나타낼 수 없다.
대부분의 상황에서는 괜찮을 것 같은데 그럼 어떤 상황에서 필요할까?

암호화된 정밀도가 높은 작업을 할 때 필요하다. (사실 현업에서는 (거의) 잘 안쓴다고 한다)

 

끝에 n을 붙이면 BigInt가 된다고 한다.

// 끝에 'n'이 붙으면 BigInt형 자료입니다.
const bigInt = 1234567890123456789012345678901234567890n;

 

문자형

let str = "Hello";
let str2 = 'Single quotes are ok too';

우리가 항상 사용하던 문자열 변수에 넣기다. String과 똑같지만 다른 점은

JavaScript에서는 큰따옴표 (" ")와 작은따옴표 (' ') 가 똑같은 기능을 갖는다.

 

불린형

let nameFieldChecked = true;
let ageFieldChecked = false;

똑같다. 불린은 원시적인 느낌이라 거의 모든 언에서 비슷한 느낌이다.

 

null

let age = null;

언어라면 빠질 수 없는 null이다. 우리가 알고 있는 그 null

비어있다를 표기하기 위한 null, 어떤 자료형에도 속하지않는 독립적인 자기만의 자료형이다.

 

undefined

let age;
alert(age);

age = undefined;

이건 처음보는 자료형이다. null과 똑같게 자신만의 자료형을 가지고 있다.

변수는 선언했지만 값을 넣어주지 않았을 때 undefined가 나오게 된다.

명시적으로 우리가 선언해줄 수도 있다.

(개발자가 변수를 만들었지만 값이 없을 때 나오는 게 undefined인데 명시적으로 undefined를 선언해주면 의도와 맞지않는 모순이다.)

 

객체(Object)

위에 다른 자료형이 딱 하나의 자료형만 담을 수 있게 되어있는 원시(primitive)자료형이라고 불린다.

하지만 객체는 우리가 알고 있듯 여러가지의 자료형을 [복잡한 개체(entity)] 들을 자유롭게 담을 수 있는 자료형이다.

 

심볼(symbol)

심볼은 참 애매하다. 아직까지 배운 거로는 정리하기 어려운 것 같다.

그래도 개념만 정리해보자

자바스크립트의 객체들은 모두 (키)key + (값)value 인 프로퍼티(Property)로 구성되어있다.

그래서 심볼은 객체의 프로퍼티 키로 사용된다.

프로퍼티 키란 곧 해당 프로퍼티의 값에 접근하고자 할 때 사용하는 이름이다.

심볼은 고유하기 때문에 절때 키가 겹치지 않는다는 장점이 있다고한다.

 

하지만 진짜진짜 사용하지 않는다고 한다...


JavaScript에서의 변수

자바스크립트에서의 변수는 3가지가 있는데

  1. let, 일반변수 담당
  2. const, 상수 담당
  3. var <- 퇴역

먼저 let 부터 다뤄보도록 하겠다 !

 

let = 일반변수

우리가 JAVA나 다른 프로그래밍 언어에서 봤던 변수는 int형.. String형.. 등등 데이터 타입을 지정해줘서 넣어줘야했다.

하지만 자바스크립트에서는 그냥 let 하나로 통일하고 내부적으로 알아서 데이터 형식에 맞게 변환해준다.

그러니까 우리는 편하게 let 만 쓰면 된다.

 

const = 상수

먼저 상수란 무엇인가?

변하지 않는 수, 즉 상수이다.

절때 변할 것 같지 않은 값이나 우리가 읽어들여 가져오는 값 이런 케이스들을 잘 보고 const를 사용하도록 하자

또 const로 선언한 변수를 바꾸려하면 당연하게도 에러가 발생하니 유의하자.

 

var = 퇴역

사실 지금 배우는 과정에서 몰라도 되지만 그냥 이런게 있었다 ~ 라는 느낌으로 넘어가면 될 것 같다.

먼저 특징들을 보자

  1. var로 선언한 변수는 코드블록을 무시하는 변수가 된다. 즉 전역변수이다. (예전 자바스크립트에서는 블록수준의 환경이 만들어지지 않았기 때문에 이런 것)
  2. 변수의 중복선언을 허용한다. (이게 var가 퇴역하고 let이 새롭게 등장하여 표준으로 자리잡게된 제일 큰 이유이기도 하다.)

변수의 중복선언은 실수를 유발할 수 있는 가능성을 매우 높이기 때문에 조금만 생각해보면 왜 구식인지 알 수 있을것이다.

 

번외, 카멜 표기법(camelCase)

프로그래밍을 하며 변수의 이름을 지을 때 우리는 암묵적인 룰 두 가지를 알고있다.

  1. 변수명에는 문자, 숫자, $, _ 만 들어갈 수 있다.
  2. 변수명의 첫 번째에는 숫자가 올 수 없다.

이건 개발자 사이에서 지켜지는 암묵적인 룰이다.

물론 지키지 않아도 되지만 나중에 힘든건 본인이니 선구자분들이 만들어 놓은 법과 룰을 지키자.

 

그럼 카멜 케이스란 무엇인가?

변수명을 지을 때 좀 더 명확하게 알게하기 위해 단어와 단어를 합칠 때가 있는데,

이 때 첫 단어를 제외한 뒤에 붙는 단어들의 첫 알파벳을 대문자로 작성한다.

예를 들면

let userName;
let test123;
let myVeryLongName;

이렇게 짓는다.

 

또 변수명은 대소문자를 구분하니 유의하도록 하자 !