자바스크립트 기초 이론 - 패캠 node.js 바탕 기본 3

 

1. es2015 와 tc 39

---

• ecma international 은 자바스크립트를 포함한 다양한 기술표준 정립을 목적으로 함
• 그 중 tc 39 위원회는 자바스크립트(ecma script) 표준 제정을 담당하며 대부분의 논의 내용이 웹에 공개되어 있음

 

https://ahnheejong.name/articles/ecmascript-tc39/

ECMAScript와 TC39

https://tc39.es/

TC39 – Specifying JavaScript.

 

 

2. node.green

---

• node.green 에서 node 의 각 버전별로 지원하는 ecma script 기능 확인 가능

 

 

 

3. let, const

---

• let 과 const 는 es2015 에 추가된 변수 선언 키워드
• hoisting 규칙이 없고, block scoping 을 지원한다.
• 따라서 var 보다 훨씬 예측 가능한 코드를 짤 수 있게 해준다

 

 

 

4.1 let, const vs var

---

• var 와는 달리 let, const 는 같은 스코프 내에서 두번 이상 정의할 수 없음
• var 와는 달리 let, const 는 변수를 정의하기 전에 사용할 수 없음 

 

 

 

4.2 block scoping

---

강의 이미지 일부 캡처

• var 와는 달리 let, const 는 블록 안과 밖에서 선언한 변수가 다르다
• 블록을 벗어나면 블록 밖에 변수를 따른다

 

 

 

4.3 결론

---

• let, const 의 예측 가능성과 유지보수성이 var 보다 훨씬 뛰어남
• 가능하면 const 만 쓰며, 필요한 경우에 let 을 쓰고 var는 되도록 쓰지 말 것 

 

5. Spread syntax ( ...[변수] )

---

• es 2015 에 추가된 syntax 이다
• 병합, 구조 분배 할당(destructuring) 등에 다양하게 활용 가능
• spread 의 의미인 `흩뿌리다` 라는 의미로 파악을 하면 syntax 가 가진 의미를 이해하는 데 도움이 된다

 

1) object merge (1)

---

const personalData = {
  nickname: 'JH',
  email: 'jh12@email.com',
}

const publicData = {
  age: 22,
}
const user = {
  ...personalData,
  ...publicData,
}

console.log(user)

강의 이미지 일부 캡처

• 오브젝트를 만든 다음에 흩뿌려서 안에 들어가게 한다. 라고 생각하면 될 것 같다

 

const overrides = {
  database_host: 'myhost.com',
  database_password: 'mypassword',
}

const config = {
  database_host: 'default.host.com',
  database_password: '####',
  database_username: 'sdferqewr',
  ...overrides,
}

console.log(overrides)
console.log(config)

강의 이미지 일부 캡처

• 기존에 있던 값을 덮어 씌우는 것(override) 가 가능하다
• ...overrides 가 앞에 오게되면 위의 내용이 앞의 내용을 덧씌우기 때문에 주의해야 함

 

 

2) object rest

---

const user = {
  nickname: 'jk',
  age: 22,
  email: 'jh12@dsdf.com',
}

const { nickname, ...personalDatas } = user

console.log(personalDatas)

강의 이미지 일부 캡처

• distructuring 에도 활용할 수가 있다.
• user 에서 nickname 을 제외한 나머지를 personalDatas 로 빼오고 싶을때 spread syntax 를 활용할 수 있다.

 

 

3) array merge

---

const pets = ['dog', 'cat']
const perdators = ['wolf', 'cougar']
const animals = [...pets, ...perdators]

console.log(animals)

강의 이미지 일부 캡처

• 배열을 합치는 데에도 사용할 수 있다.

 

 

4) array rest

---

const [head, ...rest] = [1, 2, 3]
console.log(head)
console.log(rest)

강의 이미지 일부 캡처

• 배열의 나머지 원소들을 빼오고 싶을 때 사용할 수 있다.