원시 자료형: 고정된 저장 공간 차지 ex) number, string, boolean
- 변수에 할당하면 메모리 공간에 값 자체가 저장됨
- 원시 값을 갖는 변수를 다른 변수에 할당하면 원시 값 자체가 복사되어 전달됨
- 원시 자료형은 변경 불가능한 값. 한 번 생성된 원시 자료형은 읽기 전용
참조 자료형: 대량의 데이터를 다루기에 적합한 배열과 객체 등의 자료형
- 변수에 할당하면 메모리 공간에 주소값 저장
- 참조 값을 갖는 변수를 다른 변수에 할당하면 주소값이 복사되어 전달됨
- 참조 자료형은 변경 가능한 값
힙(heap): 참조 자료형을 저장하는 특별한 저장 공간
복사
원시 자료형 복사: 값 복사
참조 자료형 복사: 주소 복사
얕은 복사
배열 복사
- arr.slice();: 원본 배열 복사, 다른 주소
- [...arr]; (spread 문법): 원본 배열 복사, 다른 주소
객체 복사
- Object.assign()
- {...obj}
참조 자료형 내부에 참조 자료형이 중첩된 구조는 복사할 수 없음
깊은 복사
- JSON.parse(JSON.stringify(arr));
- require('lodash').cloneDeep(arr); (외부 라이브러리 사용)
스코프
스코프: 변수 접근 규칙에 따른 유효 범위
스코프 규칙
- 안쪽 스코프에서 바깥쪽 스코프로는 접근할 수 있지만 반대는 불가능
- 중첩 가능
- 전역 스코프(가장 바깥 스코프) <-> 지역 스코프
- 지역변수가 높은 우선순위
스코프 종류
- 블록 스코프(block scope):
중괄호 기준 - 함수 스코프(function scope): 함수 선언식 및 함수표현식
let, const, var 비교
클로저
클로저 함수: 외부 함수의 변수에 접근할 수 있는 내부 함수
클로저가 중요한 이유: 클로저의 함수는 어디에서 호출되느냐와 무관하게 선언된 함수 주변 환경에 따라 접근할 수 있는 변수가 정해지기 때문
클로저 활용
- 데이터를 보존하는 함수
- 커링: 여러 전달인자를 가진 함수를 함수를 연속적으로 리턴하는 함수로 변경하는 행위 / 함수의 일부만 호출하거나, 일부 프로세스가 완료된 상태를 저장
- 모듈 패턴: 특정 데이터를 다른 코드의 실행으로부터 보호
ES6
spread/rest 문법
- spread 문법(...arr): 배열을 풀어서 인자로 전달하거나, 배열을 풀어서 각각의 요소로 넣을 때 사용
- rest 문법(...parameter): 파라미터를 배열의 형태로 받아서 사용 / 파라미터 개수가 가변적일 때 유용
구조 분해 할당
구조 분해 할당: spread 문법을 이용하여 값을 해체한 후, 개별 값을 변수에 새로 할당하는 과정
화살표 함수
화살표 함수: function 키워드 대신 화살표(=>) 사용
// 함수선언문
function sum (x, y) {
return x + y;
}
// 함수표현식
const sum = function (x, y) {
return x + y;
}
// 화살표 함수
const sum = (x, y) => {
return x + y;
}화살표 함수 정의 규칙
- 매개변수 한 개일 때, 소괄호(()) 생략 가능
- 함수 코드 블로 내부가 하나의 문으로 구성되어 있다면 중괄호({}) 생략 가능, return 키워드 생략 가능
