Modern JavaScript Deep Dive
-
모던 자바스크립트 딥 다이브 14장. 전역 변수의 문제점Modern JavaScript Deep Dive 2022. 5. 2. 22:11
지역 변수의 생명 주기는 함수의 생명 주기와 일치한다. 변수의 생명 주기는 메모리 공간이 확보된 시점부터 메모리 공간이 해제되어 가용 메모리 풀에 반환되는 시점까지다. 할당된 메모리 공간은 더 이상 그 누구도 참조하지 않을 때 가비지 콜렉터에 의해 해제되어 가용 메모리 풀에 반환된다. 호이스팅은 스코프 단위로 동작한다. 호이스팅은 변수 선언이 스코프의 선두로 끌어 올려진 것처럼 동작하는 자바스크립트 고유의 특징을 말한다. 전역 변수의 문제점 전역변수를 사용하게 되면 모든 코드가 전역 변수를 참조하고 변경할 수 있는 암묵적 결합을 허용하는 것 전역변수는 생명 주기가 길다. => 메모리 리소스도 오랜 기간 소비한다. 스코프 체인 상의 종점에 존재한다. => 검색 속도가 가장 느리다. 그래서 변수의 스코프는 ..
-
모던 자바스크립트 딥 다이브 13장. 스코프Modern JavaScript Deep Dive 2022. 5. 1. 22:09
스코프 스코프는 식별자가 유효한 범위를 말한다. 프로그래밍 언어에서는 스코프(유효 범위)를 통해 식별자인 변수 이름의 충돌을 방지하여 같은 이름의 변수를 사용할 수 있게 한다. 전역스코프 / 지역스코프 스코프 체인은 실행 컨텍스트의 렉시컬 환경을 단방향으로 연결한 것이다. 상위 스코프에서 유효한 변수는 하위 스코프에서 자유롭게 참조할 수 있지만 하위 스코프에서 유효한 변수를 상위 스코프에서 참조할 수는 없다. 렉시컬 스코프 자바스크립트는 렉시컬 스코프를 따르므로 함수를 어디서 호출했는지가 아니라 함수를 어디서 정의했는지에 따라 상위 스코프를 결정한다. 함수가 호출된 위치는 상위 스코프 결정에 어떠한 영향도 주지 않는다.
-
모던 자바스크립트 딥 다이브 12장. 함수Modern JavaScript Deep Dive 2022. 4. 30. 21:08
함수란? 함수는 일련의 과정을 문으로 구현하고 코드 블록으로 감싸서 하나의 실행 단위로 정의하는 것 함수는 코드의 재사용 측면에서 유용하다. -> 유지보수의 편의성을 높인다. -> 코드의 신뢰성을 높인다. 함수를 정의하는 방식 함수 선언문 함수 표현식 Function 생성자 함수 화살표 함수 자바스크립트 함수는 일급 객체다. 일급 객체라는 것은 함수를 값처럼 자유롭게 사용할 수 있다는 의미다. 함수 생성 시점과 함수 호이스팅 함수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 자바스크립트 고유의 특징을 함수 호이스팅이라고 한다. vs 함수 표현식으로 함수를 정의하면 함수 호이스팅이 발생하는 것이 아니라 변수 호이스팅이 발생한다. 화살표 함수 화살표 함수는 생성자 함수로 사용할 수 없으며, 기존 함수..
-
모던 자바스크립트 딥 다이브 11장. 원시 값과 객체의 비교Modern JavaScript Deep Dive 2022. 4. 23. 18:26
원시 값 원시값은 변경 불가능한 값이다. 읽기 전용. 변수 값을 변경할 수 없다는 말과는 다르다. 변수는 재할당을 통해 값을 변경할 수 있다. 변수 값을 변경하기 위해 원시 값을 재할당하면 새로운 메모리 공간을 확보하고 재할당한 값을 저장한 후, 변수가 참조하던 메모리 공간의 주소를 변경한다. 값에 의한 전달 변수에 원시 값을 갖는 변수를 할당하면 할당받는 변수에는 할당되는 변수의 원시 값이 복사되어 전달되는 것 (이 때 다른 메모리 공간에 저장된 별개의 값이라는 것에 주목) 객체 객체는 원시값과 다른 방식으로 동작한다. 객체는 참조 타입의 값으로서 객체는 변경 가능한 값이다. -> 여러 개의 식별자가 하나의 객체를 공유할 수 있다.
-
모던 자바스크립트 딥 다이브 10장. 객체 리터럴Modern JavaScript Deep Dive 2022. 4. 22. 18:21
원시 타입의 값은 변경 불가능한 값(immutable)이지만, 참조 타입의 값은 변경가능한(mutable) 값이다. 객체는 0개 이상의 프로퍼티로 구성된 집합이며, 프로퍼티는 키와 값으로 구성된다. 자바스크립트에서 사용할 수 있는 모든 값은 프로퍼티값이 될 수 있다. 함수도 마찬가지다. 프로퍼티 값이 함수일 경우 이것을 메서드 라고 한다. 객체 리터럴에 의한 객체 생성 클래스는 템플릿 / 인스턴스는 실체 객체 리터럴은 객체를 생성하기 위한 표기법 ex. let obj = {}
-
모던 자바스크립트 딥 다이브 9장. 타입 변환과 단축 평가Modern JavaScript Deep Dive 2022. 4. 19. 18:18
타입 변환 개발자가 의도적으로 값의 타입을 변환하는 것을 명시적 타입 변환 / 타입 캐스팅 이라고 한다. 개발자의 의도와는 상관없이 표현식을 평가하는 도중에 자바스크립트 엔진에 의해 암묵적으로 타입이 자동변환 되기도 한다. 이것을 암묵적 타입 변환 / 타입 강제 변환이라고 한다. 단축 평가 단축 평가는 표현식을 평가하는 도중에 평가 결과가 확정된 경우 나머지 평가 과정을 생략하는 것 논리 연산자를 사용한 단축 평가 (&& / ||) true || anything => true false || anything => anything true && anything => anything false && anything => false 옵셔널 체이닝 연산자 : && null 병합 연산자 : ??
-
모던 자바스크립트 딥 다이브 8장. 제어문Modern JavaScript Deep Dive 2022. 4. 18. 17:16
제어문은 조건에 따라 코드 블록을 실행하거나 반복 실행할 때 사용한다. 블록문 조건문 if else 문 / switch 문 반복문 조건식의 평가 결과가 참인 경우 코드 블록을 실행 for 문 / while 문 / do … while문 break문 레이블문, 반복문, switch문의 코드 블록을 탈출 continue문 반복문의 코드 블록 실행을 현 시점에서 중단하고 반복문의 증감식으로 실행 흐름을 이동 (break 처럼 반복문을 탈출하지는 않음)
-
모던 자바스크립트 딥 다이브 7장. 연산자Modern JavaScript Deep Dive 2022. 4. 17. 18:26
산술 연산자 피연산자를 대상으로 수학적 계산을 수행 할당 연산자 우항에 있는 피연산자의 평가 결과를 좌항에 있는 변수에 할당한다. 비교 연산자 == (동등 비교 : 값만 비교) / === (일치 비교 : 값과 타입을 비교) 삼항 조건 연산자 조건식 ? 조건식이 true 일 때 반환할 값 : 조건식이 false 일 때 반환할 값 논리 연산자 !(NOT) ||(OR) &&(AND) 쉼표 연산자, 그룹 연산자 () 우선순위 조절 typeof 연산자 피연산자의 데이터 타입을 문자열로 반환 지수 연산자 2 ** 3 는 2의 3제곱