• 회원가입
  • 로그인
  • 구글아이디로 로그인

[Basic] JS - Use Strict - 엄격모드 ★★★

JS 엄격모드 구문 정의

 

"use strict";

 


 

1.

스크립트나 함수 시작 부분에 위 지시어 추가.


2.
스크립트 시작에 추가되면 전역범위에 영향 미침.

함수 안에 추가되면 함수 안 (= 로컬)에서만 미침.

 

3.

"use strict"; 지시어는 ECMAScript 5 버전에서 추가됨. 이전 JS 버전에서는 무시됨.

즉, 숫자(예: 3 + 4;)나 문자열(예: homzzang;)구문 경우, 존재 않는 변수로 컴파일 되어 사라짐.
오직 "use strict"; 지시어를 이해하는 컴파일러에서만 의미 있음.

4.
구문이 아니라 엄격모드로 실행되야 함을 알리는 지시어 (= 단순한 문자적 표현)일 뿐임.

 

5.

엄격모드에선 선언 안 된 변수는 사용 불가.

 

6.

IE 10 이상 주요 최신 브라우저 모두 지원.

IE 9 및 그 이전 버전 브라우저는 지원 안 함.

 

7.

"use strict"는 단순 지시어라, IE9 이하 브라우저에서도 에러는 안 남. 

단지 이해를 못 해서, 엄격모드로 작동 안 할 뿐임.

 

8.

F12 키 개발자모드에서 에러 내용 확인 가능.

 

9.

모든 프로그램에서 엄격모드 사용 가능하며, 깔끔한 코딩에 도움됨.
즉, 엄격모드는 이전에 허용 된 "잘못된 구문"을 실제 오류로 변경.
(예) 

변수명 오류 시 일반모드에선 새 전역변수가 생성되나, 엄격모드에선 에러 발생.

쓰기 권한 없는 속성에 속성값을 설정할 경우 일반모드에선 오류 피드백 못 받으나, 엄격모드에선 피드백 받음.

 

10.
엄격 모드에서는 아래 경우에 에러 발생함.
・쓰기 권한 없는 속성에 속성값 쓰기,
・존재하지 않는 속성 사용,
・존재하지 않는 변수 사용,
・존재하지 않는 객체 사용.


 

 

Use Strict 예제

 

<script>

"use strict"; // 엄격모드 전역범위 미침.

x = 3.14;  // 에러 유발 (∵ 변수 선언 안 됨.)

</script>

 

결과보기


 

<script>

"use strict"; // 엄격모드 전역범위 미침.

homzzang();


function homzzang() {

  y = 3.14;   // 에러 유발 (∵ 변수 선언 안 됨)

}

</script>

 

결과보기

 


 

<script>

x = 3.14;    // 에러 유발 안 함.

homzzang();


function homzzang () {

  "use strict"; // 엄격모드 함수 안에서만 유효.

  y = 3.14;  // 에러 유발. (∵ 변수 선언 안됨)

}

</script>

 

결과보기

 

 

Use Strict 사용 시 에러발생 경우

 

에러1 - 선언 안 된 변수 사용

 

<script>

"use strict";

x = 100;  // 에러 유발

</script>

 

 

에러2 - 선언 안 된 객체 사용

 

<script>

"use strict";

x = {a:10, b:20};  // 에러 유발

</script>

 

※ 객체도 변수 일종.

 

에러3 - 변수삭제 / 객체삭제

 

<script>

"use strict";

var x = 100;

delete x;  // 에러 유발 

</script> 

 

 

에러4 - 함수삭제

 

<script>

"use strict";

function x(a, b) {}; 

delete x;  // 에러 유발

</script>

 

 

에러5 - 매개변수명 중복

 

<script>

"use strict";

function x(a, a) {};  // 에러 유발

</script>

 

 

에러6 - 8진수 변수값 사용

 

<script>

"use strict";

var x = 010;   // 에러 유발

</script>

 

 

에러7 - 8진수 회피 문자

 

<script>

"use strict";

var x = "\010";   // 에러 유발.

</script>

 

 

에러8 - 읽기전용속성에 쓰기

 

<script>

"use strict";

var obj = {};

Object.defineProperty(obj, "x", {value:0, writable:false});

obj.x = 3.14;   // 에러 유발

</script> 

 

 

에러9 - get전용속성에 쓰기

 

<script>

"use strict";

var obj = {get x() {return 0} };

obj.x = 3.14;   // 에러 유발

</script>

 

 

에러10 - 삭제불가속성 삭제 시도.

 

<script>

"use strict";

delete Object.prototype;   // 에러 유발

</script> 

 

 

에러11 - 변수명으로 단어 eval 사용.

 

<script>

"use strict";

var eval = 100;   // 에러 유발

</script>

 

 

에러12 - 변수명으로 단어 arguments 사용.

 

<script>

"use strict";

var arguments = 100;   // 에러 유발

</script>

 

 

에러13 - with 구문 사용

 

<script>

"use strict";

with (Math){x = cos(2)};   // 에러 유발

</script> 

 

 

에러14 - 변수 호출 범위 안에서 eval()로 변수생성.

 

<script>

"use strict";

eval ("var x = 2");

alert (x); // 에러 유발

</script>

 

※ 보안 상 이유로, 변수 호출 범위에서는 eval()의 변수 생성 금지.

 

에러15 - 함수에서 객체 정의 안 된 this 키워드 사용.

 

<script>

"use strict";

function homzzang() {

  alert(this); // undefined 경고창 뜸.

}

homzznag();

</script>

 

 

에러16 - 미래 JS 버전 예약 키워드 이용한 변수 생성

 

<script>

"use strict";

var public = 100;   // 에러 유발 

</script>



 

※ 예약 키워드

 

implements

interface

let

package

private

protected

public

static

yield

 

 

"use strict" 지시어는 스크립트나 함수 시작 부분에서만 인식된다는 점 명심 !!

 

PS.

 

mdn strict mode 강의 

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode (영어)

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Strict_mode (한국어)

 


방문 감사합니다. (즐겨찾기 등록: Ctrl + D)

분류 제목
Basic JS - Home (JS입문) + Javascript Framework (프레임워크) 종류
Basic JS - Intro (JS소개)
Basic JS - Where To (JS위치) - JS구문 / JS코드위치 / JS사용법 ※ JS외부링크 주의사항
Basic JS - Output (JS출력= JS쓰기) ★★★★★
Basic JS - Syntax (JS구문) ★
Basic JS - Statement (JS구문= JS명령문)
Basic JS - Comment (JS주석)
Basic JS - Variable (JS변수) ★★★★★
Basic JS - Operator (연산자) - JS연산자 ★★★★★
Basic JS - Data Type - 데이터유형 ★★★★★ (= 데이터형식 = 데이터타입 = 데이터종류 = 자료형…
Basic JS - Function - JS함수 ★★★★★ ※ 일반함수 특징 2
Basic JS - Object - JS객체 ★★★★★
Basic JS - Scope - JS유효범위 (= JS접근범위 = 변수 종류) ★★★★★★★★★★
Basic JS - Event - JS이벤트 (= JS코드실행방법) ★★★★★
Basic JS - Strings - JS문자열
Basic JS - String Methods - JS문자열메서드
Basic JS - Number - JS숫자
Basic JS - Number Method - JS숫자메서드
Basic JS - Math 객체 - JS수학객체 (= JS산수객체 = Math객체 = Math Object = 매스 …
Basic JS - Dates - JS날짜
1/67
목록
찾아주셔서 감사합니다. Since 2012