chpater 4
4.1 변수란?
하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름(값의 위치를 가리키는 상징적인 이름)
- 저장된 값을 식별할 수 있는 고유한 이름 = 변수이름
- 그 변수에 저장된 값 = 변수 값
- 변수에 값을 저장하는 = 할당
- 변수에 저장된 값을 읽어 들이는 = 참조
4.2 식별자(=변수이름)
- 식별자는 어떤 값을 구별해서 식별할 수 있는 고유한 이름이다.
- 식별자는 값이 아니라 메모리 주소를 가지고 있다.
- 변수, 함수, 클래스 등의 이름과 같은 식별자는 선언에 의해 자바스크립트 엔진에 존재를 알린다.
4.3 변수 선언
- var, let, const를 사용하여 변수를 선언한다.
- 변수 사용을 위해서느 반드시 선언이 필요하다.
- 자바스크립트에서 변수 선언은 선언 → 초기화 단계를 거쳐 수행된다.
- keyword : 자바스크립트 코드를 해석하고 실행하는 자바스크립트 엔진이 수행할 동작을 규정한 일종의 명령어
변수를 포함한 모든 식별자(함수, 클래스)를 사용하려면 선언이 필요하며 선언하지 않은 식별자에 접근하면 ReferenceError(참조 에러)가 발생한다.
ReferenceError(참조 에러) = 식별자를 통해 값으 참조하려 했지만 자바스크립트 엔진이 등록된 식별자를 찾을 수 없을 때 발생하는 에러
4.4 변수 선언의 실행 시점과 변수 호이스팅
console.log(score); 👉 undefined var score; 👉 변수 선언문
자바스크립트 코드는 한 줄씩 순차적으로 실행되므로 console.log(score);가 실행되는 시점에는 아직 score변수 선언이 실행되지 않았으므로 undefined가 출력된다.
❗️ 그런데 참조에러가 아닌 undefinde가 출력되는 이유는 뭘까?
🤓 변수 선언이 소스코드가 한 줄씩 순차적을 실행되는 시점(런타임)이 아니라 그 이전 단계에서 먼저 실행되기 때문이다.즉, 자바스크립트 엔진은 변수 선언이 소스코드의 어디에 있든 상관없이 다른 코드보다 먼저 실행한다.
따라서 변수 선언이 소스코드 어디 위치하는지 상관 없이 어디서든 변수를 참조할 수 있다.
변수 호이스팅 : 변수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 자바스크립트 고유의 특징
4.5 값의 할당
- 변수 선언은 소스코드가 순차적으로 실행되는 시점인 런타임 이전에 먼저 실행되지만 값의 할당은 소스코드가 순차적으로 실행되는 시점인 런타임에 실행된다.
❗️아래 예제의 실행결과는 무엇일까?
console.log(score); 👉 undefined score = 80; 👉 값의 할당 var score; 👉 변수 선언 console.log(score); 👉 ??????
✍️ 내가 생각한 결과 : 80이라는 값이 출력될 것 같다. why? 선언은 런타임 이전에 먼저 실행되어 런타임에 실행되는 할당보다 먼저 실행되기 때문에 값이 나올 것 같다.
4.6 값의 재할당
- var 키워드로 선언한 변수는 값을 재할당할 수 있다.
- let 키워드는 변수의 재할당은 가능하지면 중복으로 변수 선언이 불가능하다.
- const 키워드는 재선언, 재할당 모두 불가능하다.
🤔 const가 let과 다른 점이 있다면, 반드시 선언과 초기화가 동시에 진행되어야 한다.
4.7 식별자 네이밍 규칙
- 식별자는 특수문자를 제외한 문자, 숫자, 언더스코어, 달러기호를 포함할 수 있다.
- 단, 식별자는 특수문자를 제외한 문자, 숫자, 언더스코어, 달러기호로 시작해야하며 숫자로 시작하는 것은 허용하지 않는다.
- 예약어는 식별자로 사용할 수 없다.
예약어
예시 >
var first-name; 👉 '-' 하이픈 사용 ⓧ var 1st; 👉 숫자로 시작 ⓧ var this; 👉 예약어 사용 ⓧ
chapter 5
5.1 값
- 값은 표현식이 평가되어 생성되는 결과를 말한다.
5.2 리터럴
- 리터럴은 사람이 이해할 수 있는 문자(아라비아 숫자, 알파벳, 한글 등) 또는 약속된 기호('', "", {}, [], // 등)를 사용해 값을 생성하는 표기법을 말한다.
리터럴의 종류 👉 정수, 문자열, 불리언, null, undefined, 객체, 배열, 함수, 정규 표현식, 부동소수점, 2진수, 8진수, 16진수
5.3 표현식
- 표현식은 값으로 평가될 수 있는 문이다. 즉, 표현식이 평가되면 새로운 값을 생성하거나 기존 값을 참조한다.
- 값을 평가될 수 있는 문은 모두 표현식이다.
👉 리터럴 표현식 10 'HELLO' 👉 식별자 표현식(선언이 이미 존재한다고 가정) sum person.name arr[1] 👉 연산자 표현식 10 + 20 sum = 10 sum !== 10 👉 함수/메서드 호출 표현식(선언이 이미 존재한다고 가정) square() person.getName()
5.4 문
- 프로그램을 구성하는 기본 단위이자 최소 실행 단위
- 문은 선언문(변수 선언문, 함수 선언문), 할당문, 조건문, 반복문 등으로 구분할 수 있다.
- 문은 여러 토큰으로 구성되며 토큰이란 문법적 의미를 가지며, 문법적으 더 이상 나눌 수 없는 코드의 기본 요소를 말한다.
예 👉 키워드, 식별자, 연산자, 리터럴, 세미콜론, 마침표 등
5.6 표현식인 문과 표현식이 아닌 문
표현식인 문과 표현식이 아닌 문을 구별하는 가장 간단하고 명료한 방법은 변수에 할당해 보는 것이다.
var foo = var x; 👉 표현식이 아닌 문은 값처럼 사용ⓧ var x; 👉 변수 선언문은 표현식이 아닌 문이다. x = 100; 👉 할당문은 그 자체 표현식이지만 완전한 문이기도 하다. 즉 할당문은 표현식인 문이다. 🙆♀️
chapter 6
데이터타입
원시타입 : 숫자, 문자열, 불리언, undefined, null, symbol
객체타임 : 함수, 배열, 객체 등
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>`;
👇 출력 결과
<ul> <li><a href = "#">Home</a></li> </ul>
6.3.2 표현식 삽입
var first = 'sujeong';
var last = 'Lee';
console.log('My name is' + first + '' + last +'.'); 👉 ES5 문자열 연결
👇
var first = 'sujeong';
var last = 'Lee';
console.log(`My name is ${first} ${last}.`}; 👉ES6 문자열 연결
6.7 심벌 타입
- 심벌 값은 다른 값과 중복되지 않는 유일무이한 값이다. 따라서 주로 이름이 충돌할 위험이 없는 객체의 유일한 프로퍼 키를 만들기 위해 사용한다.
- 심벌 이외의 원시 값은 리터럴을 통해 생성하지만 심벌의 값은 함수를 통해 생성한다.
var key = Symbol('key'); 👉 심벌 값 생성
var obj; 👉 객체 생성
obj[key] = 'value'; 👉 이름이 충돌할 위험이 없는 유일무이한 값인 심벌의 프로퍼티 키를 사용한다.
console.log(obj[key]);
6.8 객체 타입
- 자바스크립트를 이루는 모든 것이 객체이다.
6.9 데이터 타입의 필요성
- 값으 저장할 때 확보해야하는 메모리 공간의 크기를 결정하기 위해
- 값을 참조할 때 한 번 읽어 들어야 할 메모리 공간의 크기를 결정하기 위해
- 메모리에서 읽어 들인 2진수를 어떻게 해설할지 결정하기 위헤
6.10 동적 타이핑
- 자바스크립트의 변수는 선언이 아닌 할당에 의해 타입이 결정된다. 그리고 재할당에 의해 변수의 타입은 언제든지 동적으로 변할 수 있다.
❗️마무리
표현식, 값, 문, 데이터 타입, 리터럴 등 물어 봤을때 설명 가능할 수 있게 공부하자. 정확한 개념을 모르게 사용했던 자바스크립트 구조에 대해 알게 되었고 템플릿 리터럴, 심벌 타입 등 낯선 내용도 배웠다.
스터디에서 아직 헷갈리는 표현식과 문에 대해 더 자세히 공부해야겠다.🧐
