데이터 처리
- 변수, 형태, 함수, 실행
interaction
- 이벤트 심기(scroll, click)
새로 만들고, 유지보수한다.
- 코드를 잘 관리하는 방법
- 서비스 개발을 위하여 계획하기
Javascript 언어의 특징
- 변수의 타입
- 함수의 특징
- 상속의 형태
- 패러다임 지원
동적 타입 언어
- 변수에 들어가는 값에 따라서, 런타임에 타입이 추론된다.
일급 객체
- 함수는 일급객체의 특징을 가진다.
- 함수는 객체와 동일하게 사용할 수 있다.
- 함수는 값과 동일하게 취급한다.
- 변수 할당문
- 객체 프로퍼티 값
- 배열의 요소
- 함수 호출의 인수
- 함수 반환문
프로토타입 기반의 상속
- 언어가 갖고 있는 프로토타입 체이닝 구조를 통하여 상속 가능.
ECMAScript 2015+
polyfill과 babel사용
polyfill
- 지원하지 않는 브라우저에서 최신 기능을 제공하기 위해 필요한 코드
- 폴리필은 브라우저가 다른 방식으로 동일한 기능을 구현하는 문제를 해결하는데 사용.
Babel
- 이전 버전의 브라우저에서 ES6이전 버전의 JAVASCRIPT로 변환하는데 사용되는 도구
- 문법을 번역 및 변환
- 폴리필 가능.
변수 호이스팅 - 3단계를 거쳐 생성되는 변수
1. 선언 단계 : 변수를 변수 객체에 등록한다.
2. 초기화 단계 : 변수를 메모리에 할당하고, undefined로 초기화한다.
3. 할당 단계 : undefined로 초기화된 변수에 실제로 값을 할당한다.
var 키워드
코드 평가단계 : 선언과 동시에 초기화 진행
코드 실행단계 : 값 할당 진행
코드평가에서는
- 선언단계 : var test
- 초기화 단계 : test = undefined
- 할당 단계 : test = 1;
var 키워드 : 호이스팅 Hoisting
- 모든 선언문이 해당 scope의 선두로 옮겨진 것처럼 동작하는 특성
- 함수 호이스팅, 변수 호이스팅
즉, 쉽게 말해. console.log(a)를 먼저 쓰고
밑에서 var a = 1을 해도 선언과 초기화 단계가 이뤄어져서 undefined값이 나오게 됨.
var 키워드 단점
-
키워드의 생략 가능 (var a =1; 안하고 그냥 a =1; 하면 앞에 var가 붙은걸로 이해함.
-
중복 선언 가능
-
변수 호이스팅
const는
console.log(a);
const a = 1;이렇게 하면 레퍼런스 오류가 뜸.
const로 변수를 지정하면 선언까지만 하고,
실행이 될때, 초기화와 할당을 해주는 방식임.
정리해서 보면
console.log(a);
try {
console.log(b);
console.log(c);
} catch{};
var a = 1;
const b = 2;
let c;
a는 평가단계에서 초기화가 되기때문에 초반에 undefined로 정의가 되고 할당문을 거쳐서 최종적으로 a에 1이 할당이 되었고,
b 경우 코드 평가 단계에서 코드 초기화가 진행되지 않았기 때문에 선언 전에 참조를 할 경우 레퍼런스 오류를 뱉는다.
그리고 b 선언문에 와서 b에 할당을 해주니 2라는 값이 할당된 것을 알 수 있었습니다.
c에 경우는 할당문이 없기 때문에 초기화가 해서 undefined가 나옴.
Reference Type
객체 타입 - mutable
변경 가능한 값(mutable) : 객체의 속성을 변경, 추가, 삭제 가능
- 원시값 : immutable한 값
힙 메모리에 저장
- 동적으로 변화 가능하므로, 메모리 공간 확보 및 저장
pass-by-reference - 참조 타입이므로, 참조값으로 처리
일급 객체
일급객체란, 다른 객체들에 일반적으로 적용 가능한 연산을 모두 지원하는 객체를 가리킨다.
- 일급 객체는 함수의 실제 매개변수가 될 수 있다.
- 일급 객체는 할당명령문의 대상이 될 수 있다.(변수 등에 할당 가능)
- 일급 객체는 할당명령문의 대상이 될 수 있다. (변수 등에 할당 가능)
- 일급 객체는 동일비교의 대상이 될 수 있다.(값으로 표현 가능)
