TIL - 모던 자바스크립트 Deep Dive

easy!·2022년 2월 10일
0

chpater5 표현식과 문

5.1 값

  • 값: 식(표현식expression)이 평가evaluate되어 생성된 결과를 말한다.

5.2 리터럴

  • 리터럴은 사람이 이해할 수 있는 문자(아라비아 숫자, 알파벳, 한글 등) 또는 약속된 기호('', "", ., [], {}, // 등)로 표기한 코드다.

5.3 표현식

  • 표현식은 값으로 평가될 수 있는 문(statement)이다. 즉, 표현식이 평가되면 새로운 값을 생성하거나 기존 값을 참조한다.
  • 값으로 평가되므로 리터럴은 표현식이다.
  • 즉, 값으로 평가될 수 있는 문은 모두 표현식이다.

5.4 문

  • 문(statement)은 프로그램을 구성하는 기본 단위이자 최소 실행 단위다.
  • 토큰(tocken)이란 문법적인 의미를 가지며, 문법적으로 더 이상 나눌 수 없는 코드의 기본 요소를 의미한다.
// 변수 선언문
var x;

// 표현식 문(할당문)
x = 5;

// 함수 선언문
function foo () {}

// 조건문
if (x > 1) { console.log(x); }

// 반복문
for (var i = 0; i < 2; i++) { console.log(i); }

5.6 표현식인 문과 표현식이 아닌 문

  • 표현식인 문과 표현식이 아닌 문을 구별하는 가장 간단하고 명료한 방법은 변수에 할당해 보는 것이다.
// 변수 선언문은 표현식이 아닌 문이다.
var x;

// 할당문은 그 자체가 표현식이지만 완전한 문이기도 하다. 즉, 할당문은 표현식인 문이다.
x = 100;

// 표현식인 문은 값처럼 사용할 수 있다
var foo = x = 100;
console.log(foo); // 100

chpater6 데이터 타입

  • 원시타입 : 숫자, 문자열, 불리언, undefined, null, symbol
  • 객체타임 : 객체, 함수, 배열 등

6.1 숫자 타입

// 모두 숫자 타입이다.
var integer = 10;    // 정수
var double = 10.12;  // 실수
var negative = -20;  // 음의 정수

6.2 문자열 타입

// 문자열 타입
var string;
string = '문자열'; // 작은따옴표
string = "문자열"; // 큰따옴표
string = `문자열`; // 백틱 (ES6)

string = '작은따옴표로 감싼 문자열 내의 "큰따옴표"는 문자열로 인식된다.';
string = "큰따옴표로 감싼 문자열 내의 '작은따옴표'는 문자열로 인식된다.";

6.3 템플릿 리터럴

  • ES6부터 도입된 새로운 문자여 표기법이다.
  • 작은 따옴표 또는 큰 따옴표 같은 일반적인 따옴표 대신 백틱(``) 을 사용해 표현한다.

6.3.1 멀티라인 문자열

  • 일반 문자열 내에서는 줄바꿈이 허용되지 않는다.

\' 따옴표 single quote
\" 쌍따옴표 double quote
\ 역슬래시 single backslash
\b 백스페이스 backspace
\r 캐리지 리턴 carriage return
\n 줄바꿈 newline
\s 스페이스 space
\t 수평탭 tab
\v 수직탭 tab
\f 폼피드 form feed
\0 null

var template = '<ul>\n\t<li><a href="#">Home</a></li>\n</ul>';

console.log(template);

🔻 출력 결과
/*
<ul>
  <li><a href="#">Home</a></li>
</ul>
*/

6.3.2 표현식 삽입

var first = 'Jihee';
var last = 'Lee';

console.log('My name is' + first + '' + last +'.'); 👉 ES5 문자열 연결
console.log(`My name is ${first} ${last}.`}; 👉ES6 문자열 연결

6.5 undefined 타입

  • 값 할당 전의 가지는 초기값
    👉의도적으로 undefined를 할당하는 것은 취지에 어긋나기 때문에 그럴 때는 null을 사용

6.7 심벌 타입

  • 변경 불가능한 원시 타입의 값
  • 심벌 값은 다른 값과 중복되지 않는 유일무이한 값이다. 따라서 주로 이름이 충돌할 위험이 없는 객체의 유일한 프로퍼티 키를 만들기 위해 사용한다.

6.8 객체 타입

  • 자바스크립트를 이루고 있는 거의 모든 것이 객체다.

6.9 데이터 타입의 필요성

  • 값을 저장할 때 확보해야하는 메모리 공간의 크기를 결정하기 위해
  • 값을 참조할 때 한 번 읽어 들어야 할 메모리 공간의 크기를 결정하기 위해
  • 메모리에서 읽어 들인 2진수를 어떻게 해석 할지 결정하기 위해

6.10 동적 타이핑

  • C나 JAVA같은 정적 타입 언어는 변수를 선언할 때 변수에 할당할 수 있는 값의 종류, 즉 데이터 타입을 사전에 선언해야한다.
  • 정적 타입 언어는 변수의 타입을 변경할수 없으며, 변수에 선언한 타입에 맞는 값만 할당할 수 있다.
  • 정적 타입 언어는 컴파일 시점에 타입 체크(선언한 데이터 타입에 맞는 값을 할당했는지 검사하는 처리)를 수행한다.
  • 자바스크립트는 정적 타입 언어와 다르게 변수를 선언할 때 타입을 선언하지 않는다. 다만 var, let, const 키워드를 사용해 변수를 선언할 뿐이다.

typeof연산자는 연산자 뒤에 위치한 피연산자의 데이터 타입을 문자열로 반환한다.

var foo;
console.log(typeof foo);  // undefined

foo = 3;
console.log(typeof foo);  // number

foo = 'Hello';
console.log(typeof foo);  // string

foo = true;
console.log(typeof foo);  // boolean

foo = null;
console.log(typeof foo);  // object -> 암기할 수 밖에 없음

foo = Symbol(); // 심벌
console.log(typeof foo);  // symbol

foo = {}; // 객체
console.log(typeof foo);  // object

foo = []; // 배열
console.log(typeof foo);  // object

foo = function () {}; // 함수
console.log(typeof foo);  // function

자바스크립트의 변수는 선언이 아닌 할당에 의해 타입이 결정된다. 그리고 재할당에 의해 변수의 타입은 언제든지 동적으로 변할 수 있다.
이러한 특징을 동적 타이핑이라고 하며,
자바스크립트를 정적 타입 언어와 구별하기 위해 동적 타입 언어라 한다.


chpater7 연산자

  • 연산자: 피연산자와의 조합으로 표현식을 만듦
    * 피연산자는 그 자체로도 표현식.
  • 산술 연산자 (Arithmetic operator): 수학적 계산을 통해 새 값 만듦
    Ex) +,-,,/,%, ++,--
profile
이름처럼 쉽게 개발 공부를 기록하자. 📝

0개의 댓글