[기초 강의] 자바스크립트편 1장 - 변 수

목차

• 변수 란?
• 변수의 타입
• 변수 이름의 조건
• 데이터 형에 관하여
• 끝맺음

 

안녕하세요.

이번에 소개할 내용은

어느 프로그래밍 언어든 가장 많이 사용되는 "변수"입니다.

 

변수 란?

 

변수는 간단하게 말하면"상자"라고 생각하시면 됩니다.

물건을 보관하고 정리하실 때 다들 상자 하나에 넣어두시죠?

또 친구에게 택배를 보낼 때 또한 상자에 보내죠?

프로그래밍에서의 변수도 이와 같은 역할을 합니다. 

 

var box = 1;

 

box라는 상자(변수)에 1을 넣어놓은 모습입니다.

 

변수의 타입

 

자바스크립트에서 타입은 총 세 가지가 있으며

이 세 가지는 두 분류로 나눌 수 있습니다.

var, let과 const입니다.

var와 let 변수는 값이 언제는 변할 수 있는 반면에

const변수는 한 번 값을 할당하면 바꿀 수 없어요.

비유를 하자면 var, let은 상자에 물건을 넣고 포장을 안 한 상태이고,

const는 상자에 물건을 넣고 내용을 바꿀 수 없도록 포장을 한 상태입니다.

(var와 let의 차이점은 자바스크립트의 호이 스팅 관련 강의에서 설명드리겠습니다.)

 

var num1 = 1;
let num2 = 2;
const num3 = 3;

// 출력
console.log(num1, num2, num3);

num1 = 2;
num2 = 3;
num3 = 4; //error

console.log(num1, num2, num3);

 

똑똑하신 여러분들이라면 위의 선언에서 왜 에러가 나는지 알겠지요?

또한, 코드에서 보면

변수는 선언할 때 한 번만 앞에 타입을 선언해주면 이후에는 선언을 안 해주셔도 됩니다.

(console.log(); 함수는 그냥 출력해주는 함수라고만 알고 있으면 됩니다. 자주 쓰니 기억해주세요)

 

변수 이름의 조건

 

변수 이름은 아무 이름이나 막 지으시면 안 됩니다.

 

첫째, 변수 이름은 영문자(대, 소문자), 숫자, 언더바(_)로만 구성이 됩니다.

 

(사실,  한국어로 변수 이름을 지어도 실행은 되지만 가급적 영어를 씁시다...)

 

둘째, 변수 이름은 숫자로 시작하면 안 됩니다.

셋째, 변수 이름에는 공백이 들어갈 수 없습니다.

(공백 대신에 언더바(_)를 사용해주세요.)

 

넷째, 이미 예약된 예약어들은 변수 이름으로 사용할 수 없습니다.

(if, else, for, while 등등...)

 

좋은 프로그래머는 변수 이름을 용도에 맞게 짓습니다.

 

const num = 1;
const name = "coderbee"
const age = 99;

console.log(`나의 번호는 ${1번}이고 나의 이름은 ${coderbee}입니다. 나이는 ${age}입니다.`);

 

데이터 형에 관하여

 

지금까지 저희가 변수 안에 넣어본 것은 두 가지 데이터 형뿐입니다.

123 12 234와 같은 숫자(number)

"coderbee"와 같은 문자(string)

이 두 개 말고도

배열(array)과 객체(object),

참과 거짓을 나타내는 불리언(boolean),

마지막으로 함수(function)

이 모든 것이 변수 안에 선언될 수 있습니다.

 

// number
const num = 1;

// string
const name = "coderbee";

// array
const arr = [];

// object
const obj = {}; 

// boolean
const b = true;

console.log(typeof num);	// number
console.log(typeof name);	// string
console.log(typeof arr);	// object
console.log(typeof obj);	// object
console.log(typeof b); 		// boolean

 

typeof는 해당 변수가 가지고 있는 데이터의 데이터 형이 무엇인지 알려줍니다.

근데 자세히 보면 먼가 이상하죠?

array(배열)로 선언한 arr 변수가 실제로 typeof를 찍어보니 object 형으로 나옵니다.

이 부분은 추후 제가 설명드리겠습니다.

 

일단은 기본기에 집중해 봅시다.

 

끝맺음

어려운 설명은 빼고 최대한 이제 막 입문하시는 분들 초점으로

설명하다 보니 정말 가벼운 느낌이 된 거 같습니다.

하지만, 저의 생각은 이제 막 입문하시는 분들에게는

어렵게 보다 쉽게 전달하는 게 맞는 부분인 거 같았습니다.

앞으로 더 어려운 부분이 많이 나올 텐데 지금부터 어렵게 공부할 필요는 없잖아요?

오늘 배운 것들 직접 코딩해보시고 모르시는 부분은 언제든 댓글로 남겨주세요.

앞으로도 쉽게 쉽게 알려드리려 노력하겠습니다.

긴 글 읽어주셔서 감사합니다.