바닐라코딩

3주차 강의 ES2015 & beyond

단점이없어지고싶은개발자 2021. 8. 7. 18:07
반응형

자바스크립트의 모든 값들의 종류는 7가지로 분류가 가능하다

1. String
2. Boolean
3. Number
4. Null
5. Undefined
6. Object
7. Symbol

자바스크립트의 모든 값들은 그 작동 원리에 따라 아래와 같이 2가지로 분류 할 수 있다.

1. Primitive
2. Reference

Reference(참조) 방식으로 작동하는 자료형은 단 하나 뿐이다.
- Object
array, function도 포함되어 있다.

primitve에서 값을 할당해줄 때는 값의 "모양"이 같다면 서로 같은 값이다

let a = 1;
let b = a;

Reference는 값을 할당해줄 때 값의 '모양'이 같다고 서로 같다고 보지 않는다!!!
  


ES2015 and beyond

a === b 는 같은가? true다
ES2015 이전에는 모든 변수 선언을 var로 사용했다. 그러나 ES2015에서는 let, const가 추가 되었다.
1주차에도 살펴봤지만 한 번 더 복습하면
let은 선언 후 재할당은 가능하나
const는 선언 후 재할당이 불가능하다
const = 상수

var은 함수 단위의 스코프를 기준으로 접근 가능 / 전역변수로 선언시 전역 객체의 key/value로 추가
 let은 중괄호를 기준으로 접근 범위가 생성된다 / 전역변수로 선언시 전역객체 추가 되지 않음

가장 대중적으로 많이 사용되는 방식 :
1. 기본으로 항상 const를 이용해 변수선언
2. 재할당을 해야한다면 let으로 변경
3. var는 사용하지 않는다.

Rest Operator - 함수의 마지막 인자들을 숫자의 제한없이 배열로 받아 처리한다.

function foo(a, b, ...c) {
	console.log(c); // [3,4,5];
}

foo(1,2,3,4,5)

//이런식으로 나머지 값들을 배열로 만든다. 
//만약 맨 앞에서 ...a, b, c 이런식으로 쓸 수는 없다.
//그러나 만약 ...a 하면 모든 값이 들어있다.

Spread Operator 

Spread Syntax는 배열이나 유사배열 형태의 자료를 퍼지게 해주는 기능입니다. 예를 들어, 함수를 실행할때 넘겨주는 인자나 배열을 만들고 요소를 지정해줄때 사용할 수 있습니다.

const a1 = [1, 2, 3];
const a2 = [4, 5, 6];

// 배열의 요소로 퍼지게 한다
const total = [...a1, ...a2];

console.log(total); // [1,2,3,4,5,6];

Rest - Spread는 다르게 사용되고 다른 것이기 때문에 잘 유의해야한다

Defualt Parameter

foo a(a = 1, b = 2){
	result = a + b;
}

foo(); // 3
foo(3,3); // 6

//매개변수에 기본값을 줄 수 있고, 주는 매개변수가 없다면
//기본값이 들어가서 처리된다. 그 기준은 undefined다.
//null, 0 이 들어가면 null, 0이 처리된다
반응형