[딥다이브] strict mode, 레퍼 객체

Dongs·2023년 3월 26일
0

[딥다이브]

목록 보기
8/11

strict mode

  • 자바스크립트 문법을 좀 더 엄격하게 적용하여 오류를 발생시킬 가능성이 높거나 자바스크립트 엔진의 최적화 작업에 문제를 일으키는 코드에 대하여 명시적인 에러를 발생시킨다.
"use strict;"

함수 몸체의 선두나 전역 선두에 다음과 같이 선언한다!

  • 비슷한 것으로 ESLint 도구가 있다.

strict mode가 발생시키는 에러

  • 암묵적 전역
(function () {
	'use strict';
	
  	x=1;
  console.log(x);
})());

즉시 실행 함수 안에 x=1 이라고 별도의 변수 선언 키워드 없이 선언하였다. 본래라면 window 객체 안에 x라는 프로퍼티가 생길 것이다. 그러나 strict mode가 적용된 시점에서는 선언하지 않은 변수를 참조하면 ReferenceError 가 발생해버린다.

  • 변수, 함수, 매개변수의 삭제
(fucntion () {
	'use strict';
 	var x = 1;
 	delete x; // Delete of an unqualified identifier in strict mode.
 
 function foo(a) {
	delete a;
}
	delete foo;
}());

본래 var키워드로 선언된 변수는 window 객체의 프로퍼티로 들어간다. 그래서 delete를 사용하여 프로퍼티 값을 지울 수 있었다. 하지면 strict mode가 적용된 시점에서는 delete를 사용하여 변수, 함수, 매개변수를 삭제하는 것이 불가능하다.

  • 매개변수 이름의 중복
(function () {
	'use strict';
  
  function foo(x, x) {
	return x + x;
  }
  console.log(foo(1,2));
}());

strict mode가 적용되지 않은 시점에서는 위 코드의 경우에 따로 에러를 출력하지 않고 첫 번째 인자가 두 번째 인자에 덮여씌워져서 4가 출력되게 된다. 그러나 strict mode는 이를 허용하지 않고 에러를 출력한다.

  • with 문의 사용
    eval과 with는 금기어이다. 보이면 도망치자..

strict mode가 적용시키는 변화

일반함수의 this

  • strict mode 에서 함수를 일반 함수로써 호출하면 this에 undefined가 바인딩된다. 생성자 함수가 아닌 일반함수 내에선 this를 사용할 필요가 없기 때문이다. 에러는 따로 출력하지 않는다.

arguments 객체

(function (a) {
  'use strict';
  
  a=2;
  
  console.log(arguments); // { 0: 1, length: 1}
}(1));

위의 코드는 매개변수에 전달된 인수를 재할당 한 것이다. strict mode에서는 arguments 객체에 변경된 사항이 적용되지 않는다.


표준 빌트인 객체

  • ECMAScript 사양에 정의된 객체, 전역객체의 프로퍼티로써 제공되기에 별도의 선언 없이 전역변수처럼 언제나 참조할 수 있음

  • Object, String , Number, Boolean, Date, Math, Map, Set, Promise, Function 등등.. 이 있다.

  • Math, Reflect, JSON을 제외한 표준 빌트인 객체는 모두 인스턴스를 생성할 수 있는 생성자 함수 객체이다.

원시값과 레퍼객체

  • 문자열, 숫자, boolean 등 원시값에 객체처럼 접근하면 생성되는 임시 객체를 레퍼 객체라고 한다.
const str = 'hello world';

console.log(str.length); //11

위와 같이 원시값이 할당되어 있는 변수 str에 대해서 마침표 표기법으로 접근하면 그 순간 String 생성자 함수의 인스턴스가 생성되고 레퍼 객체의 [[StringData]] 내부 슬롯에 문자열이 할당된다. 레퍼 객체로 프로퍼티에 접근하거나 메서드를 호출한 후, 다시 원시 값으로 되돌린다.

  • nullundefined는 객체처럼 접근해도 레퍼 객체를 생성하지 않는다.
profile
자대고 css 하는 프론트엔드 개발자

0개의 댓글