천진난만 코딩 스토리

2023.02.21) 항해 16일차 본문

TIL(Today I Learned)

2023.02.21) 항해 16일차

Wisdom_1104 2023. 2. 21. 16:54

오늘은 데이터 타입과 실행 컨텍스트에 대해 공부했다.

데이터 타입은 크게 어렵지 않았지만, 실행 컨텍스트의 호이스팅과 스코프에서 좀 헤맸다.

 

 

1) 데이터 타입

데이터 타입에는 크게 두 가지가 있다.

기본형 (숫자, 문자열, 불리언, null, undefined)은 기본적으로 불변성을 띄고,

참조형 (객체, 배열, 함수, 날짜, 정규표현식)은 가변성을 띄지만 상황에 따라 불변값을 사용하는 경우도 있다.

1bit는 0과 1이고, 1byte는 8bit이다.

변수는 변할 수 있는 무언가(데이터)이고,식별자 변수명이다.

데이터 할당 시 변수 영역과 데이터 영역이 있다.

변수 영역의 값에 데이터 영역의 주소를 저장하고, 데이터 영역주소에 할당하려는 데이터를 저장다.

얕은 복사는 바로 아래의 단계의 값만 복사하는 방법이고, 원본과 사본이 동일하다.

깊은 복사는 내부의 모든 값들을 하나하나 찾아서 전부 복사하는 방법이고, 원본과 사본이 다르다.

기본형 데이터는 그대로 복사하면 되지만, 참조형 데이터는 다시 그 내부의 프로퍼티를 복사해야지 깊은 복사가 된다.

undefined와 null은 모두 '없음'을 나타내는 값이지만 의미와 사용 목적이 다르다.

undefined는 사용자가 명시적으로 부여도 가능하고 자바스크립트 엔진이 자동으로 부여하기도 한다.

• 자동으로 부여하는 경우

  - 값을 대입하지 않은 변수

  - 객체 내부의 존재하지 않는 프로퍼티

  - return문이 없거나 호출되지 않는 함수의 실행결과

값으로써 어딘가에 할당된 undefined는 실존하는 데이터이고,

자바스크립트 엔진이 반환해 주는 undefined는 문자 그대로 값이 없다는 것을 말한다.

그렇기에 '비어있음'을 명시적으로 나타내고 싶을 때에는 undefined가 아닌 null을 사용한다.

 

 

1. 다른 언어에서는 어떻게 데이터 타입을 정의할까요?

C/C++, 자바 등 정적 타입 언어의 경우 타입별로 할당할 메모리 영역을 2바이트, 4바이트로 나누어 정해놓고 사용한다.

 

2. 다른 언어들처럼 데이터 타입을 다룬다면 장단점은 무엇이 있을까요?

받아서 저장해야 할 값이 명확히 정해져 있기 때문에 잘못 입력하게 된다면 오류가 나서 쉽게 문제점을 알 수 있는 장점이 있다.

다만 사용자가 명확히 값을 지정해 주어야 하기에 사용하기에 번거롭다는 단점이 있다.

 

3. 기본형 데이터와 참조형 데이터를 굳이 왜 구분해서 다룰까요? 혹시 하나의 방식으로 다 다룰 수는 없을까요?

기본형 데이터와 달리  참조형 데이터는 추가로 객체의 변수영역도 존재한다.

또한 기본형과 참조형 모두 같은 주소를 바라보게 되는 점과 복사과정을 동일하지만,

데이터 할당과정에서 차이가 있고 변수 복사 이후의 동작에서도 큰 차이가 있다.

그렇기에 적재적소에 사용하듯이 구분하여 사용하는 것이 좋다고 생각한다.

 

4. 왜 불변 객체를 이용해야 할까요? 어떤 실수가 있을 수 있을까요?

값으로 전달받은 객체에 변경을 가하더라도 원본 객체는 변하지 않아야 하는 경우에 불변 객체를 사용하게 된다.

얕은 복사를 하게 된다면 원본과 사본이 같아지는 문제가 생긴다.

그렇기에 깊은 복사를 하여 원본과 사본은 분리해야 한다.

 

5. 왜 자바스크립트에는 undefined와 null이 있을까요?

undefined와 null은 모두 '없음'을 나타내는 값이지만 의미와 사용 목적이 다르다.

undefined는 사용자가 명시적으로 부여도 가능하고 자바스크립트 엔진이 자동으로 부여하기도 한다.

값으로써 어딘가에 할당된 undefined는 실존하는 데이터이고,

자바스크립트 엔진이 반환해 주는 undefined는 문자 그대로 값이 없다는 것을 말하기에 차이가 있다.

그렇기에 '비어있음'을 명시적으로 나타내고 싶을 때에는 undefined가 아닌 null을 사용한다는 점에서

undefined와 null의 차이점이 존재한다.

 

2) 실행 컨텍스트

스택은 쌓은 순서대로 뒤에부터 다시 꺼내는 데이터 구조이고, 는 쌓은 순서대로 앞에서부터 꺼내는 데이터 구조이다.

실행 컨텍스트는 실행할 코드에 제공할 환경 정보들을 모아놓은 객체이다.

콜 스택에 쌓아 올렸다가 위에  있는 것부터 실행하는 전체 코드의 환경과 순서를 보장한다.

자바스크립트 코드를 실행하는 순간 콜 스택에 전역 컨텍스트가 담기게 되고, 관련된 함수들을 위에 쌓는다.

실행 시 위에서부터 실행하게 되는데 마지막에는 전역 컨텍스트까지 제거되며 콜 스택에는 아무것도 남지 않게 된다.

Variable Environment는 현재 컨택스트 내의 식별자들에 대한 정보+외부환경 정보이다. (변경사항 반영 X)

Lexical Environment는 Variable Environment와 처음은 같지만 변경사항이 실시간으로 반영되는 것이다.

outerEnvironmentRefernce는  현재 호출된 함수가 선언될 당시의 Lexical Environment를 참조한다.

그렇기에 가장 가까운 요소부터 차례대로만 접근할 수 있다.

함수 선언문은 function 정의부만 존재하고 별도의 할당 명령이 없는 것을 의미한다.

함수 표현식은 정의한 function을 별도의 변수에 할당하는 것을 의미한다.

함수 표현식에는 기명 함수 표현식과 익명 함수 표현식이 있는데 일반적으로는 익명 함수 표현식을 사용한다.

 

3) 호이스팅

인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것이다.

var로 선언한 변수는 호이스팅 시 undefined로 변수를 초기화한다.

let과 const로 선언한 변수는 호이스팅 시 변수를 초기화하지 않는다.

 

호이스팅은 주로 "변수의 선언과 초기화를 분리한 후, 선언만 코드의 최상단으로 옮기는 것"이라 한다.

따라서 변수를 정의하는 코드보다 사용하는 코드가 앞서 등장할 수 있다.

다만 선언과 초기화를 함께 수행하는 경우, 선언 코드까지 실행해야 변수가 초기화된 상태가 된다.

 

 

4) 스코프

스코프는 식별자에 대한 유효범위이다.

참조 대상 식별자(identifier, 변수, 함수의 이름과 같이 어떤 대상을 다른 대상과 구분하여 식별할 수 있는 유일한 이름)를

찾아내기 위한 규칙이고, 자바스크립트는 이 규칙대로 식별자를 찾는다.

전역 스코프 (Global scope)는 코드 어디에서든지 참조할 수 있다. 

전역 변수 (Global variable)는 전역에서 선언된 변수이며 어디에든 참조할 수 있다.

(전역 변수는 전역 스코프를 가진다)

지역 스코프 (Local scope)는 함수 코드 블록이 만든 스코프로 함수 자신과 하위 함수에서만 참조할 수 있다.

지역 변수 (Local variable)는 지역(함수) 내에서 선언된 변수이며 그 지역과 그 지역의 하부 지역에서만 참조할 수 있다.

(지역 변수는 지역 스코프를 가진다)

함수 레벨 스코프는 함수 코드 블록 내에서 선언된 변수는 함수 코드 블록 내에서만 유효하고 함수 외부에서는 유효하지 않다는 것이다.

같은 전역변수와 지역변수가 중복 선언되면 전역 영역에서는 전역변수만이 참조 가능하고,

함수 내 지역 영역에서는 전역과 지역 변수 모두 참조 가능하나 지역변수를 우선하여 참조한다.

스코프 체인이란 '식별자의 유효범위'를 안에서부터 바깥으로 차례로 검색해 나가는 것을 말한다.

여러 스코프에서 동일한 식별자를 선언한 경우에는 무조건 스코프 체인 상에서 가장 먼저 발견된 식별자에만 접근 가능하다.

 

 

 

 

 

 

 

 

 

'TIL(Today I Learned)' 카테고리의 다른 글

2023.02.23) 항해 18일차  (0) 2023.02.23
2023.02.22) 항해 17일차  (0) 2023.02.22
2023.02.20) 항해 15일차  (0) 2023.02.20
2023.02.18) 항해 13일차  (0) 2023.02.20
2023.02.17) 항해 12일차  (0) 2023.02.18