JavaScript를 공부해보자, 변수와 자료형

무꾸씨·2023년 8월 23일

백엔드 하려고 공부하는 HTML&CSS&JS

목록 보기

9/14

안녕하세요?

오늘은 드디어 자바스크립트에 대해 공부를 시작하게 되었네요!
백엔드 개발자가 되기 위해서 Python과 Django를 공부하고자 HTML, CSS, JavaScript 같은 부분도 기초적인 공부를 하고 있는데,
JavaScript의 경우 잘 배워두면 Node.js를 통해서 백엔드를 구성할 수 있으니
개인의 발전을 위해서 HTML과 CSS보다 좀 더 열심히 공부해야겠죠!?

그럼 오늘도 열심히! 시작해볼게요~

변수와 자료형

변수 그리고 상수

변수는 변할 수 있는 정보입니다
선언하고, 할당하고, 사용할 수 있습니다
지정된 값을 계속해서 바꿀 수 있다는 특징이 있어요

반대로 상수는 변하지 않는 일정한 값을 가집니다. 불변이라고 하죠?
한번 지정된 값을 바꿀 수도 없고, 재선언할 수도 없습니다

var a = "애아뽀으"; // 변수
let b = "샘송"; // 변수
const c = "에르주이"; // 상수

a = "Apple"; // ok
b = "Samsung"; // ok
c = "LG"; // Error!!!!!

자료형

자료형은 다양한 데이터를 용도에 맞게 사용하기 위한 것 입니다
보통 자료형과 변수명을 같이 선언하지만 JavaScript에서는 명시하지 않아도 된다.

자료형은 두 가지로 나눌 수 있습니다

1. 원시자료형

원시자료형은 자료에 해당되는 표현이 지정되어 있습니다

저장된 변수를 다른 변수에 할당하면 값 자체가 복사되고 복사된 변수를 변경해도 원래 변수에는 영향을 끼치지 않는다는 특징을 가지고 있어요

원시 자료형 종류

String : 문자열
"eric"
Number: 숫자
3
NaN: Not a Number
NaN
Boolean: 부울값(논리형)
true, false
undefined : 아무 값도 할당받지 않은 상태
undefined
null : Object
null
Symbol : 고유하고 변경 불가능한 원시값. 객체의 속성키로 사용된다.

null은 원시자료형인데, 객체인 이유는 개발자의 실수이다.

2. 객체자료형

객체자료형 은 객체를 생성하여 값을 할당하고 그 값을 복사하면 원시자료형과 다르게 그 값 자체를 복사하는것이 아니라 그 값이 위치한 메모리 주소값을 복사합니다.
이것을 참조자료형 이라고 표현하기도 하다.

객체 자료형 종류

배열 Array []
[1,2,3,4,5]
딕셔너리 Dictionary {}
{"name":"mukkusi", "age": 28}
함수 function
function(a, b) { return a+b;}

let, const, var

let과 var는 값을 변경할 수 있는 변수이고, const는 불변의 값을 가지는 상수이다.

var

var는 함수 외부에서 사용했을 때, 전역변수로 사용이 가능합니다.
또 다르게, 함수 내에서 선언했을 땐 함수 범위로 지정됩니다.
var는 같은 범위안에서 재선언과 업데이트 모두 할 수 있습니다.

var a = "this is global!!!";

function change() {
 	var a = "this is Block scope!!!";
  	console.log(a); // "this is Block scope!!!"
}

console.log(a); // "this is global!!!"

a = "Hey, Stupid!!";
console.log(a); // "Hey, Stupid!!"

let

let은 var와 같은 변수이지만, let으로 선언된 변수는 선언을 진행한 해당 블록 안에서만 사용할 수 있습니다.
또, let은 업데이트를 시킬 순 있지만 재선언은 불가능합니다.

let a = "this is global!!!";

function change() {
	let b = "Nope! This is let_b!";
  	console.log(b); // "Nope! This is let_b!"
}

console.log(b); // Undefined! Because 'b' is not defined

Const

const는 불변이자 상수입니다
let 선언처럼 선언을 진행한 블록범위 내에서만 접근 가능하고 상수이기 때문에 업데이트와 재선언 모두 불가능합니다
따라서 const는 선언과 동시에 초기화를 시켜줘야합니다
단, const 개체는 다른데 개체 자체는 업데이트할 수 없지만 개체 내부 속성은 업데이트할 수 있습니다

const my_condition = "Hungry";
my_condition = "Hungry, also Sleepy" // Error. Assignment to constant variable. 

const my_condition = "Really Hungry"; // Error. Identifier 'my_condition' has already been declared