마지막 자바스크립트 문법 정리 하기!!
🍎 DOM
Document(HTML 파일)를 Javascript가 알아먹을 수 있는 Object 형태로 Modeling 한 것.
API는 다른 시스템에서 제공하는 기능을 사용할 수 있도록 도와주는 중간자 역할.
-
브라우저의 경우, 기본적으로 DOM과 관련된 API를 제공함으로써 브라우저의 DOM 객체에 접근할 수 있도록 도와준다.
-
모든 DOM의 node들은 '속성'과 '메서드'를 갖고 있다.
Dom의 node
웹 페이지를 구성하는 모든 HTML 태그와 텍스트, 그리고 속성 등을 하나의 블록으로 취급하는 것.
각 블록은 자식 노드, 부모 노드, 형제 노드와 관계를 가지고 있음.
Node 객체의 속성은 해당 객체의 특성을 나타내는 값을 가져오거나 설정하는 데 사용되며,
메서드는 해당 객체가 수행하는 작업을 나타내는 함수임.
🍎 Class
객체를 생성하기 위한 일종의 템플릿. (객체를 생성해내기 위한 설계도를 클래스로 설계해놓는다.)
🌳 constructor란?
Class의 생성자 함수. 생성자 함수는 객첼글 생성할 때 호출되며, 객체를 초기화하는 역할을 함.
Getter와 Setter
getter는 속성 값을 반환하는 메소드.
setter는 속성 값을 설정하는 메소드.
🌳 상속(Inheritance)
Class는 상속을 통해 다른 Class의 기능을 물려받을 수 있음.
상속을 받는 Class를 subclass 또는 derived class라고 하며,
상속을 하는 Class를 superclass 또는 base class라고 함.
🌳 Static Method
Class에서는 static 키워드를 사용하여 Class 레벨의 메소드를 정의할 수 있음.
Class 레벨의 메소드는 인스턴스에서 호출할 수 없으며, Class 이름으로 직접 호출할 수 있음.
인스턴스를 만들지 않고 사용할 수 있기 때문에 유틸리티 함수, 정적 속성인 경우 인스턴스 간에 복제할 필요가 없는 데이터(똑같은 것을 공유해서 쓸 때)를 만들 때 사용되곤 함!!
즉, 인스턴스를 만들 필요가 없을 때 사용.
🍎 클로저
클로저는 함수와 그 함수가 선언된 렉시컬 환경과의 조합
1.렉시컬 스코프
JS엔진은 함수를 어디서 '호출했는지'가 아니라 함수를 어디에 '정의했는지'에 따라 상위 스코프를 결정한다.
다시 말하면, "외부 렉시컬 환경에 대한 참조"에 저장할 참조값,
즉, 스코프에 대한 참조는 함수 정의가 평가되는 시점에 함수가 정의된 환경(위치)에 의해 결정됨.
2.정의된 환경에 대한 정보를 저장하는 곳: outer
호출되는 환경과는 상관없이 정의된 환경에 대한 정보를 LexicalEnvironment > outer에 기억한다.
3.클로저와 렉시컬 환경
외부 함수보다 중첩 함수가 더 오래 유지되는 경우, 중첩함수는 이미 생명 주기가 종료한 외부 함수의 변수를 (여전히) 참조할 수 있다. ← 이 개념에서 중첩 함수가 바로 클로저
(외부 함수의 렉시컬환경을 (여전히) 참조)
🌳 클로저의 활용
- 클로저는 주로 '상태를 안전하게 변경하고 유지하기 위해 사용'
- 의도치 않은 상태의 변경을 막기위해.
- 상태를 안전하게 은닉한다(특정 함수에게만 상태 변경을 허용한다)
결론: 클로저는 상태(state)가 의도치 않게 변경되지 않도록 안전하게 은닉하고 특정 함수에게만 상태 변경을 허용하여 상태를 안전하게 변경하고 유지하기 위해 사용한다.
🌳 캡슐화와 정보 은닉
캡슐화란
프로퍼티와 메서드를 하나로 묶는 것을 말함.
- 프로퍼티: 객체의 상태(state)
- 메서드: 프로퍼티를 참조하고 조작할 수 있는 동작
객체의 특정 프로퍼티나 메서드를 감출 목적으로 사용.
가지고 있는 정보가 예민하고 민감해서 정보 은닉이 필요한 경우.
- 객체의 상태 변경을 방지함으로써 정보보호
- 객체 간의 의존성(결합도 - coupling)을 낮춤
java 등 기타 객체 지향 언어에서 사용하는 public, private, protected → 접근을 제한할 수 있는 기능
자바스크립트는 제공 안함: 즉, 별도의 조치를 취하지 않으면 기본적으로 외부 공개가 된다는 의미!
