[TIL] JavaScript 기초

오늘의 공부

변수

• 변수는 선언을 통해 메모리에 값을 할당할 수 있다. 주로 중복되거나 자주쓰는 것을 선언하여 사용한다.
• 메모리는 1byte(8비트)의 크기를 가진 메모리 쉘들로 구성되어 1byte 단위로 저장하고 읽는다.
• 메모리 쉘들은 고유의 주소를 가지며, 변수를 선언시 주소 값이 할당된다.

let a = 10;

• 위와 같이 변수 a를 선언시, 자바스크립트는 let a와 a=10;을 나누어 할당한다. 변수 a에는 10의 값이 저장된 주소 값이 할당된다. 따라서 변수의 값 사용은 할당된 메모리를 읽고 쓰는 것이다.

let a = 10;
a = 20;

• 변수 a를 재할당할 경우 기존의 메모리의 값이 변경되는 것이 아니라, 새로운 메모리를 확보하여 값을 저장하고, 변수 a 주소 값을 재지정한다. 기존에 사용한 값 10이 있는 메모리는 "가비지 컬렉터" 에 의해 메모리에서 해제된다.

타입

• 자바스크립트의 언어 타입은 느슨한 타입의 동적언어이다. 변수는 어느 타입의 값과도 연결 가능하며, 모든 타입의 값을 할당 및 재할당 가능하다. c언어의 경우 다음과 같이 변수 선언시 값의 타입에 따라 선언한다.

int a = 1; // 숫자형
char a = 'a' // 문자형

• 다만, 자바스크립트는 그럴 필요 없이 어느 타입의 값이든 변수에 선언할 수 있다.

let a = 10;
a = 'str'
console.log(a);
str

• 자바스크립트의 타입은 원시 값과 객체로 구분된다.

• 원시 값 (언어의 최고 로우레벨에서 직접 표현되는 불변 데이터)
  Number - 숫자형
  String - 문자형
  Boolean - 참과 거짓, true 외에 0, -0, NaN, Null, ""(빈 문자열), undefined 등이 거짓으로 표현된다.
  Null - 의도적으로 비어있음을 표현한다. 불리언으로 표현시 0(거짓)이다.
  Undefined - 값을 할당하지 않은 변수
  BigInt - 임의 정밀도로 정수를 나타낼 수 있다.
  Symbol

• 객체 (속성의 컬렉션)

함수

• 함수는 진행할 일련의 작업 중 하나의 작은 기능의 단위라고 표현할 수 있다. 함수는 이름, 괄호 안의 매개변수, 중괄호{} 안에서 함수를 정의하는 자바스크립트 표현으로 구성된다.

function foo (param1, param2) {
  return param1 + param2;
}
console.log(foo(1,2));
3

• 위의 함수 foo는 매개변수 param1, param2의 값을 전달인자를 통해 받아 더하기를 수행한다.
• 함수를 정의하는 방법은 함수 선언식, 함수 표현식, 화살표 함수가 있다.

// 함수 선언식
function foo (param1, param2) {
	let sumParams = param1 + param2;
  	return sumParams;
}

// 함수 표현식
let foo = function (param1, param2) {
  	let sumParams = param1 + param2;
  	return sumParams;
}

// 화살표 함수
let foo = (param1, param2) => {
  	let sumParams = param1 + param2;
  	return sumParams;
} 

• 함수를 선언할 때, 중괄호 안에 return 표현식으로 반환할 값을 지정해줘야 한다. 생략시 Undefined가 반환된다.

let foo = function (param1, param2) {
  	let sumParams = param1 + param2;
}
console.log(foo(1,2));
undefined

마무리

오늘 학습한 변수, 타입, 함수는 학습에서 어려운 점은 없었다. 페어와 문제를 푸는 것이 신선하게 다가왔다.다만, 페어와 진행하던 것 중 Number() 객체를 사용하여 받은 전달인자를 숫자형으로 반환하는데 문제가 있었다. 반환이 되지 않는 문제였는데, return 표현식을 깜빡하여 발생한 문제였으며, 여러 시도 중 해결하였다.

값을 반환하고자 하는 함수에 꼭 return을 까먹지 않도록 해야겠다.

TIL를 작성하면서 변수 호이스팅이라는 것을 알게 되었다. 자바스크립트 언어의 개념과 동작원리를 학습하기 위해서 모던 자바스크립트 Deep Dive를 학습하는 것도 좋은 생각 같아서 주문했다.
내일 Unit 3에서는 조건문, 문자열, 반복문을 학습한다. 개요상 if문, for문 등의 활용과 여러 메소드들을 사용한다. 오늘도 숫자형으로 변환하는 Number(), 문자형으로 변경하는 String() 등의 메소드들을 사용하였다. 본격적으로 학습한 지 1일차이기 때문에 복습에 큰 걸림돌은 없었다. 내일 하는 조건문이나, 문자열 그리고 메소드들도 MDN을 통해서 미리 학습할 수 있도록 해야겠다.