이번 정리 목차는 20 ~ 22장이다.
20장 strict mode
스트릭 모드란
- 선언하지 않은 변수에 값을 할당하면 엔진은 암묵적으로 전역 객체에 프로퍼티를 동적 생성하여 전역 변수처럼 사용 가능한 것을 암묵적 전역이라 한다.
- 코드의 오류를 줄여 안정적인 코드를 만들기 위해 strict mode가 추가됨
- ESLint도구 사용해도 유사한 효과 얻을 수 있음
- 린트 도구는 스트릭모드가 제한하는 오류는 물론 코딩 컨벤션을 설정 파일 형태로 정의하고 강제할 수 있기에 더 강력한 효과 얻음으로 린트 도구 쓰자
- ES6에 클래스와 모듈은 기본적으로 스트릭모드 적용됨
스트릭 모드 적용
- 적역의 선두 또는 함수 몸체의 선두에 “use strict”; 추가
- 전역의 선두에 추가하면 스크립트 전체에 스트릭 모드 추가
- 함수 몸체의 선두에 추가하면 해당 함수와 중첩함수까지 스트릭모드 적용
- 선두에 위치하지 않으면 제대로 동작 X
전역에 스트릭 모드 적용 피하자
- 전역에 적용한 스트릭트 모드는 스크립트 단위로 적용 되는데 어떤 스크립트는 사용하고 어떤 스크립트는 사용 안하고 하는 것은 오류 발생 특히 외부 서드파티 라이브러리 사용하면 스트릭모드 아닌경우도 있기 때문에 적용 피하자…. 즉시 실행 함수로 스크립트 전체를 감싸서 스코프 구분하고 선두에 스트릭 모드 적용하자!!
함수 단위로 스트릭모드 적용도 피하자
- 함수도 어떤건 쓰고 어떤건 안쓰고 하면 바람직하지 않다.
- 스트릭모드는 즉시 실행 함수로 감싼 스크립트 단위로 적용하는 것이 바람직하다.
스트릭모드가 발생시키는 에러
- 선언하지 않은 변수 참조하면 ReferenceError
- delete 연산자로 변수, 함수, 매개변수 삭제하면 SyntaxError
- 중복된 매개 변수 이름 사용하면 SyntaxError
- with문(전달된 객체를 스코프 체인에 추가) 사용하면 SyntaxError
스트릭모드 적용에 의한 변화
- 스트릭 모드에서 일반함수로서 호출하면 this에 undefined 바인딩, 일반 함수 내에서는 this를 사용할 필요가 없기 때문, 에러는 안 남
- 스트릭 모드에서는 매개변수에 전달된 인수를 재할당해도 arguments객체에 반영X
21장 빌트인 객체
자바스크립트 객체의 분류
- 표준 빌트인 객체: ECMA스크립트 사양에 정의된 객체, 애플리케이션 전역의 공통 기능 제공, 실행 환경의 관계없이 언제나 사용 가능, 전역객체의 프로퍼티로서 제공, 별도의 선언 없이 전역 변수처럼 언제나 참조 가능
- 호스트 객체: ECMA스크립트 사양에 정의되어 있지 않지만 자바스크립트 실행 환경에서 추가로 제공하는 객체, 브라우저 환경에서는 클라이언트 사이드 WebAPI, Node.js환경에서는 고유API
- 사용자 정의 객체: 사용자가 직접 정의한 객체
표준 빌트인 객체
- JS는 Object, String, Number 등 40여개의 표준 빌트인 객체 제공
- Math, Reflect, JSON제외 모두 생성자 함수 객체다.
- 생성자 함수 객체인 표준 빌트인 객체는 프로토타입 메서드와 정적 메서드(인스턴스 없이도 호출 가능한 메서드) 제공
- 생성자 함수 객체가 아닌 표준 빌트인 객체는 정적 메서드만 제공
원시값과 래퍼 객체
- 문자열, 숫자, 불리언 값에 객체처럼 마침표 표기법 또는 대괄호 표기법으로 접근하면 엔진이 일시적으로 원시값을 연관된 객체로 변환
- 원시값을 객체처럼 사용하면 엔진은 암묵적으로 연관된 객체를 생성하여 생성된 객체로 프로퍼티에 접근하거나 메서드를 호출하고 다시 원시값으로 되돌린다.
- 원시값을 객체처럼 접근하면 생성되는 임시 객체가 래퍼 객체이다.
- 래퍼 겍체에 의해 마치 객체처럼 사용 할 수 있으므로 new 연산자와 함께 호출하여 인스턴스 생성할 필요도 없고 권장X
- null과 undefined는 래퍼 객체 생성 X
전역 객체
- 전역 객체는 코드가 실행되기 이전 엔젠에 의해 어떤 객체보다도 먼저 생성되는 특수한 객체, 어떤 객체에도 속하지 않는 최상위 객체
- globalThis는 ES11에서 도입 식별자를 통일한 놈이다.
- 전역객체는 표준 빌트인 객체, 호스트 객체, var 키워드로 선언한 전역 변수, 전역 함수를 프로퍼티로 갖는다.
[특징]
- 개발자가 의도적 생성 X, 생성자 함수 제공 X
- 프로퍼티 참조할 때 window 생략 가능
- 표준 빌트인객체, 호스트 객체를 프로퍼티로 가지고 있다
- 모든 자바스크립트 코드는 하나의 전역 객체 window 공유
- 전역 객체는 몇 가지 프로퍼티와 메서드 가지고 있음, 전역 변수와 전역 함수처럼 사용 가능
빌트인 전역 프로퍼티
- 전역 객체의 프로퍼티 의미, 애플리케이션 전역에서 사용하는 값을 제공
- Infinity 프로퍼티: 무한대 나타내는 숫자값
- NaN: 숫자가 아님을 나타내는 숫자값 NaN을 갖는다.
- undefined: 원시타입 undefined를 값으로 갖는다.
빌트인 전역 함수
- 애플리케이션 전역에서 호출할 수 있는 빌트인 함수, 전역 객체의 메서드
- eval: 코드를 나타내는 문자열을 인수로 전달받는다. 표현식이라면 런타임에 평가하여 값을 생성하고, 표현식이 아닌 문이라면 런타임에 실행한다. 여러 개의 문으로 이루어져 있으면 모든 문 실행하고 마지막 결과값을 반환, eval함수는 기존의 스코프를 런타임에 동적으로 수정한다. 보안에 매우 취약하고 엔진에 의해 최적화 수행되지 않으므로 처리속도 느리다 사용 금지하자!!
- isFinite: 전달받은 인수가 유한수인지 검사하여 맞으면 true 아니면 false, 숫자 타입 아니면 숫자타입 변환 후 검사 수행, NaN으로 평가되는 값이라면 false반환, null은 true반환
- isNaN: 전달받은 인수가 NaN인지 검사하여 불리언 타입 반환, 숫자 타입 아니면 숫자타입 변환 후 검사 수행
- parseFloat: 문자열을 실수로 해석 반환
- parseInt: 문자열을 정수로 해석하여 반환, 두 번째 인수로 진수 지정 가능
- encodeURI: 완전한 URI를 문자열로 전달받아 이스케이프 처리 위해 인코딩, 이스케이프처리는 네트워크를 통해 정보를 공유할 때 어떤 시스템에서도 읽을 수 있는 아스키 문자 셋으로 변환 하는 것
- decodeURI: 인코딩된 URI를 인수로 전달받아 이스케이프 처리 이전으로 디코딩
- encodeURIComponent: URI 구성요소를 전달받아 인코딩
- decodeURIComponent: URI 구성요소 디코딩
암묵적 전역
- 암묵적 전역은 단지 전역 객체의 프로퍼티로 추가되었을 뿐이라 변수가 아님
- 호이스팅 발생 X, delete 연산자로 삭제 가능
22장 this
this 키워드
- this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수
- this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드 참조 가능
- this가 가리키는 값, this 바인딩은 함수 호출 방식에 동적으로 결정
- this는 코드 어디에서든 참조 가능하다.
- 일반적으로 객체의 메서드 내부 또는 생성자 함수 내부에서만 의미가 있다.
함수 호출 방식과 this 바인딩
- 일반 함수 호출, 메서드 호출, 생성자 함수 호출, Function.prototype.apply/call/bind메서드에 의한 간접 호출
'JS DeepDive' 카테고리의 다른 글
| 모던 자바스크립트 DeepDive 공부 내용 10차 (0) | 2023.05.08 |
|---|---|
| 모던 자바스크립트 DeepDive 공부 내용 9차 (0) | 2023.05.08 |
| 모던 자바스크립트 DeepDive 공부 내용 7차 (0) | 2023.05.08 |
| 모던 자바스크립트 DeepDive 공부 내용 6차 (0) | 2023.05.08 |
| 모던 자바스크립트 DeepDive 공부 내용 5차 (0) | 2023.05.08 |