Basic-Syntax

Import vs. Require 참고 및 출처

일시적 사각지대(Temporal Dead Zone, TDZ) 일시적 사각지대(Temporal Dead Zone, TDZ)는 JavaScript에서 변수가 선언되었지만 아직 초기화되지 않은 상태로 존재하는 코드 영역을 의미한다. 이 개념은 ES6(ECMAScript 2015)에서 let과 const 키워드가 도입되면서 함께 등장했다. TDZ는 변수가 스코프에 들어가는 시점(코드 블록의 시작)부터 해당 변수의 선언문이 실행되는 시점까지의 구간을 가리킨다. 이 구간에서는 변수가 존재하지만 접근할 수 없는 상태이다. 1 2 3 4 5 6 { // TDZ 시작 (x에 대한) console.log(x); // ReferenceError: Cannot access 'x' before initialization let x = 10; // TDZ 종료 (x에 대한) console.log(x); // 10 (정상 작동) } 위 예제에서 x는 블록의 시작부터 존재하지만(호이스팅됨), let x = 10이 실행되기 전까지는 접근할 수 없다. 이 기간이 바로 TDZ이다. ...

Block JavaScript에서 블록 스코프(Block Scope) 는 중괄호({})로 감싸진 코드 블록 내에서 선언된 변수나 함수가 해당 블록 내부에서만 유효한 범위를 의미한다. 이는 코드의 구조와 가독성, 유지보수성에 큰 영향을 미치며, 변수의 생명 주기와 가시성을 결정짓는 중요한 개념이다. 블록 스코프는 JavaScript에서 변수의 가시성과 생명주기를 제어하는 강력한 개념이다: ES6에서 let과 const 키워드를 통해 도입되었다. 중괄호({})로 둘러싸인 코드 블록 내에서만 변수에 접근할 수 있다. 메모리 효율성, 코드 구조화, 버그 방지에 도움이 된다. 일시적 사각지대(TDZ)를 통해 더 예측 가능한 변수 동작을 제공한다. 클로저와 결합하여 강력한 패턴을 구현할 수 있다. JavaScript에서 블록은 다음과 같은 상황에서 생성된다: ...

Function JavaScript의 함수 스코프(Function Scope)는 함수 내에서 선언된 변수의 가시성과 접근성을 정의하는 중요한 개념이다. 이 스코프는 JavaScript의 변수 관리 및 코드 구조에 큰 영향을 미친다. 함수 스코프의 정의 함수 스코프란 함수 내부에 선언된 변수와 함수가 해당 함수 내부에서만 접근 가능하다는 JavaScript의 특성을 의미한다. 이는 함수가 자신만의 독립적인 변수 환경을 가지고 있음을 뜻한다. 함수가 실행될 때 생성되고, 함수가 종료되면 메모리에서 사라진다. 1 2 3 4 5 6 7 8 9 function exampleFunction() { // 이 변수는 함수 내부에서만 접근 가능 var functionScopedVar = "함수 스코프 내부 변수"; console.log(functionScopedVar); // "함수 스코프 내부 변수" } exampleFunction(); // console.log(functionScopedVar); // ReferenceError: functionScopedVar is not defined 위 예시에서 functionScopedVar는 exampleFunction 내부에서만 존재하며, 함수 외부에서는 접근할 수 없다. ...

Global 자바스크립트에서 글로벌 스코프는 코드 전체에서 접근할 수 있는 가장 넓은 범위를 의미하며, 여기서 선언된 변수나 함수는 프로그램 전반에서 사용이 가능하다. 자바스크립트의 전역 스코프는 코드의 어느 위치에서나 접근할 수 있는 최상위 스코프이다. 전역 변수와 함수는 편리하게 사용할 수 있지만, 이름 충돌, 의도치 않은 수정, 메모리 관리 등의 문제를 일으킬 수 있다. 현대 자바스크립트 개발에서는 모듈 시스템, 클로저, 네임스페이스 패턴 등을 활용하여 전역 스코프의 사용을 최소화하고, 코드를 논리적인 단위로 구성하는 것이 좋은 관행으로 여겨진다. ...

Hoisting 호이스팅(Hoisting)은 JavaScript 엔진이 코드를 실행하기 전에 변수, 함수, 클래스 또는 임포트의 선언부를 스코프의 최상단으로 끌어올리는 것처럼 동작하는 JavaScript의 메커니즘으로, 이름 그대로 ‘끌어올린다(hoist)‘는 의미를 가진다. 그러나 실제로 코드가 물리적으로 재배치되는 것은 아니다. 이는 JavaScript 엔진의 컴파일 과정에서 일어나는 일종의 추상적 개념이다. 호이스팅은 JavaScript의 핵심 메커니즘 중 하나로, 코드의 실행 방식에 영향을 미친다. 효과적인 JavaScript 개발자가 되기 위해서는 호이스팅의 개념과 다양한 선언 방식에 따른 차이점을 이해하는 것이 중요하다. 모던 JavaScript에서는 let과 const를 사용하여 변수를 선언하고, 함수 표현식을 활용하는 것이 호이스팅으로 인한 예기치 않은 동작을 방지하는 데 도움이 된다. 또한, 모든 변수를 스코프의 최상단에서 선언하는 습관을 들이면 호이스팅으로 인한 혼란을 최소화할 수 있다. ...

Variable Declarations JavaScript에서 변수 선언(Variable Declarations)은 프로그램에서 데이터를 저장하고 참조하는 데 사용되는 중요한 개념이다. 변수 선언 방식에 따라 변수의 **유효 범위(Scope)**와 재할당 가능 여부 등이 결정된다. ES6(ECMAScript 2015) 이전에는 var 키워드만을 사용하여 변수를 선언했으나, 이후 let과 const 키워드가 도입되어 보다 다양한 변수 선언이 가능해졌다. JavaScript에서는 주로 세 가지 키워드를 사용하여 변수를 선언한다: var 키워드 사용 let 키워드 사용 const 키워드 사용 Var 키워드 var는 JavaScript의 가장 오래된 변수 선언 방식이다. ...

변수 명명 규칙(Variable Naming Rules) JavaScript의 변수 명명 규칙(Variable Naming Rules)은 코드의 가독성과 유지보수성을 높이는 데 중요한 역할을 한다. 좋은 변수 이름을 사용하면 코드를 처음 보는 사람도 더 쉽게 이해할 수 있고, 나중에 자신이 작성한 코드를 다시 볼 때도 의도를 빠르게 파악할 수 있다. 필수 규칙 (문법적 제약) 변수 이름에는 다음과 같은 필수 규칙이 적용된다: 문자, 숫자, 밑줄(_), 달러 기호($)만 사용 가능하다. 1 2 3 let userName = "John"; // 올바른 이름 let user_name = "John"; // 올바른 이름 let $price = 100; // 올바른 이름 변수 이름은 숫자로 시작할 수 없다 (문자, 밑줄, 또는 달러 기호로 시작해야 한다). ...

Type Casting 파이썬에서는 다양한 내장 함수를 사용하여 데이터 타입을 변환할 수 있다. 데이터 타입을 변환할 때에는 문자열을 숫자로 변환할 때는 해당 문자열이 유효한 숫자 형식이어야 한다. 실수를 정수로 변환할 때는 소수점 이하가 버려진다. 복잡한 데이터 구조(리스트, 딕셔너리 등)를 변환할 때는 주의가 필요하다. 등을 주의해야 한다. 정수로 변환 (int()) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 # 정수형 변환 float_num = 3.14 int_num = int(float_num) # 3 (소수점 이하 버림) # 실수형 변환 a = float("10.5") # 문자열을 실수로 integer = 5 # 정수를 실수로 float_num = float(integer) # 5.0 b = float(10) # 문자열을 숫자로 변환 str_num = "123" number = int(str_num) # 123 float_num = float("3.14") # 3.14 # 진수 변환 binary_str = "1010" decimal = int(binary_str, 2) # 10 (2진수를 10진수로) hex_str = "1A" decimal = int(hex_str, 16) # 26 (16진수를 10진수로) 문자열로 변환 (str()) ...

ES Modules vs. CommonJS 자바스크립트 애플리케이션이 복잡해지면서 코드를 모듈화하는 방법이 중요해졌다. 이에 두 가지 주요 모듈 시스템인 CommonJS와 ES Modules가 등장했다. 이 두 시스템은 각각 고유한 특성과 사용 사례를 가지고 있다. JavaScript 모듈 시스템의 선택은 프로젝트의 요구 사항, 타겟 환경, 그리고 기존 코드베이스에 크게 의존한다. 최신 프로젝트에서는 ES Modules의 채택이 증가하는 추세이지만, CommonJS는 Node.js 생태계에서 여전히 중요한 역할을 하고 있다. 두 시스템의 장단점을 이해하고, 필요에 따라 적절한 시스템을 선택하거나 하이브리드 접근 방식을 채택하는 것이 좋다. 또한, 점진적으로 ES Modules로 마이그레이션하는 전략을 고려할 수 있으며, 이를 통해 모던 JavaScript의 이점을 활용하면서 기존 코드의 호환성도 유지할 수 있다. ...