모던 자바스크립트 DeepDive 공부 내용 2차

이번 정리 목차는 4장 ~ 8장이다.

 

4장 변수

변수: 하나의 값을 저장하기 위해 확보한 메모리 공간 또는 그 메모리 공간을 식별하기 위해 붙인 이름

 

여러 개의 값 지정 방법: 변수를 여러 개 사용하거나 배열, 객체 사용

 

변수 이름: 메모리 공간에 저장된 값을 식별할 수 있는 고유한 이름(식별자)

 

변수 값: 변수에 저장된 값

 

할당: 변수의 값 저장

 

참조: 변수에 저장된 값을 읽어 들이는 것

 

변수 선언: 변수 생성, var, let, const 키워드 사용

-> var는 함수레벨 스코프 지원

-> var는 선언단계와 초기화 단계 동시 진행

 

키워드: 자바스크립트 엔진이 수행할 동작을 규정한 일종의 명령어

 

변수 선언을 자바스크립트 엔진은 2단계 거침

-> 선언 단계: 변수 이름을 등록하여 변수의 존재를 알림

-> 초기화 단계: 메모리 공간을 확보하고 암묵적으로 undefined 할당하여 초기화

 

변수 이름은 실행 컨텍스트에 등록

실행 컨텍스트: 코드의 실행 결과를 실제로 관리하는 영역(식별자와 스코프 관리)

 

변수 선언은 런타임 이전 단계에서 먼저 실행

 

호이스팅: 변수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 JS특징

 

변수에 값 할당: = 연산자 사용하여 할당(우->좌)

->  선언과 할당을 하나의 문으로 단축표현 하여도 엔진은 2개의 문으로 각각 나누어 실행

->  선언은 런타임 이전, 할당은 런타임에 실행

->  이전 저장된 메모리 공간을 지우고 새롭게 저장하는 게 아닌 새로운 메모리 공간을 확보 하고 그곳에 저장

 

변수 값 재할당: 이미 값이 할당되어 있는 변수에 다시 할당하는 것

->  값을 재할당할 수 없다면 상수(한번 정해지면 변하지 않는 값)라 함

 

가비지 콜렉터: 메모리 공간을 주기적으로 검사하여 더 이상 사용되지 않는 메모리 해제하는 기능

 

식별자 네이밍 규칙

->  특수 문자 제외한 문자, 숫자, 언더바, 달러기호 포함 가능

->  숫자 시작 허용 X

->  예약어(프로그래밍언어에서 사용되고 있거나 사용될 예정인 단어) 사용 X

->  변수나 함수이름은 카멜케이스, 생성자 함수나 클래스 이름은 파스칼 케이스 사용

 

5장 표현식과 문

값: 표현식이 평가되어 생성된 결과

 

리터럴: 사람이 이해할 수 있는 문자 또는 약속된 기호를 사용해 값을 생성하는 표기법

 

표현식: 값으로 평가가 될 수 있는 문, 표현식이 평가되면 새로운 값을 생성하거나 기존 값을 참조

 

문: 프로그램을 구성하는 기본 단위이자 최소 실행 단위, 여러 토큰(더 이상 나눌 수 없는 코드의기본 요소)으로 구성, 명령문이라고도 함

->  선언문, 할당문, 조건문, 반복문 구분

 

표현식인 문과 아닌 문은 변수에 할당해 보면 구별 가능

 

6장 데이터 타입

데이터 타입

->  값의 종류

->  모든 값은 데이터 타입을 갖는다

->  7개의 데이터 타입 제공

-> 원시타입과 객체 타입으로 분류

->  원시 타입: number, string, boolean, undefined, null, symbol

->  객체 타입: array, object, function

 

숫자 타입

->  배정밀도 64비트 부동소수점 형식을 따름

->  모든 수를 실수로 처리

->  값을 참조하면 모두 10진수 해석

->  Infinity, -Infinity, NaN 표현 가능

 

문자열 타입

->  텍스트 데이터를 나타내는데 사용

->  “”, ‘’, ``으로 텍스트를 감싼다.

->  따옴표로 감싸지 않으면 키워드나 식별자로 인식 또한 공백 불가

->  JS의 문자열은 원시 타입이며 변경 불가능 한 값임

 

템플릿 리터럴

->  ES6 도입, 백틱 사용

->  이스케이프 시퀀스 사용하지 않아도 줄 바꿈 및 개행 가능

 

표현식 삽입

->  문자열은 +연산자를 사용해 연결 가능

->  템플릿 리터럴에서는 ${}로 표현식 삽입 사용 가능

 

불리언 타입

->  True 와 false 뿐

->  조건문에서 자주 사용

 

undefined 타입

->  타입 값은 undefined가 유일

->  undefined는 JS엔진이 변수를 초기화 할 때 사용하는 값

->  변수에 값이 없음을 명시하고 싶으면 null 할당

 

null타입

->  타입 값은 null이 유일

->  변수에 값이 없다는 것을 의도적으로 명시

->  JS엔진은 가비지 콜렉션 수행

->  함수가 유효한 값을 반환할 수 없는 경우 명시적으로 null 반환 하기도 함

 

심벌 타입

->  ES6에서 추가된 7번째 타입

->  변경 불가능한 원시 타입의 값

->  중복되지 않는 유일무이한 값

->  객체의 유일한 프로퍼티 키를 만들기 위해 사용

->  Symbol 함수를 호출해 생성

 

객체 타입

->  JS는 객체 기반의 언어

->  JS를 이루고 있는 거의 모든 것이 객체

->  원시타입 6개(number, string, boolean, null, undefined, symbol) 외는 모두 객체 타입

 

데이터 타입 필요성

->  값을 저장할 때 확보해야 하는 메모리 공간 크기 결정 위해

->  값을 참조할 때 얼마만큼 읽어 들여야 할지 결정 위해

->  메모리에서 읽어 들인 2진수를 어떻게 해석할지 결정 위해

 

동적 타이핑

->  JS 변수는 선언이 아닌 할당에 의해 타입이 결정(타입 추론)

->  재할당에 의해 변수의 타입은 언제든지 동적으로 변함

->  JS는 동적타입 언어

 

7장 연산자

연산자: 하나 이상의 표현식을 대상으로 산술, 할당, 비교, 논리, 타입, 지수 연산등을 수행하여 하나의 값을 만든다.

 

피연산자: 연산의 대상, 값으로 평가될 수 있는 표현식이어야 함

 

산술연산자

->  피연산자를 대상으로 수학적 계산을 통해 새로운 숫자 값을 만들고 산술 연산 불가능 한 경우 NaN 반환

 

이항 산술 연산자

->  2개의 피연산자를 산술 연산하여 숫자 값을 만든다.

->  피연산자의 값을 변경하는 부수효과 없음

->  언제나 새로운 값을 만들 뿐임

->  + - * / %

 

단항 산술 연산자

->  1개의 피연산자를 산술 연산하여 숫자 값을 만든다.

->  ++, --는 부수효과 있음

->  + 및 –(양수 음수 변환)는 부수 효과 없음

 

문자열 연산자

->  + 연산자는 피연산자 중 하나 이상이 문자열인 경우 문자열 연결 연산자로 동작

->  1+true 하면 암묵적 타입 변환 되어 true가 1로 변환되어 연산 수행

 

할당 연산자

->  우항에 있는 피연산자의 평가 결과를 좌항에 변수에 할당

->  부수 효과 있음

->  =, +=, -=, *=, /=, %=

->  연쇄 할당: a=b=c=0 이면 c->b->a순으로 평가 됨

 

비교 연산자

->  좌항과 우항의 피연산자를 비교한 후 그 결과를 불리언 값으로 반환

->  동등 비교, 일치비교가 있는데 일치비교는 타입까지 비교 함

->  ==, ===, != , !==

->  동등 비교 연산자는 좌항과 우항 비교할 때 암묵적 타입 변환으로 타입을 일치 시킨 후 같은 값인지 비교

->  일치 비교에서는 NaN은 자신과 일치하지 않는 유일한 값

->  NaN인지 조사하려면 Number.isNaN 함수 사용

->  숫자 0도 양의 0과 음의 0 모두 true

->  object.is메서드 사용하면 양 과 음의 0 false나옴

 

대소 관계 비교 연산자

->  피연산자의 크기를 비교하여 불리언 값 반환

->  > < <= >=

 

삼항 조건 연산자

->  조선식의 평과 결과에 따라 반환할 값 결정

->  조건식 ? 조건식 true일 때 반환할 값 : 조건식이 false일 때 반환할 값

->  if…else로 처리 가능 하지만 차이점은 if…else는 문으로서 값처럼 사용할 수 없음

 

논리 연산자

->  우항과 좌항의 피연산자를 논리 연산 한다

->  ||, &&, !

->  ! 연산자는 언제나 불리언 값을 반환, 피연산자 불리언 값 아니면 암묵적 타입변환

->  || &&는 평가 결과는 불리언 값이 아닐 수도 있다.

 

쉼표 연산자

->  왼쪽부터 차례대로 피연산자 평가하고 마지막 피연산자의 평가 결과 반환

 

그룹 연산자

->  ()사용하여 피연산자를 감싼다.

->  우선순위 조절, 가장 높음

 

typeof연산자

->  피연산자의 데이터 타입을 문자열로 반환

->  null이 object로 반환되는 것은 버그지만 기존 코드에 영향을 줄 수 있기에 수정은 아직 되지 않음

->  null을 확인 할 때는 일치 연산자(===) 사용

->  선언하지 않은 식별자를 typeof하면 undefined 반환

 

지수 연산자

->  ES7에 도입됨

->  좌항의 피 연산자를 밑으로, 우항의 피 연산자를 지수로 거듭 제곱하여 숫자 반환

->  2**3 =>8

->  이전에는 Math.pow메서드 사용

->  결합 순서는 우항에서 좌항 => 2 ** (3**2) => 512

->  음수를 거듭제곱근 밑으로 사용하려면 ()로 묶어야함 (-5)**2

->  이항 연산자 중 우선순위 가장 높음

 

8장 제어문

제어문

->  조건에 따라 코드 블록을 실행하거나 반복할 때 사용

 

블록문

->  0개 이상의 문을 중괄호로 묶은 것

->  코드블록 또는 블록이라 함

->  JS는 블록문을 하나의 실행 단위로 취급

->  단독 사용할 수 있으나 일반적으로 제어문이나 함수 정의에 사용

-> 세미콜론은 붙이지 않음 자체 종결성을 갖기 때문

 

조건문

->  주어진 조건식의 평과 결과에 따라 코드 블록 실행을 한다.

-> 조건식은 불리언 값으로 평가될 수 있는 표현식

->  if…else문과 switch문 있음

 

if…else문

->  조건식 평가 결과가 true면 if문 실행

->  조건식 평가 결과가 false면 else문 실행

->  조건을 늘리고 싶으면 else if문 사용

->  대부분 if…else문은 삼항 조건 연산자로 바꾸기 가능

->  논리적 참, 거짓으로 실행할 코드 블록을 결정

 

switch문

->  주어진 표현식 평가하여 그 값과 일치하는 표현식을 갖는 case문으로 실행

-> 일치하는 case문이 없다면 default문 이동

->  default문은 선택사항

->  switch문은 논리적 참, 거짓보다 다양한 case에 따라 실행할 코드 블록 결정시 사용

->  break문 사용하지 않으면 폴스루 발생

 

반복문

->  조건식의 평가 결과가 참인 경우 조건식이 거짓이 될 때까지 코드블록 실행 반복

->  for문, while문, do…while문 제공

 

for문

->  조건식이 거짓으로 평가될 때까지 코드 블록 반복 실행

->  for(변수 할당문; 조건식; 증감식){조건식이 참인 경우 반복될 실행 문}

->  어떤 식도 선언하지 않으면 무한루프가 됨=>for(;;){}

->  중첩 for문 가능

 

while문

->  주어진 조건식의 평가 결과가 참이면 반복 실행

-> 반복 횟수가 불명확할 때 주로 사용

->  while(조건식){반복될 실행 문}

-> 조건식 결과가 언제나 참이면 무한루프

 

do…while문

->  코드 블록을 먼저 실행하고 조건식 평가

->  무조건 한 번은 실행됨

 

break문

->  레이블 문, 반복문 코드 블록을 탈출

->  레이블 문은 식별자가 붙은 문을 말한다.

 

continue문

-> 반복문의 코드 블록 실행을 현 지점에서 중단하고 증감식으로 실행 흐름 이동

-> 반복문을 탈출하지 않음