[TIL] 230524

이세령·2023년 5월 24일
0

TIL

목록 보기
11/118

오늘 배운 것

데이터 타입

  1. 변수 선언과 데이터 할당
  • 식별자가 담기는 공간과 값이 담기는 공간이 있고 식별자 공간에 값이 담긴 데이터가 할당된다.
  • 참조형 데이터의 경우, 식별자를 위한 별도 공간이 따로 필요하다.
  • 배열이 안에 담기면 배열을 위한 공간이 따로 필요하다.
  • 참조형 데이터는 가변하다
  • 사용하지 않는 것은 Garbage Collector가 없애준다.

얕은복사와 깊은복사

객체의 프로퍼티에 접근해서 할당할 경우 기존 객체의 주소값을 가리키기 때문에 같이 값이 변경될 수 있다.(가변하다)

  1. 얕은 복사
  • for ~ in
    각 프로퍼티를 하나씩 전부 접근한다.
  • 재귀 활용
    let copyObject = function (target) {
      let result = {};
      for (let prop in target) {
          result[prop] = target[prop];
      }
      return result;
    };
    객체를 하나 만들어서 console.log로 찍어보면 프로퍼티 하나하나 다 들어가는 것을 확인할 수 있었다.
    result[prop]의 값과 target[prop]의 값을 할당해준다. -> prop는 키가 나타난다.
  • 문제점
    중첩된 객체는 바로 아래 단계만 복사해서 문제가 해결되지 않는다.
  1. 깊은 복사
    하나하나 통째로(?) 복사 하는 방법
    새로운 공간을 이용해서 복사를 수행한다.
    독립적 객체로 만들어준다.
    
    let copyObjectDeep = function(target) {
    let result = {};
    if (typeof target === 'object' && target !== null) {
        for (let prop in target) { // 순회
            result[prop] = copyObjectDeep(target[prop]); // 재귀 target객체의 속성을 깊은 복사
            console.log(prop);
        }
    } else {
        result = target; // 기초 자료형일 때 복사
    }
    return result;
}

Undefined와 null

  • 없다는 것을 명시할 때에는 null 사용
  • typeof null 사용하면 object가 나온다.
    -> JS의 버그이다.

실행 컨텍스트

정의 : 실행할 코드에 제공할 환경정보 객체
VE + LE + ThisBindings

  • 콜 스택
    첫번째는 항상 전역객체가 들어간다.
    코드의 순서를 정해준다.

호이스팅

  • VE가 정보를 담으면 LE를 만들고 LE를 활용한다.
  • 식별자를 모아서 맨 위로 올려준다.
    실행전에 변수정보를 미리 알고있다.
  • 법칙
    1) 선언부 맨 위로
    2) 함수
    함수 선언문은 호이스팅이 되기 때문에, 커다란 오류가 될 수 있으니 주의해야 한다.
    함수 표현식을 주로 사용하자.

this

  1. 호출될 때 결정
    전역 환경: 브라우저(window), Node.js(global)
  2. 메서드 내부에서의 this
    . 이나 [] 를 이용해 객체가 메서드를 실행한다.
    3.우회하는 법
  • 변수 활용

    var self = this;

    잘 안쓴다.

  • 화살표 함수
    this바인딩을 생략한다.
    일반 함수와 화살표 함수의 가장 큰 차이점 : this binding 여부

  • 콜백함수 호출 시 그 내부의 this
    함수라서 this가 없어지기에 전역객체를 바라본다.
    콜백 함수에 별도로 this 지정할 경우 예외가 발생한다.

  • 생성자 내부 함수에서의 this
    new 생성자 -> 해당 this를 가리킨다.

  1. 명시적 this 바인딩
  • call
함수.call(객체, 매개변수);
  • apply
함수.call(객체, [매개변수]);
  • bind
함수.bind(객체, 매개변수);

함수에 미리 this를 적용하거나 부분 적용 함수를 사용할 때 쓰기도 한다.

어려웠던 내용

전반적으로 무슨 느낌인지는 알 것 같은데 예제를 직접 실행해보았는데 예상했던 결과가 아니라 다르게 나오는 경우가 많았다.

궁금한 내용 / 부족한 내용

한번씩 들어보고 찾아본 개념들이지만 VE와 LE의 정의는 처음 보았다.
전체적으로 어떤 느낌인지는 알겠지만, 안보고 설명할 수 있을 정도는 아닌 것 같다.

느낀 점

오늘은 집중을 제대로 안한 것도 있고 내용이 개념적인 부분이라 어려운 것도 있어서 머리속에 제대로 안들어왔다
컨디션 조절도 하면서 내일 빠르게 강의를 다시 훑어보며 확실하게 짚고 넘어가야겠다. 내가 직접 설명할 수 있을 정도로 공부해야겠다.

profile
https://github.com/Hediar?tab=repositories

0개의 댓글