TIL-20220801

khundi·2022년 8월 1일
0
post-thumbnail

객체

객체란 물리적으로 존재하거나 추상적으로 생성할 수 있는 것 중에서 '자신의 속성을 가지고 있고 다른 것과 식별 가능한 것'을 의미한다.
속성(프로퍼티)와 동작(메서드)로 구성되어 있다.
객체를 만든다는 것은 물리적 존재나 추상적 생각을 구현물들을 속성과 메서드로 정의하는 과정.

프로토타입

자바스크립트는 프로토타입 기반 언어다.
어떤 객체를 원형으로 삼고 이를 복제(참조)함으로써 상속과 비슷한 효과를 얻는다.

Mixin

자바스크립트 객체는 상속받거나 인스턴스화해도 자동으로 복사작업이 일어나지 않는다. 자바스크립트엔 인스턴스로 만들 개념 자체가 없고 오직 객체만 있기 때문이다.
Mixin은 다른 언어와 달리 자바스크립트에선 없는 클래스 복사 기능을 흉내낸 것.
다른 객체를 상속받을 필요 없이 구현되어 있는 메서드를 담고 있는 객체.

실행 컨텍스트(Execution Context)

실행할 코드에 제공할 환경 정보들을 모아놓은 객체이다.
자바스크립트는 어떤 실행 컨텍스트가 활성화되는 시점에 선언된 변수를 위로 끌어올리고(호이스팅 hoisting), this 값을 설정하고, 자동으로 생성되는 전역 공간을 제외하면 함수를 실행할 때 생성됨.

스코프(Scope)

현재 접근 할 수 있는 변수들의 범위를 의미한다. 즉 현재 위치에서 볼 수 있는 변수들의 범위를 의미한다.
ES6에서부터는 블록에 의해서도 스코프 경계가 발생하게 함으로써 구분이 명확해짐.
'식별자의 유효범위'를 안에서부터 바깥으로 차례로 검색해 나가는 것을 Scope chain이라고 한다.

클로저(Closure)

함수를 일급 객체로 취급하는 함수형 프로그래밍 언어(Haskell, Scala 등)에서 보편적으로 등장하는 특성. 그래서 자바스크립트만의 고유한 개념이 아니어서 ECMAscript 명세에서도 클로저의 정의를 다루지 않고 있다.
자바스크립트 엔진은 함수를 어디서 호출했는지가 아니라 함수를 어디에 정의했는지에 따라 상위 스코프를 결정한다. 이를 정적 스코프(Lexical Scope)라고 한다. 즉, 클로저는 어떤 함수에서 선언한 변수를 참조하는 내부 함수에서만 발생하는 현상이라고 볼 수 있다.

클로저의 활용

상태를 안전하게 변경하고 유지하기 위해 사용.
상태가 의도치 않게 변경되지 않도록 상태를 안전하게 은닉(information hide)하고 특정 함수에만 상태 변경을 허용하기 위해 사용한다.

메모리 관리

변수를 0, null, undefined으로 할당하면 가비지 컬렉터(garbage collector)가 수거해간다.

cloneNode()

요소를 복사할 때 cloneNode() 메서드를 사용한다.
인자로 true를 전달하면 콘텐츠 전체가 함께 복사된다.

// paragraph를 복사해서 greetings 다음에 삽입한다.
greetings.after(paragraph.cloneNode(true));

replaceWith()

다른 요소를 교체할 때 replaceWith() 메서드를 사용한다.
replaceWith() 는 인자에 문자열이나 요소를 개수 제한 없이 받는다.

// greetings 요소를 문서에서 제거하고 paragraph 요소로 교체한다.
greetings.replaceWith(paragraph);

마무리

오늘의 뽀모도로
18.3뽀모도로 : 7.6h

profile
안녕하세요. 웹 프론트엔드 개발자 전성훈입니다.

0개의 댓글