Frontend/JavaScript

클로저

💡 클로저는 스코프와 실행 컨텍스트에 대한 사전 지식이 있으면 이해하는데 도움이 된다. 💡 클로저는 함수와 그 함수가 선언된 렉시컬 환경과의 조합이다. 💡 클로저는 외부함수보다 중첩함수가 더 오래 유지되고 이미 생명주기가 종료한 외부 함수의 변수를 참조할 수 있다. - 상위 스코프의 어떤 식별자도 참조하지 않는 함수는 클로저가 아니다. - 중첩 함수가 클로저였지만 외부 함수보다 일찍 소멸되면 클로저의 본질에 부합하지 않는다. 클로저 함수 일급 객체로 취급하는 함수형 프로그래밍 언어에서 사용되는 중요한 특성이다. MDN에서의 정의 : 클로저는 함수와 그 함수가 선언된 렉시컬 환경과의 조합이다. 렉시컬 스코프(= 정적 스코프) const x = 1; function foo() { const x = 10; /..

실행 컨텍스트

💡 렉시컬 환경 - 식별자와 스코프 관리 💡실행 컨텍스트 스택 - 코드 실행 순서 관리 실행 컨텍스트 자바스크립트의 동작 원리 개념을 통해 아래 내용을 이해할 수 있다. 스코프 기반으로 식별자와 식별자에 바인딩된 값을 관리하는 방식 호이스팅이 발생하는 이유 클로저 동작 방식 태스크와 큐와 함께 동작하는 이벤트 핸들러 비동기 처리의 동작 방식 소스 코드의 타입 4가지 타입 코드는 실행 컨택스트를 생성한다. 4가지로 구분하는 이유는? 소스코드의 타입에 따라 실행 컨텍스트를 생성하는 과정과 관리 내용이 다르기 때문이다. 전역 코드 전역에 정의된 함수, 클래스 등의 내부 코드는 포함되지 않는다. var 키워드, 함수선언문 함수 코드 함수 내부에 중첩된 함수, 클래스 등의 내부 코드는 포함되지 않는다. 지역 스코..

원시 값과 객체의 비교

참고할 페이지 - 유사 배열 객체, 이터러블, 래퍼 객체  원시 값 변경 불가능한 값읽기 전용 (값은 변경이 불가능한 값)불변성 (원시 값을 할당하는 변수는 재할당 이외에 변경할 수 없다.) 원시 값을 할당한 변수가 기억하는 메모리 주소를 통해 메모리 공간에 접근하면 원시 값에 접근할 수 있다. 즉, 원시 값을 할당한 변수는 원시 값 자체를 갖는다.  원시 값을 할당한 변수에 새로운 원시 값을 재할당하면 메모리 공간에 저장되어 있는 재할당 이전의 원시 값이 변경되는 것이 아니다.새로운 공간을 확보하고 재할당한 원시 값을 저장한 후, 변수는 새롭게 재할당한 원시 값을 가리킨다.이때 변수가 참조하던 메모리 공간의 주소가 바뀐다. 원시 값은 변경 불가원시 값 자체를 변경할 수 없다는 것이지 변수 값을 변경할 ..

유사 배열 객체, 이터러블, 래퍼 객체

참고 : 원시 값의 문자열과 불변성자바스크립트 문자열은 유사 배열 객체이면서 이터러블이므로 배열과 유사하게 각 문자에 접근할 수 있다. 유사 배열 객체var str= 'string';//문자열은 유사 배열이므로 배열과 유사하게 인덱스를 사용해 각 문자에 접근할 수 있다.console.log(str[0]); //s// 원시 값인 문자열이 객체처럼 동작한다.console.log(str.length); // 6console.log(str.toUpperCase()); // STRING배열처럼 인덱스로 프로퍼티 값에 접근할 수 있고 length 프로퍼티를 갖는 객체를 말한다.문자열은 마치 배열처럼 인덱스를 통해 각 문자에 접근할 수 있다.Length 프로퍼티를 갖기 때문에 유사 배열 객체이고 for 문으로 순회할..