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

[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 - Date Method - JS날짜메서드
Basic JS - Array - JS배열 ★★★★★
Basic JS - Array Method - JS배열메서드
Basic JS - Sorting Array - JS배열정렬
Basic JS - Booleans() 메서드 - JS참거짓판단 (= JS참거짓메서드 = JS블린메서드 = JS불린즈메…
Basic JS - Comparison and Logical Operator - JS비교연산자 / JS논리연산자
Basic JS - if...else 조건문 구문 ★ (= 이프 엘스 조건문 = 이프문) ※ 시간 조건문
Basic JS - Switch 조건문 구문 (= 스위치문 = 스위치조건문)
Basic JS - for반복문 ★★★★★ - (JS포반복문 = for문 = JS포문) ※ 가변 배열키
Basic JS - While 반복문 구문 (= While문 = While반복문 = 와일문 = 와일반복문)
Basic JS - Break - 반복문중단 (= 브레이크) ★ / Continue - 반복문건너뛰기 (= 컨티뉴) ★…
Basic JS - Type Conversion - 데이터타입변환 (= 데이터유형변환 = 데이터타입변경 = 데이터유형변…
Basic JS - Bitwise Operations -
Basic JS - Regular Expressions -
Basic JS - Errors - Throw and Try to Catch (에러 처리 구문)
Basic JS - Debugging (디버깅/디버그) - (에러/오류) 찾기/제거 방법
Basic JS - Hoisting (호이스팅) - 변수선언끌어올리기 (= 변수선언위치변경)
Basic JS - Use Strict - 엄격모드 ★★★
Basic JS - Style Guide and Coding Conventions -
Basic JS - Best Practices (올바른코딩)
2/67
목록
찾아주셔서 감사합니다. Since 2012