1장 데이터 타입

01 데이터 타입의 종류

  • 기본형(primitive type) - 숫자, 문자열, 불리언, null, undefined, 심볼
  • 기본형 특징 - 값이 담긴 주솟값을 바로 복제
  • 참조형(reference type) - 객체, 배열, 함수, 날짜, 정규표현식, Map, WeakMap, Set, WeakSet
  • 참조형 특징 - 값이 담긴 주솟값들로 이루어진 묶음을 가리키는 주소값을 복제

02 데이터 타입에 관한 배경지식

1-2-1 메모리와 데이터

  • 1 bit - 0, 1
  • 1 byte = 8 bit

1-2-2 식별자와 변수

  • 변수 -> 변할 수 있는 무언가 -> 데이터 -> 문자열, 숫자, 객체, 배열...
  • 식별자 -> 변수명

03 변수 선언과 데이터 할당

1-3-1 변수 선언

var ys;
  • 변할 수 있는 데이터를 만든다. 이 데이터의 식별자는 ys로 한다. -> 변경 가능한 데이터가 담길 수 있는 공간 또는 그릇

1-3-2 데이터 할당

var ys;
ys = 'hi'

var ys = 'hi' // ys는 변수 영역, 'hi'는 데이터 영역
  • 왜 변수 영역에 값을 직접 대입하지 않을까?
    -> 데이터 변환을 자유롭게 함과 동시에 메모리를 더욱 효율적으로 관리하기 위하여 !

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

1-4-1 불변값

  • 변수와 상수 -> 변수 영역
  • 불변성 여부 -> 데이터 영역
  • 상수와 불변값을 혼동하여 쓰지 말 것!

    변수 ys에 문자열 'hi'를 할당했다가 'hihello'로 바꿨다면? 'hi'가 'hihello'로 바뀌는 것이 아니라 새로운 문자열 'hihello'를 만들어 그 주소를 변수 ys에 저장합니다.
    결론적으로, 'hi'와 'hihello'는 완전히 별개의 데이터입니다.

1-4-2 가변값

  • 데이터 영역에 저장된 값은 모두 불변값
  • 변수영역 에는 다른 값을 얼마든지 대입할 수 있다.
  • 불변(immutable)하지 않다(가변값이다)

1-4-3 변수 복사 비교

  • 객체의 프로퍼티 변경 시
var ys = 30;
var preYs = ys;
var obj1 = { c: 12, d: 'ok' }
var obj2 = obj1

preYs = 29;
obj2.c = 13;

ys !== preYs // true
obj1 === obj2 // true
  • 객체 자체를 변경했을 때
var ys = 30;
var preYs = ys;
var obj1 = { c: 12, d: 'ok' }
var obj2 = obj1

preYs = 29;
obj2 = { c: 13, d: 'okk' }

ys !== preYs // true
obj1 === obj2 // false

05 불변 객체

1-5-1 불변 객체를 만드는 간단한 방법

  • 불변 객체는 언제 필요할까?
    -> 값으로 전달받은 객체에 변경을 가하더라도 원본 객체는 변하지 않아야 할 때
  • immutable.js, baobab.js 등...
// 기존 정보를 복사해서 새로운 객체를 반환하는 함수(얕은복사)
var copyObject = function (target) {
  var result = {};
  for (var prop in target) {
    result[prop] = target[prop];
  }
  return result;
};

1-5-2 얕은 복사와 깊은 복사

  • 얕은 복사(shallow copy) - 바로 아래 단계의 값만 복사
  • 깊은 복사(deep copy) - 내부의 모든 값들을 하나하나 찾아서 전부 복사
// 객체의 깊은 복사를 수행하는 범용 함수
var copyObjectDeep = function(target) {
  var result = {};
  if (typeof target === 'object' && target !== null) {
    for (var propr in target) {
      result[prop] = copyObjectDeep(target[prop]); // 재귀적으로 수행
    }
  } else {
    result = target;
  }
  return result;
];
// JSON을 활용한 간단한 깊은 복사
var copyObjectViaJSON = function (target) {
  return JSON.parse(JSON.stringify(target));
};

// 메서드(함수)나 숨겨진 프로퍼티인 __proto__나 getter/setter 등과 같이 JSON으로 변경할 수 없는 프로퍼티들은 모두 무시합니다.

06 undefined와 null

  • 자바스크립트 엔진이 자동으로 undefined를 부여하는 경우
  1. 값을 대입하지 않은 변수, 데이터 영역의 메모리 주소를 지정하지 않은 식별자에 접근할 때
  2. 객체 내부의 존재하지 않는 프로퍼티에 접근하려고 할 때
  3. return 문이 없거나 호출되지 않는 함수의 실행 결과
  • undefined의 2가지 경우
  1. 사용자가 명시적으로 부여한 경우(실존하는 데이터) -> null 값을 사용하자 !
  2. 비어있는 요소에 접근하려 할 때 반환되는 경우

좋은 웹페이지 즐겨찾기