일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
- 스프레드 문법
- js
- 개발 환경 구축
- 비동기 프로그래밍
- Ref로 값 참조하기
- Escape Hatches
- 제너레이터
- rest api
- Deep Dive
- 표현식과 문
- DEEPDIVE
- 브라우저의 렌더링 과정
- Ref로 DOM 다루기
- async
- 모듈
- BETA
- 프로미스
- 코어JS
- ES6 함수의 추가 기능
- REACT
- 클로저
- 이터러블
- await
- 배열
- Strict Mode
- 싸피
- 에러 처리
- 디스트럭처링 할당
- 데이터 타입
- Set과 Map
- Today
- Total
코딩을 쉽게 해보자
[코어 자바스크립트] 정리 본문
Deep Dive를 각 장마다 나눠서 게시글을 올렸었는데, 나중에 다시 읽으려고 보니 너무 분산돼있는 것 같고
주니어 개발자로서 반복해서 보기에 minor한 내용들이 많았던 것 같아 이제부터는 필요한 내용만 적어두려고 한다.
그래서 이 책은 한 게시글에 몰아서 작성하려고 한다.(200pg밖에 안됨)
정재남의 코어 자바스크립트는 게시글을 작성하기 전에 미리 다 읽었는데,
Deep Dive가 백과사전이라면 코어 JS는 허들이 있는 JS의 핵심 개념을 이해하기 쉽게 잘 설명하는 책이다.
목차
- 데이터 타입
- 실행 컨텍스트
- this
- 콜백 함수
- 클로저
- 프로토타입
- 클래스
1. 데이터 타입
데이터 타입의 종류
원시형: number, string, boolean, null, undefined, Symbol
참조형: object의 하위 분류로 Array, Function, Date, RegExp, Map...
구분 기준
기본형: 값이 담긴 주솟값을 바로 복제
참조형: 값이 담긴 주솟값들로 이루어진 묶음을 가리키는 주솟값을 복제
기본형은 불변성을 띈다.
데이터 타입에 관한 배경 지식
식별자와 변수
변수: 변할 수 있는 수 -> 변할 수 있는 무언가(데이터)
식별자: 어떤 데이터를 식별하는 데 사용하는 이름(변수 명)
변수 선언과 데이터 할당
변수 선언
변경 가능한 데이터가 담길 수 있는 공간 또는 그릇이라고 생각할 수 있겠다.
var a;
데이터 할당
var a; // 변수 a 선언
a = 'abc'; // 변수 a에 데잍 ㅓ할당
var a = 'abc'; // 변수 선언과 할당을 한 문장으로 표현
- 변수 영역에서 빈 공간(@1003)을 확보한다.
- 확보한 공간의 식별자를 a로 지정한다.
- 데이터 영역의 빈 공간(@5004)에 문자열 'abc'를 저장한다.
- 변수 영역에서 a라는 식별자를 검색한다(@1003).
- 앞서 저장한 문자열의 주소(@5004)를 @1003의 공간에 대입한다.
기본형 데이터와 참조형 데이터
불변값
변수와 상수를 구분 짓는 변경 가능성의 대상은 변수 영역 메모리
- 한 번 데이터 할당이 이뤄진 변수 공간에 다른 데이터를 재할당할 수 있는지 여부
불변성 여부를 구분할 때의 변경 가능성의 대상은 데이터 영역 메모리
가변값
기본형 데이터가 불변값이면 참조형 데이터는 모두 가변값일 것 같은 느낌이 드는데,
기본적인 성질은 가변값인 경우가 많지만 설정에 따라 불가능한 경우도 있고 불변값으로 활용하는 방안도 있다.
참조형 데이터 변수를 할당하는 과정을 보면
var obj1 = {
a: 1,
b: 'bbb'
};
- 컴퓨터는 우선 변수 영역의 빈 공간(@1002)을 확보하고, 그 주소의 이름을 obj1로 지정
- 임의의 데이터 저장 공간(@5001)에 데이터를 저장하려고 보니 여러 개의 프로퍼티로 이뤄진 데이터 그룹입니다. 이 그룹 내부의 프로퍼티들을 저장하기 위해 별도의 변수 영역을 마련하고, 그 영역의 주소(@7103 ~ ?)를 @5001에 저장합니다.
- @7103 및 @7104에 각각 a와 b라는 프로퍼티 이름을 지정합니다.
- 데이터 영역에서 숫자 1을 검색합니다. 검색 결과가 없으므로 임의로 @5003에 저장하고, 이 주소를 @7103에 저장합니다. 문자열 'bbb' 역시 임의로 @5004에 저장하고, 이 주소를 @7104에 저장합니다.
불변 객체
얕은 복사는 바로 아래 단계의 값만 복사하는 방법
깊은 복사는 내부의 모든 값들을 하나하나 찾아서 전부 복사하는 방법
1. 실행 컨텍스트
계속 작성중!
'JavaScript' 카테고리의 다른 글
[Deep Dive] 49장 - Babel과 Webpack을 이용한 ES6+/ES.NEXT 개발 환경 구축 (0) | 2023.02.07 |
---|---|
[Deep Dive] 48장 - 모듈 (0) | 2023.02.06 |
[Deep Dive] 47장 - 에러 처리 (0) | 2023.02.05 |
[Deep Dive] 46장 - 제너레이터와 async / await (0) | 2023.02.01 |
[Deep Dive] 45장 - 프로미스 (0) | 2023.01.31 |