영벨롭 개발 일지

📌 들어가며...오늘 포스팅은 자바스크립트의 실행 컨텍스트(Execution Context) 입니다.대체 실행 컨텍스트는 무엇이고, 어떤 역할을 하며 어떠한 것들을 담고 있는지 살펴보겠습니다.🤔 자바스크립트의 실행 컨텍스트(Execution Context)실행 컨텍스트는 소스코드를 실행하는 데 필요한 환경을 제공하고, 코드의 실행 결과를 실제로 관리하는 영역이다. 본격적으로 학습하기에 앞서 요약 내용부터 보고 들어가겠습니다.참고로 실행 컨텍스트는 공부할 내용이 엄청나기에 이번 포스팅은 상당히 길어질 것으로 보입니다...하지만 당장은 매우 어렵고 이해하기 힘드실지라도... 함께 으쌰으쌰! 반드시 할 수 있습니다!(이 포스팅은 '모던 자바스크립트 Deep Dive' 교재를 기반으로 작성되었습니다) 📌 ..

[ 참조 값 복사 ] 객체는 변경 가능한 값(mutable value)로, 객체를 할당받은 변수(식별자)가 가리키는 메모리에는 실제 객체를 가리키는 참조 값이 저장되어 있습니다. 때문에 동일한 객체를 공유하는 여러개의 식별자(변수) 중 하나라도 객체를 수정하게 되면, 여러 식별자들은 동일한 참조 값을 가지고 있기 때문에 서로 영향을 받게 되는데요! const user = { name: 'Lee', age: 20, emails: ['abc123@gmail.com'] } // ============ 참조 값 복사 ============ const copyUser = user; console.log(copyUser === user) // true user.age = 26; console.log(user, co..

[ 원시 타입 primitive type & 객체 타입 reference type ] 자바스크립트가 제공하는 7가지 데이터 타입은 Number, String, Boolean, null, undefined, Symbol, 객체 타입(Object, Array, function)이 있습니다. 이 데이터 타입은 크게 원시 타입(primitive type)과 객체 타입(reference type)으로 구분할 수 있습니다. 원시 타입 객체 타입 원시 값은 변경 불가능한 값(immutable value) 객체는 변경 가능한 값(mutable value) 값에 의한 전달(pass by value) 참조에 의한 전달(pass by reference) 원시 값을 변수에 할당하면 변수에는 실제 값이 저장됨 객체를 변수에 할..

[ 파싱 & 렌더링 ] 브라우저의 렌더링 과정을 살펴보기 앞서 파싱과 렌더링이 무엇인지 살펴보겠습니다. ★ 파싱 parsing 파싱은 구문분석이라고도 할 수 있습니다. 프로그래밍 언어로 작성된 텍스트 문서를 읽어 들여 실행하기 위해, 이 텍스트 문서의 문자열을 토큰으로 분해하고 토큰에 문법적 의미와 구조를 반영하여 파스 트리를 생성하는 과정을 파싱이라고 합니다. 여기서 토큰(token)은 문법적 의미를 갖는 코드의 최소 단위입니다. ★ 렌더링 rendering 렌더링은 HTML, CSS, JavaScript 로 작성된 문서를 파싱하여 브라우저에 시각적으로 출력하는 것입니다. [ 브라우저의 렌더링 과정 ] 1. 요청과 응답 렌더링에 필요한 리소스(html, css, js, img, 폰트 파일 등)는 모두 ..

[ 자바스크립트의 배열 ] const arr = ["apple", "banana", "orange"]; 배열은 여러 개의 값을 순차적으로 나열한 자료구조입니다. 배열이 가지고 있는 각각의 값을 '요소 element' 라고 부르며, 자바스크립트의 모든 값(원시값, 객체, 배열, 함수 등)은 배열의 요소가 될 수 있습니다. 배열의 인덱스는 다른 프로그래밍 언어들과 같이 zero based 인덱스로, 0부터 시작합니다. 사실, 자바스크립트에 배열이라는 타입은 존재하지 않습니다! 배열은 객체 타입이지만, 일반 객체와는 구별되는 특징이 있습니다. 배열은 객체와 달리 값의 순서와 length 프로퍼티를 갖고 있기 때문에 순차적으로 요소를 접근할 수 있다는 장점이 있습니다. 객체 배열 구조 프로퍼티 키와 프로퍼티 값..

[ 타입 변환이란? ] 자바스크립트의 모든 값은 number, string, boolean 등과 같이 타입을 가지고 있습니다. 자바스크립트의 타입 변환에는 개발자가 의도적으로 값의 타입을 변환하는 명시적 타입 변환(explicit coercion, 타입 캐스팅)과, 개발자의 의도와는 상관없이 자바스크립트 엔진에 의해 암묵적으로 타입이 변환되는 암묵적 타입 변환(implicit coercion, 타입 강제 변환)이 있습니다. 명시적 타입 변환이나 암묵적 타입 변환이 기존 원시 값을 직접 변경하는 것은 아닙니다. 원시 값은 변경 불가능한 immutable한 값이기 때문이죠. 즉 타입 변환은 기존 원시 값을 사용해 다른 타입의 새로운 원시 값을 생성하는 것입니다. let x = 10; // 명시적 타입 변환 ..