[책] 모던 자바스크립트 Deep Dive---
[Goal]
For 좀 더 탄탄한 기본기를 위해서-.
ㄴ정확한 용어들로 기본개념, 동작 원리 숙지 하여,
=>기술적 의사소통, 머릿속에서 코드를 실행할 능력을 가지도록 한다.
[일정] 9/16월 – 9/23월 (일주일)
[회의] 9/24화 오후7시, 영등포구청역
[Study Chapter]
ㄴ 1장 프로그래밍
ㄴ 2장 자바스크립트란?
ㄴ 3장 자바스크립트 개발환경과 실행방법
ㄴ 4장 변수
ㄴ 5장 표현식과 문
아이패드 - 교보문고 어플.... 필기가 안되는건지 내가 기능을 못찾는건지.. 조금 불편하다. 나중에 찾아봐야지.
1장 프로그래밍
p.2 컴퓨터의 관점에서 문제를 사고하는 "Computational Thinking" 과 고려할 요소들.
p.3 사람과 컴퓨터 사이의 "번역기"역할의 "컴파일러"
2장 자바스크립트란?
p.9 Ajax"에이작스/아작스"
[암기팁]
기존의 (순차적인) 동기방식을 "아작내고" 작업들이 독립적을 실행되어(비동기적으로), 실행 속도를 획기적으로 줄인 "아작스, 에이작스 Ajax"
동기(Synchronous)
동기는 사전적으로 '동시에 일어난다'는 의미를 갖고 있습니다.
비동기(Asynchronous)
비동기는 사전적으로 '동시에 일어나지 않는다'는 의미를 갖고 있습니다.
프로그래밍에서 비동기는 작업이 독립적으로 실행되며,
작업의 완료 여부를 기다리지 않고 다른 작업을 실행할 수 있는 방식을 의미합니다.
(동기/비동기)
https://won-percent.tistory.com/150
p.11
Node. js 에 대한 이해more 블로그 : https://velog.io/@remon/%EA%B0%9C%EB%B0%9C-%EA%B8%B0%EB%B3%B8-%EC%A7%80%EC%8B%9D-Node.js%EB%9E%80
p.14 인터프리터 vs 컴파일러 언어
컴파일러는 약간 책으로 "번역"하는 느낌.
인터프린트는 즉시즉시 "동시통역"하는 느낌.
3장 자바스크립트 개발환경과 실행방법
3.4 비쥬얼 스튜디오 코드
- (단축key암기) 터미널 창 열기 : Ctril컨 + 1옆의`
① 콘솔에서 node로 사용해서 JS파일 실행하기
In 콘솔에서, node 파일명.js
콘솔에서의 결과화면
② 확장프로그램으로 JS파일 실행하기 - 확장프로그램:Code Runner
자바스크립트 파일 실행 단축키
(윈도우ver) - Ctrl+Alt+N
콘솔에서의 결과화면
---
cf p.33
Live Server 확장 프로그램 하는 역할? - 소스코드 수정할 때마다 수정사항 브라우저에 자동 반영.
[즉각적인 소스 자동저장기능] 으로 생각하면 될 것 같다.
4장 변수
4.1 변수란 무엇인가? 왜 필요한가?
메모리memory는 데이터를 저장할 수 있는 메모momory cell의 집합체이다.
메모리 셀 하나의 크기는 1바이트(8비트)이며, 컴퓨터는 메모리 셀으 크기, 즉 1바이트로 데이터를 저장write하거나 읽어read들인다.
각 셀은 고유의 메모리 주소memory address를 갖는다. 이 메모리 주소는 메모리 공간의 위치를 나타내며, 0부터 시작해서 메모리의 크기만큼 정수료 표현된다.
예를 들어, 4GB 메모리는 0부터 4,294,967,295(0x0000,0000 ~ 0xFFFF,FFFF) // <- 8자리 확인하려고 , 표기는 내맘대로 넣은 것.
변수variable는 하나의 값을 저장하기 위해 확보한 메모리 공간
자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름을 말한다. p.36
[tip] 변수에 여러 개의 값을 저장하는 방법 p.37
4.2 식별자
변수 이름 a.k.a식별자identifier라고도 한다.
ㄴ 식별자는 어떤 값을 구별해서 식별할 수 있는 고유한 이름을 말한다.
ㄴ ㄴ 마치, '사람'을 '이름'으로 구별해서 식별하는 것처럼, '값'도 '식별자'로 구별해서 식별할 수 있다.
~생략~
즉, 식별자는 값이 저장되어 있는 메모리 주소와 매핑 관계를 맺으며, 이 매핑 정보도 메모리에 저장되어야 한다.
4.3 변수 선언
변수선언variable desclaratio일나 변수를 생성하는 것을 말한다.
ㄴ 좀 더 자세히) 값을 저장하기 위한 메모리 공간을 확보allocate하고,
변수 이름과 확보된 메모리 공간의 주소를 연결name binding해서 값을 저장할 수 있게 준비하는 것이다.
ㄴ 변수를 사용하려면 반드시 선언이 필요하다. 변수를 선언할 때는 var, let, const키워드를 사용한다.
Q 변수 이름은 어디에 등록되는가?p.41
ㄴ 변수 이름을 비롯한 모든 식ㅂ졀자는 실행 컨텍스트에 등록된다.
실행 컨텍스트execution context는 자바스크립트 엔진이 소스코드르 평가하고 실행하기 위해 필요한 환경ㅇ르 제공하고 코드의 실행결과를 실제로 관리하는 영역이다.
=>(정리) 자바스크립트 엔진은, 실행 컨텍스트를 통해 식별자와 스코프를 관리한다.
4.4 변수 선언의 실행시점과 변수 호이스팅
변수 호이스팅variable hoisting: 변수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 자바스크립트의 고유특징
4.5 값의 할당
ㄴ변수에 값을 할당assignment(대입, 저장)할 때는 할당 연산자 =를 사용한다.
할당 연산자는 우변의 값을 좌변의 변수에 할당한다.
★주의할점p.43
`변수 선언`과 `값`의 `할당 시점`이 `다르다`.
ㄴ `변수 선언`은 코드가 순차적으로 실행되는 시점인 `런타임 이전`에 먼저 실행되지만,
ㄴ `값의 할당`은 소스코드가 순차적으로 실행되는 시점인 `런타임에` 실행된다.
4.6 값의 재할당
재할당이란 이미 값이 할당되어 있는 변수에 새로운 값을 또다시 할당하는 것을 말한다.
+ 재할당은 변수에 저장된 값을 다른 값으로 '변경'한다 => 그래서 '변수'라고 하는 것이다.
↔ 만약 값을 재할당할 수 없어서 변수에 저장된 `값을 변경할 수 없다`면, 변수가 아니라 상수constant라고한다.
ㄴ상수는 한번 정해지면 변하지 않는 값 =즉, 단 한 번만 할당할 수 있는 변수.
[값의 할당p.44 vs 값의 재할당p.46]
4.7 식별자 네이밍 규칙
식별자identifier는 어떤 값을 구별해서 식별해낼 수 있는 고유한 이름을 말한다.
5장 표현식과 문
5.1 값value은 식(표현식expression)이 평가evaluate되어 생성된 결과를 말한다.
평가란 : 식을 해석해서 값을 생성하거나 값을 참조하는 것을 의미한다.
변수란 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름이라고 했다. 따라서 변수에 할당되는 것은 값이다.
5.2 리터럴literal은 사람이 이해할 수 있는 문자 또는 약속된 기호를 사용해 값을 생성하는 표기법motation을 말한다.
ㄴ 음...이해가 좀 안되는 것 같다. 그냥 '사람이 파악 가능한 표기법'정도로만 생각해도 된는 건가?
5.3 표현식expression은 값으로 평가될 수 있는 문statement이다. 즉, 표현식이 평가되면 새로운 값을 생성하거나 기존 값을 참조한다.
+p.53 표현식은 리터럴, 식별자(변수, 함수 등의 이름), 연산자, 함수 호출 등의 조합으로 이뤄질 수 있다. ~생략~
즉, 값으로 평가될 수 있는 문은 모두 표현식이다.
5.4 문statement, 표현식expression이 구별
문statement : 프로그램을 구성하는 기본 단위이자 최소 실행단위다.
ㄴ 문의 집합으로 이루어진 = 프로그램
ㄴ 문을 작성하고 순서에 맞게 나열하는 = 프로그래밍
ㄴ 문은 여러 토큰으로 구성된다.
ㄴ 토큰token이란 문법적인 의미를 가지며, 문법적으로 더 이상 나눌 수 없는 코드의 기본 요소들을 의미.
5.6 표현식인 문과 표현식이 아닌 문
심플 구별법 : 변수에 할당해 보는 것.
ㄴ why? 표현식인 문은 값으로 평가되므로 변수 할당 가능
ㄴ But 표현식이 아닌 문은 값으로 평가할 수 없으므로, 변수에 할당하면 에러 발생.
아래 그림 비교 : [표현식이 아닌 문 vs 표현식 中 변수 선언문]
댓글