What I Learned Today

JavaScript의 자료형과 JavaScript만의 특성은 무엇일까 ?

• 느슨한 타입(loosely typed)의 동적(dynamic) 언어로 변수는 어떤 특정 타입과 연결되지 않으며 모든 타입의 값으로 할당 및 재할당이 가능하다.

• JavaScript 형변환 자바스크립트는 타입이 매우 유연한 언어로 자바스크립트 엔진이 필요에 따라 암시적변환 개발자의 의도에 따라 명시적변환 을 실행한다.

• ==, === 의 차이점

  '==' 연산자를 이용하여 서로 다른 유형의 두 변수의 [값] 비교
  '==='는 엄격한 비교를 하는 것으로 알려져 있다 ([값 & 자료형] -> true).

• 느슨한 타입(loosely typed)의 동적(dynamic) 언어의 문제점은 무엇이고 보완할 수 있는 방법

  실행 도중에 변수에 예상치 못한 타입이 들어와 타입에러가 발생할 수 있음, 동적 타입 언어는 런타임시 확인 할 수 밖에 없기 때문에, 코드가 길고 복잡해질 겨우 타입 에러를 찾기 어려워진다.
  🔨해결: 이러한 불편함을 해소하기 위해 TypeScipt나 Flow 등을 사용할 수 있다.

• undefined와 null의 미세한 차이

  undefined은 변수를 선언하고 값을 할당하지 않은 상태, null은 변수를 선언하고 빈 값을 할당한 상태(빈 객체)이다. 즉, undefined는 자료형이 없는 상태이다.
  

---

JavaScript 객체와 불변성이란 ?

• 기본형 데이터와 참조형 데이터

  기본형 데이터에는 논리형(boolean), 정수형(int), 실수형(double), 문자형(char)
  참조형 데이터에는 배열(Array), 클래스(Class), 인터페이스(Interface)

• JavaScript 형변환
  • '불변 객체'란 - '변하지 않는 객체' 즉 이미 할당된 객체가 변하지 않는다는 뜻을 가지고 있다.
    

// Object freeze 객체를 불변하게 만들기
  let test = {
      name : 'Lee'
  }
  
  Object.freeze(test);
  test.name = 'grace';
  console.log(test)

• 얕은 복사와 깊은 복사

  • 얕은 복사(Shallow Copy)

    객체를 복사할 때, 해당 객체만 복사하여 새 객체를 생성한다.
    복사된 객체의 인스턴스 변수는 원본 객체의 인스턴스 변수와 같은 메모리 주소를 참조한다.
    따라서, 해당 메모리 주소의 값이 변경되면 원본 객체 및 복사 객체의 인스턴스 변수 값은 같이 변경된다.

  • 깊은 복사(Deep Copy)

    객체를 복사 할 때, 해당 객체와 인스턴스 변수까지 복사하는 방식.
    전부를 복사하여 새 주소에 담기 때문에 참조를 공유하지 않는다.

---

호이스팅과 TDZ는 무엇일까 ?

• 스코프, 호이스팅
  • 스코프: 변수, 함수, 클래스가 접근할 수 있는 유효 범위.
  • 호이스팅: 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미.

• TDZ

• 함수 선언문과 함수 표현식에서 호이스팅 방식의 차이

함수 선언식 (function declartion)
함수명이 정의되어 있고, 별도의 할당 명령이 없는 것
함수 전체를 호이스팅. 정의된 범위의 맨 위로 호이스팅되서 함수

    function sum(a,b) {
        return a + b;
    }

함수 표현식 (function Expression)
정의한 function을 별도의 변수에 할당하는 것
별도의 변수에 할당하게 되는데, 변수는 선언부와 할당부를 나누어 호이스팅

const sum = function(a,b) {
  return a + b;
}

• 실행 컨텍스트

  Execution Context 는 자바스크립트의 핵심 개념으로, 코드를 실행하기 위해 필요한 환경이다.
  더 자세히 말하자면, 실행할 코드에 제공할 환경 정보들을 모아놓은 객체이다. 자바스크립트의 동적 언어로서의 성격을 가장 잘 파악할 수 있는 개념.
  모든 코드는 특정한 실행 컨텍스트 안에서 실행된다.
  javascript는 어떤 execution context가 활성화되는 시점에 선언된 변수들을 위로 끌어올리고(hoisting), 외부 환경 정보를 구성하고, this값을 설정하는 등의 동작을 수행하는데, 이로 인해 다른 언어에서는 발생할 수 없는 특이한 현상들이 발생한다.

• 콜 스택

  call은 호출을 뜻하고 stack은 출입구가 하나뿐인 깊은 우물 같은 데이터 구조다. callstack은 자바스크립트가 함수 호출을 기록하기 위해 사용하는 우물 형태의 데이터 구조이다. 항상 맨 위에 놓인 함수를 우선으로 실행된다. 이런 식으로 자바스크립트 엔진은 가장 위에 쌓여있는 context와 관련 있는 코드들을 실행하는 식으로 전체 코드의 환경과 순서를 보장한다.

• 스코프 체인

  스코프에 식별자가 없으면 상위 스코프에서 다시 찾아 나간다.
  이 현상을 스코프 체인 이라고 하며 스코프가 중첩되어있는 모든 상황에서 발생한다.

• 변수 은닉화

  외부 객체로부터 '속성 값(데이터, 멤버 변수값)'을 감추는 특성