전체 글63 [21.01.06] YDKJSY - Around the Global Scope Why Global Scope? 여러 개의 JS 파일들을 하나의 실행 컨텍스트 안에서 협력하게 하는 방법은 크게 세 가지가 있다. ES 모듈을 사용할 때, 각각의 모듈은 접근이 필요한 모듈이 필요할 때 import 를 할 수 있다. 그래서 서로 다른 파일들은 이 방법을 통해 따로 공유하는 외부 스코프 없이도 JS 환경 안에서 협력이 가능하다. 빌드하는 과정에서 번들러를 사용하면, 모든 파일들은 JS 엔진이나 브라우저로 전송되기 전에 하나의 파일로 병합된다. 번들 유무나 파일들이 개별적으로 브라우저에 연결되는 것과 상관없이, 이러한 파일들을 둘러싼 특정 스코프(e.g. Wrapper function, UMD) 가 존재하지 않는다면 전역 스코프 가 파일들을 서로 협력하게 할 유일한 방법이다. 전역 범위에서 .. 2024. 1. 7. [21.01.06] YDKJSY - The Scope Chain "Lookup" Is (Mostly) Conceptual lookup (검색) : 변수의 런타임 접근으로써, JS 엔진은 변수가 위치한 스코프에서 출발해 참고하고자 하는 변수가 존재할 때까지 상단 / 외부 스코프로 올라간다. 검색을 중지하는 조건은 매칭되는 변수를 찾았거나, 전역 스코프에 도달하거나 둘 중 하나이다. 하지만 위의 예시는 개념적인 이해를 돕기 위한 설명일 뿐이지, 실제로 작동하는 방식은 아니다. 각 스코프는 초기 컴파일 동안 대개 결정된다. 왜냐하면 렉시컬 스코프는 이미 이 시점에서 완료되고, 변수는 실행 시점에서 발생하는 어떤 것에도 영향을 받지 않기 때문이다. 이러한 정보들은 컴파일 동안 결정되기에 AST 단계의 내부 변수에 저장된다. 그리고 프로그램을 실행하는 명령들에 의해 사용된다... 2024. 1. 7. [21.01.02] YDKJSY - What's the Scope? Compiled vs Interpreted 컴파일 방식과 인터프리팅 방식은 기계가 이해할 수 있는 코드로 치환한다는 점에서 대체적으로 유사하다. 하지만 모든 코드가 한번에 변형되는 컴파일 방식과는 달리, 인터프리팅 언어는 한 줄 씩 코드를 읽고 적절한 변형을 거친다. 하지만 그렇다고 JS 엔진의 작동 방식이 딱 이거다, 라고 할 수 없는 이유가 현대의 JS 엔진은 컴파일과 인터프리팅의 방식을 각 단계마다 적절히 변형하고 사용하기 때문이다. 그래서 저자는 JS를 컴파일 방식에 조금 더 가까운 언어라고 묘사하고 있다. Compiling Code 챕터의 서두에서 전에 언급한 주제를 다시 꺼낸 것은 이번에 다룰 스코프가 이 컴파일 단계와 밀접하게 관련된다는 점에 있다. 컴파일러 이론에 따르면, 컴파일로 진행되는.. 2024. 1. 7. [20.12.28] YDKJSY - The Bigger Picture Pillar 1: Scope and Closure 스코프는 서로 중첩을 이루는데, 스코프 안에서는 변수 사용에 대한 룰이 있다. 하나의 스코프 영역에서는, 자신(스코프)의 영역에 선언한 변수와 상위 혹은 외부 스코프의 변수들에 참조할 수 있다. 하위 혹은 내부 스코프의 변수에는 참조할 수 없다. 이러한 특징을 lexical scope 라고 한다. 그리고 스코프 단위는 프로그램이 파싱 될 때 결정된다. 하지만 해당 특징을 가지는 대부분의 언어에 비해 몇 가지 다른 점이 있어서 lexical 적인 특성이 받아들여지지 않기도 하는데 그것은 다음과 같다. 호이스팅 var 키워드로 선언된 변수 : function 단위로 스코프를 가진다. 하지만 이런 점은 그저 JS 언어의 특성 상 몇가지 독특한 부분이기 때문에 .. 2024. 1. 7. [20.12.27] YDKJSY - Digging to the Roots of JS Iteration for..of 구문 var object = /* .. */; for (const value of object) { console.log(value); } //value 1.. //value 2.. spread operator const arr = [1,2,3,4]; const arrCopy = [...arr]; console.log(arrCopy); // [1,2,3,4] console.log(arr === arrCopy); //false Iterables Iterable : 해당 값 안에 있는 원소들을 반복 순회 시킬 수 있는 값. ES6 에서 명시한 iterable 한 자료 구조 : String, Array, Map, Set etc. spread operator 를 통해 문자열을 스.. 2024. 1. 7. [20.12.24] 객관적인 코드 리뷰를 위해 Reference johnnydev 유튜브 Why 지금까지 다양한 이유들로 프로그래밍을 하고 있지만, 내가 짠 코드에 대해 확신이 서지 않을 때가 지금도 종종 있다. 그 막연함을 글로써 정리해보면 내가 가진 문제점을 파악할 수 있을 거라는 생각에 johnnydev 님의 영상 내 정보를 내 블로그에 옮겨 보기로 했다. 정성적 vs 정량적 분석 정성적 근거 : 응답자의 주관적인 견해를 토대로 분석하는 방법 정량적 근거 : 구체적인 수치를 토대로 분석하는 방법 => 코드 리뷰는 서로를 위해 가능한 한 정량적일 필요가 있다. 정성적일 수 있는 근거 파라미터 개수 메서드 하나가 여러 동작을 수행하고 있는 것일 수 있다. 반대로 여러번 쓰이지 않을 함수임에도 불구하고 쪼개는 것에만 치중해 메서드를 나누는 것일 수 .. 2024. 1. 7. 이전 1 ··· 5 6 7 8 9 10 11 다음
