01장 데이터 타입

1-1 데이터 타입의 종류

• 기본형
  • number, string, boolean, null, undefined // ES6 -> symbol 추가
• 참조형
  • object, Array, Function, Date, RegExp // ES6 -> Map, WeakMap, Set, WeakSet 추가
• 새로 알게 된 내용
  • Symbol
    • 변경이 불가능한 원시 타입의 값, 다른 값과 중복되지 않는 고유한 값임
  • Map
    • Map은 Object를 변형한 것
    • 넣은 순서대로 반복되고 키가 문자열 뿐만 아니라 어떤 값이어도 상관이 없음
    • size를 체크 가능하며 set,get,has 등 다양한 메소드를 쓸수 있음
  • WeakMap
    • 키가 객체임
    • 기존 객체를 약한 참조로 해서 가비지 컬렉션 방해를 하지 않기 때문
    • 객체에 정보를 저장하고 싶을 때 사용하면 좋다고 함
    • Map에서 쓸 수 있는 entries, keys, values 메소드를 쓸 수 없음
  • Set
    • Array와 비슷함
    • 중복이 불가능하며 중간 값 확인이 불가능하고 많은 메소드를 사용 할 수 있음
  • WeakSet
    • 객체만 값으로 받음
    • WeakMap과 동일하게 약한 참조를 통해서 가비지 컬렉션을 방해하지 않기 위함
• 참고 자료 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Keyed_collections

1-2 데이터 타입에 관한 배경지식

• 변수
  • 변할 수 있는 수 (변할 수 있는 무언가) -> 무언가는 데이터로 숫자,문자열 객채, 배열 등
• 식별자
  • 어떤 데이터를 식별하는 데 사용하는 이름으로 변수명을 뜻

1-3 변수 선언과 데이터 할당

• 변수를 선언하고 데이터를 할당할 때 변수 영역에 값을 직접 대입하지 않고 한 단계를 더 거치는 이유
  • 데이터 변환을 자유롭게 할 수 있고 메모리를 효율적으로 관리하기 위해
  • 문자열 데이터의 변환을 처리하려면 변수와 데이터를 별도의 공간에 나누어 저장해야함

1-4 기본형 데이터와 참조형 데이터

• 불변값
  • 기본형 데이터는 모두 불변값임
  • 바꿀 수 있으면 변수, 바꿀 수 없으면 상수 -> 이 둘을 구분 짓은 것은 변수 영역의 메모리임 변수 공간에 다른 데이터를 재할당 할 수 있는지가 관건
  • 불변성 여부를 구분할 때는 데이터 영역의 메모리
  • 불변값과 상수는 같은 것이 아님
  • 한 번 만들어진 값은 가비지 컬렉팅을 당하지 않는한 변하지 않음
• 가변값
  • 참조형 데이터와 기본형 데이터와의 차이는 객체의 변수 영역이 존재한다는 것
  • 참조형 데이터가 이뮤터블 하지 않다(가변값이다) 라고 하는 이유는 데이터 영역에 저장된 값은 모두 불변값인데 변수에 다른 값을 대입 할 수 있어서.
• 변수 복사 비교
  • 기본형은 값을 복사하고 참조형은 주솟값을 복사한다. -> 어떤 데이터 타입이든 변수 할당을 위해 주솟값을 복사해야해서 js의 모든 테이터 타임은 참조형 데이터일 수 밖에 없음 -> 기본형은 주솟값을 복사하는 과정이 한 번만 이루어지고, 참조형은 한 단계를 더 거친다는 차이임
  • 참조형 데이터의 속성이 아닌 참조형 데이터 객체 자체를 변경하면 값이 달라짐

  var obj1 = { c: 10, d: "ddd" };
  var obj2 = obj1;
  obj2 = { c: 20, d: "ddd" };

1-5 불변 객체

• 객체도 데이터 차제를 변경하고자 하면 (새로운 데이터 할당) 기본형과 마찬가지로 기존 데이터는 변하지 않는다 (불변성) 내부 속성 변경 시 가변성
• 얕은 복사와 깊은 복사
  • 얕은 복사(shallow copy) : 바로 아래 단계의 값만 복사함
    • 원본과 사본이 동일한 참조형 데이터 주소를 가리키므로 사본을 바꾸면 원본도 변경됨
  • 깊은 복사(deep copy) : 모든 값 전부 다 복사함
    • 중첩된 객체에서 프로퍼티 내부의 값들까지 전부 복사
    • 간단하게 깊은 복사하는 방법 JSON
      • JSON.parse(JSON.stringify(target));
      • 근데 이건 객체내부 메서드, proto, getter/setter 등과같은 JSON으로 변경할 수 없는 프로퍼티는 무시함

1-6 undefined와 null

• undefined : 어떤 값을 지정할 것이라고 예상되는 상황에 실제로 넣지 않았을 때 자동으로 undefined를 반환
  • 값을 대입하지 않은 변수, 데이터 영역의 메모리 주소를 지정하지 않은 식별자에 접근할 때
  • 객체 내부의 존재하지 않는 프로퍼티에 접근하려고 할 때
  • return 문 없거나 호출되지 않는 함수의 실행 결과
• null
  • null은 ‘비어있음'을 명시적으로 나타내고 싶을 때 사용
  • typeof null은 object라고 반환되는데, 이는 자바스크립트 자체 버그임 그래서 밑에 처럼 === 씀
• undefined와 null을 구분하기 위해서는 동등 연산자 대신, 일치 연산자(===)를 사용해야함

1주차 돌아보기

• 앞 쪽은 읽어보면서 쓱쓱 이해가 되었는데, 1-4 정도 부터 집중을 딱 하고 읽어야 그나마 이런 소리구나 이해가 되는 정도 아직 정확하게 이해가 되진 않음.

• 기억할 것들

  • 기본형 데이터는 하나의 값만을 가짐. 불변성을 가지며 값 자체를 저장, 참조형 데이터는 여러 값을 가질 수 있으며 객체를 참조함
  • 얕은 복사: 객체의 1단계 깊이의 속성만 복사, 중첩된 객체는 참조를 공유

    • let obj1 = { a: 1, b: { c: 2 } };
      let obj2 = { ...obj1 }; // 얕은 복사
      obj2.b.c = 3;
      console.log(obj1.b.c); // 3 (공유된 참조)```

  • 깊은 복사: 내부의 모든 값들을 하나하나 찾아서 전부 복사

  var copyObjectDeep = function (target) {
    var result = {};
    if (typeof target === "object" && target !== null) {
      for (var prop in target) {
        result[prop] = copyObjectDeep(target[prop]);
      }
    } else {
      result = target;
    }
    return result;
  };

• 깊은 복사와 얕은 복사를 좀 더 공부해봐야 이해가 갈 듯..