# strict mode

38개의 포스트
post-thumbnail

[20장] Strict Mode

writed by johan Strict Mode가 무엇인가? 오류를 줄이기 위해 엄격하게 자바스크립트 코드를 작성하도록 허용하는 모드이다. 문법적 오류, 잠재적인 오류에 대해 명시적인 에러를 발생시킨다. Strict Mode에 대한 조언 전역에 strict mode를 적용하지 말자. strict mode 스크립트와 non-strict mode 스크립트를 혼용하면 오류를 발생하기 쉽다. 사용한다면 즉시 실행 함수로 스크립트 전체를 감싸서 스코프를 구분하자 함수 단위로도 strict mode를 적용하지 말자 strict mode가 적용된 함수가 참조할 함수 외부의 컨텍스트에 strict mode를 적용하지 않으면 문제가 생길 수 있다. Strcit mode가 발생시키는 에러 선언하지 않은 변수 참조시 ReferenceError 발생 변수 ,

1일 전
·
0개의 댓글
·
post-thumbnail

React 스터디 3주차 useEffect - 1

서론 useEffect . 정말 많이 들어봤지만 잘 모르는 상황이라 서둘러 찾아보고 싶었던 주제다. useEffect 는 왜 쓰는 걸까? 렌더링때 어떻게 동작할까? 애초에 effect 라는 건 뭐지? 이번 포스트는 이러한 물음에서 시작했다. effect 에 대해 먼저 알아보자 렌더링 코드와 이벤트의 비교 어떤 컴포넌트들은 외부 시스템들과 동기화될 필요가 있다. Effect 는 렌더링 이후어떤 코드가 동작하게 해서 리액트 바깥은 몇몇 시스템과 컴포넌트를 동기화할 수 있게 한다. effect 에 대해 알기전에 리액트 컴포넌트 내의 로직중 2가지 타입 Rendering code 와 Event handler 에 대해 친숙해질 필요가 있다. Rendering code 는 컴포넌트의 상위 레벨에 존재한다. 상위 레벨이라 함은 props, state 를 다루고 변형하며 보기 원하는 화면에 JSX 를 반환하는 곳을 말한다. 수학 공식처럼 이는 오로지 결과를

2023년 8월 17일
·
2개의 댓글
·

React에 Strict Mode 는 뭘까?

리액트로 프로젝트를 진행하다보면 무조건 알아야될 가장 기초적인 개념이라고 할 수 있는데, ``은 무슨 역할을 하는 것이길래 항상 따라오는 것일까? React.StrictMode 대부분 처음엔 이 코드의 존재를 모르고 있다가 useEffect 훅을 사용하다 console.log() 를 찍어보고 나서야 두번 호출되는 것을 확인하고 '어, 이거 왜 이러지?' 하고 해결법을 찾다가 발견하게 되는 경우가 많다. (React 버전이 17 이상이면 두번 찍히지 않는다.) ` 란, 리액트 공식 문서에 따르면 애플리케이션 내의 잠재적인 문제를 알아내기 위한 도구이며, Fragment와 같이 UI를 렌더링하지 않고, 자손들에 대한 부가적인 검사와 경고를 활성화 한다고 한다. 그리고 ` 는 개발 모드에서만 활성화 되기 때문에, 프로덕션 빌드에서는 영향을 끼치지 않는다고 한다.

2023년 8월 12일
·
0개의 댓글
·
post-thumbnail

strict mode

🐰 strict mode란? 해당 코드는 전역 스코프에도 x 변수의 선언이 존재하지 않기 때문에 ReferenceError를 발생시킬 것 같지만 자바스크립트 엔진은 암묵적으로 전역 객체에 x 프로퍼티를 동적 생성한다. 이러한 현상을 암묵적 전역이라 한다. strict mode는 자바스크립트 언어의 문법을 좀 더 엄격히 적용하여 오류를 발생시킬 가능성이 높거나 자바스크립트 엔진의 최적화 작업에 문제를 일으킬 수 있는 코드에 대해 명시적인 에러를 발생시킨다. > 🌟 ESLint 같은 린트 도구를 사용해도 strict mode와 유사한 효과를 얻을 수 있다. 린트 도구는 정적 분석 기능을 통해 소스코드를 실행하기 전에 소스코드를 스캔하여 문법적 오류만이 아니라 잠재적 오류까지 찾아내고 오류의 원인을 리포팅해주는 유용한 도구다. 🐰 strict mode의 적용 strict mode를 적용하려면 전역의 선두 또는 함수 몸체의 선두에 `'us

2023년 6월 7일
·
0개의 댓글
·
post-thumbnail

20장 strict mode

✅ 20.1 strict mode란? 위 코드의 실행 결과는 무엇일까? foo 함수 내에서 선언하지 않은 x 변수에 값 10을 할당했고, 자바스크립트 엔진은 x 변수가 어디에서 선언되었는지 스코프 체인을 통해 검색할 것이다. foo 함수의 스코프에서도 x 변수 선언을 찾지 못하고, foo 함수 컨텍스트 상위 스코프 (전역 스코프)에서도 찾지 못할 것이다. 이 경우 ReferenceError가 발생할 것 같지만, JS 엔진은 암묵적으로 전역 객체에 x 프로퍼티를 동적 생성한다. 이 전역 객체 x 프로퍼티는 전역 변수처럼 사용할 수 있게된다. 이런 현상을 암묵적 전역이라 한다. 개발자의 의도와 다른 암묵적 전역은 오류의 원인이 될 가능성이 크다. 안타깝게도 오타나 문법 지식의 미비로 인한 실수는 언제나 발생한다. 따라서 오류를 줄여 안정적인 코드를 생산 하기 위해서는 좀 더 근본적인 접근이 필요하다. 다시 말해, **잠재적인 오류를 발생시키기 어려운 개발 환경을

2023년 6월 1일
·
0개의 댓글
·
post-thumbnail

[React] Strict mode

Strict mode란? 애플리케이션 내 잠재적인 문제를 알아내기 위한 도구. Fragment와 같이 UI를 렌더링하지 않으며, 하위 컴포넌트에 대한 부가적인 검사와 경고를 활성화함. 스트릭트 모드는 개발 모드에서만 활성화되기 때문에 프로덕션 빌드에는 영향을 끼치지 않음. 다음과 같은 부분에서 도움이 됨. 안전하지 않은 생명주기를 사용하는 컴포넌트 발견 레거시 문자열 ref에 대한 경고 권장되지 않는 findDOMNode 사용에 대한 경고 예상치 못한 부작용 검사 레거시 context API 검사 Ensuring reusable state 예시 위 예시에서 Header와 Footer 컴포넌트에는 스트릭트 모드 검사가 이루어지지 않음. 하지만 ComponentOne과 Compo

2023년 5월 12일
·
0개의 댓글
·

[Deep dive] 20. strict mode

strict mode란? 다음 코드에서 foo함수는 x변수를 스코프 체인을 통해 검색하게 된다. x변수는 전역 스코프에서도 존재하지 않기 때문에 ReferenceError를 일으킬거 같지만 자바스크립트 엔진에서 암묵적 전역을 통해 x 프로퍼티를 동적 생성한다. > 개발자의 의도와 상관없이 발생한 암묵적 전역은 오류를 발생시킬 수 있다. 따라서 let var const 키워드를 사용해 변수를 선언한 다음 사용해야 한다. 이를 지원하기 위해 strict mode가 추가되었다. strict mode

2023년 5월 4일
·
0개의 댓글
·

strict mode

잠재적인 오류를 발생시키기 어려운 개발 환경을 만들고 그 환경에서 개발하는 것 전역에 'use strict' 적용 피하자 전역에 적용한 strick mode는 스크립트 단위로 적용 스크립트 단위 적용은 다른 스크립트에 영향 없이 적용된다 그렇지만 nob=n-script와 혼용하는 것은 오류 발생 가능성이 높기에 즉시 실행 함수로 스크립트 전체를 감싸서 스코프를 구분하고 즉시 실행 함수 선두에 적용한다. 함수 단위로 적용 피하자 어떤 함수는 적용하고 어떤 함수는 적용하지 않는 것은 바람직하지 않으며 일일이 함수에 적용하는 것은 번거로운 일이다. strick mode가 적용된 함수가 참조할 함수 외부의 컨텍스트에 strick mode를 적용하지 않는다면 문제가 발생할 수도 있다. 일반 함수의 this strick mode 에서 함수를 일반 함수로서 호출하면 this에 undefined가 바인딩 된다. arguments 객체 strick mod

2023년 4월 18일
·
0개의 댓글
·
post-thumbnail

#8 strict mode / 빌트인 객체

2023.02.24 1. strict mode 1-1 strict mode란? 전역 스코프에도 x(찾으려는 변수) 변수의 선언이 존재하지 않으면 자바스크립트 엔진은 암묵적으로 전역 객체에 x 프로퍼티를 동적 생성 -> 전역 객체의 x프로퍼티는 마치 전역 변수처럼 사용 가능(=암묵적 전역) ✔ ES5부터 strict mode 추가 ✔ strict mode - 자바스크립트 언어의 문법을 좀 더 엄격히 적용하여 오류를 발생시킬 가능성이 높거나 자바스크립트 엔진의 최적화 작업에 문제를 일으킬 수 있는 코드에 대해 명시적인 에러 발생 ✔ 린트 도구를 사용해도 strict mode와 유사한 효과를 얻음 ✔ 린트 도구 - 정적 분석 기능을 통해 소스코드를 실행하기 전에 소스코드를 스캔하여 문법적 오류만이 아니라 잠재적 오류까지 찾아내고 오류의 원인을 리포팅해주는 유용한 도구 ✔ strict mode보다는 린트 도구 사용 1-2 strict mode

2023년 2월 24일
·
0개의 댓글
·

javascript strict mode

💡 strict mode ✔ strict mode란? > 자바스크립트 엔진은 foo 함수의 스코프에서부터 출발하여 전역 스코프까지 x를 찾게 된다 어디에도 없는 x 변수로 인해 에러가 발생할 것 같지만 자바스크립트 엔진은 암묵적으로 전역 객체에 x 프로퍼티를 동적 생성한다 이때 전역 객체의 x 프로퍼티는 마치 전역 변수처럼 사용할 수 있고, 이러한 현상을 암묵적 전역이라 한다 strict mode는 자바스크립트 언어의 문법을 좀 더 엄격히 적용하여 오류를 발생시킬 가능성이 높거나 자바스크립트 엔진의 최적화 작업에 문제를 일으킬 수 있는 코드에 대해 명시적인 에러를 발생시킨다 ✔ strict mode의 적용 strict mode를 적용하려면 전역의 선두, 혹은 함수 몸체의 선두에 'use strict';를 추가한다 ✔ 전역에 strict mode를 적용하는 것은 피하자 전역에 적용한 strict mode는 스크립트 단위

2023년 1월 28일
·
0개의 댓글
·
post-thumbnail

[Study] JS DeepDive : 20. strict mode

모던 자바스크립트 Deep Dive 스터디 20. strict mode 20.1 strict mode란? > 💡 strict mode는 자바스크립트 언어의 문법을 좀 더 엄격히 적용하여 오류를 발생시킬 가능성이 높거나 자바스크립트 엔진의 최적화 작업에 문제를 일으킬 수 있는 코드에 대해 명시적인 에러를 발생시킨다. 위 예시에서, x 변수는 선언되지 않았다. 자바스크립트 엔진은 foo 함수의 스코프에서부터 출발하여 전역 스코프까지 x를 찾게 된다. 그런데, 어디에도 없는 x 변수로 인해 에러가 발생할 것 같지만 자바스크립트 엔진은 암묵적으로 전역 객체에 x 프로퍼티를 동적 생성한다. 이때 전역 객체의 x 프로퍼티는 마치 전역 변수처럼 사용할 수 있다. 이러한 현상을 암묵적 전역이라 한다. 이러한 암묵적 전역을 예상치 못한 오류를 발생시키는 원인이 될 가능성이 크다. 따라서 잠재적인 오류를 방생시키기 어려운 개발 환경을 만드는 것이

2022년 11월 6일
·
0개의 댓글
·

스코프 (Scope)

스코프(Scope) : 변수 접근 규칙에 따른 변수의 유효 범위 범위는 블록{} 또는 함수에 의해 나누어 지고, 그 범위를 스코프라고 부른다. 변수 접근 규칙 1. 안쪽 스코프에서 바깥쪽 스코프로는 접근할 수 있지만 반대는 불가능하다. 바깥쪽 스코프에서 선언한 변수는 안쪽 스코프에서 사용 가능하지만, 안쪽 스코프에서 선언한 변수는 바깥쪽 스코프에서 사용할 수 없다. 2. 스코프는 중첩이 가능하다. 3. 가장 바깥의 스코프는 전역 스코프(Global scope)

2022년 9월 6일
·
0개의 댓글
·
post-thumbnail

Strict mode 의 장점

2022년 8월 26일
·
0개의 댓글
·

엄격모드(Strict mode)

엄격모드(Strict mode) 이 글은 지난 this와 바인딩?에서 다른 내용들이 많아 추출하여 쓴 글이다. 엄격모드는 ECMAScript 5에서 소개된 JavaScript의 엄격모드라고 한다. 엄격모드를 지원하지 않는 브라우저에서는 엄격모드의 코드가 다른 방식으로 동작할 것이라고 한다. 그렇기 때문에 사용에 주의해야 한다고 한다. 엄격모드는 평범한 JavaScript 시멘틱스(기능들?)에 몇 가지 변경이 일어난다고 한다. 몇가지 정리해 보자. 조용히 무시되던 에러들이 throwing 한다고 한다. JavaScript 엔진의 최적화 작업을 어렵게 하는 실수들을 바로 잡는다고 한다. 엄격 모드는

2022년 7월 25일
·
0개의 댓글
·
post-thumbnail

<JS>strict mode

strict mode란 ? 다음 예제 실행 결과를 예측해보자 > function foo() { x = 10; } foo(); consoloe.log(x); // ? 함수 내부에서 선언하지 않은 x 변수에 값 10을 할당했다. 전역 스코프에서도 x 변수의 선언이 존재하지 않기 때문에 ReferenceError를 발생시킬 것 같지만 자바스크립트는 암묵적으로 전역객체에 x 프로퍼티를 동적 생성한다. x의 결과는 10이 나오게 된다. 개발자의 의도와는 상관없이 발생한 암묵적 전역은 오류를 발생시키는 원인이 될 가능성이 크다. 따라서 반드시 let, const 키워드를 사용하여 변수를 선언한 다음에 사용해야 한다. > strict mode는 쉽게 말해 자바스크립트 언어의 문법을 좀 더 엄격하게 적용해서 오류를 줄이고 안정적인 생산을 하기 위한 근본적인 해결책이다. strict mode 의 적용 strict mode를 적용하려면 전역의 선두 또는 함수 몸체의

2022년 6월 23일
·
0개의 댓글
·
post-thumbnail

Strict mode

strict mode란 무엇일까? 엄격한 기준으로 코드를 검사하고 발생 할 수 있는 오류들을 잡는 모드이다. strict mode의 적용 strict mode를 적용하려면 전역의 선두 또는 함수 몸체의 선두에 "use strict"; 를 추가한다. 전역의 선두에 추가하면 스크립트 전체에 strict mode가 적용된다. 함수 몸체의 선두에 추가하면 해당 함수와 중첩 함수에 strict mode가 적용된다. 여기서 오류가 나게 된 이유는 변수 선언은 반드시 var,let,const를 사용해야한다. 여기선 왜 오류가 나지 않을까? 코드의 선두에 strict mode를 위치시키지 않으면 얘기될수 있는 오류를 잡아내지 못한다. 그렇기 때문에 자바스크립트 엔진은 암묵적으로 전역 객체에 x 프로퍼티를 동적 생성한다. 이때 전역 객체의 x 프로퍼티는 마치 전역 변수처럼 사용할 수 있다. 이런 현상을 암묵적 전역이라고 한

2022년 6월 21일
·
0개의 댓글
·

[JS] 20. strict mode

1. strict mode 란? 자바크립트 언어의 문법을 좀 더 엄격히 적용하여 오류를 발생시ㄹ 가능성이 옾거나 자바스크립트 엔진의 최적과 작업에 문제를 일으킬 코드에 대해 명시적인 에러를 발생시킨다. 린트 도는 strict mode가 제한하는 오류는 물론 코딩 컨벤션을 설정 파일 형태로 정의하고 강제할 수 이씩 때문에 더욱 강력한 효과를 얻을 수 있다. 2. strict mode 적용 strict mode를 적용하려면 전역의 선두 또는 함수 몸체의 선두에 'use strict';를 추가한다. 전역 선두에 추가하면 스크립트 전체에 strict mode가 적용된다. 함수 몸체의 선두에 추가하면 해당 함수와 중첩 함수에 strict mode가 적용된다. 코드 선두에 'use strict';를 위치시키지 않으면 strict mode가 제대로 동작하지 않는다. 3. 전역에 strict mode를 적용하는 것은 피하자 스크립트 단위로 적용된 strict m

2022년 5월 17일
·
0개의 댓글
·
post-thumbnail

모던 자바스크립트 Deep Dive | strict mode

20 strict mode 20.1 strict mode란? x는 선언되지 않았기 때문에 ReferenceError을 발생 시킬것 같지만 자바스크립트 엔진에 의해 암묵적으로 전역 객체 x가 동적 생성되는데 이를 암묵적 전역이라고 한다. 이러한 암묵적 전역은 오류를 발생시키는 원인이 될 가능성이 크기 때문에 strict mode를 사용한다. strict mode(엄격 모드)는 ES5부터 추가되었다. >#### 💡ESLint ESLint같은 도구를 사용해도 strict mode와 유사한 효과를 얻을 수 있다. 린트 도구는 정적 분석 기능을 통해 소스코드를 실행하기 전에 소스코드를 스캔하여 문법적 오류만이 아니라 잠재적 오류까지 찾아내고 오류의 원인을 리포팅해주는 유용한 도구다. 20.2 strict mode의 적용 전

2022년 5월 13일
·
0개의 댓글
·
post-thumbnail

📋 모던 자바스크립트 Deep Dive | 20장 strict mode

모던 자바스크립트 Deep Dive 도서의 20장을 정리하였습니다. 20.1 strict mode란? 잠재적인 오류를 발생시키기 어려운 개발 환경을 만들고 그 환경에서 개발하는 것이 좀 더 근본적인 해결책이라고 할 수 있다. 이를 지원하기 위해 ES5부터 strict mode(엄격 모드)가 추가되었다. strict mode는 자바스크립트 언어의 문법을 좀 더 엄격히 적용하여 오류를 발생시킬 가능성이 높거나 자바스크립트 엔진의 최적화 작업에 문제를 일으킬 수 있는 코드에 대해 명시적 에러를 발생시킨다. 20.2 strict mode의 적용 전역의 선두 혹은 함수 몸체의 선두에 use strict를 추가한다. 그러면 스크립트 전체에 엄격 모드가 적용된다. 20.3 전역에 strict mode를 적용하는 것은 피하자 전역에 사용된 strict mode는 스크립트 단위로 적용된다. 20.4 함수 단위로 strict mo

2022년 5월 7일
·
0개의 댓글
·

[Javascript] strict mode

strict mode란? > strict mode(엄격 모드)란 자바스크립트 언어의 문법을 좀 더 엄격히 적용하여 오류를 발생시킬 가능성이 높거나 자바스크립트 엔진의 최적화 작업에 문제를 일으킬 수 있는 코드에 대해 명시적인 에러를 발생시킨다. stirct mode가 문법을 좀 더 엄격히 적용한다고 하는데, 이것이 어떤 상황에 필요한걸까? 위 예제를 보면, foo 함수 내에 선언하지 않은 x 변수에 10을 할당했다. 위 코드만 보면 당연히 x 변수가 선언되어 있지 않고 자바스크립트 엔진이 변수 x 선언을 찾지 못하기 때문에 참조 에러를 발생시킬 것이라고 생각했다. 그러나, 자바스크립트 엔진은 이러한 경우에 암묵적으로 전역 객체에 x 프로퍼티를 동적으로 생성한다. 이때 전역 객체의 x 프로퍼티는 마치 전역 변수처럼 사용할 수 있는 것이다. 이러한 현상을 암묵적 전역이라고 한다. 암묵적 전역은 오류를 발생시키는 원인이 될 수 있기 때문에 변수에는 반드시 , ,

2022년 5월 7일
·
0개의 댓글
·