[JS/Node] 핵심 개념과 주요 문법

Scope

변수 접근 규칙에 따른 유효 범위:

1) 안쪽 스코프에서 바깥쪽 스코프로는 접근할 수 있지만 반대는 불가능
2) 스코프는 중첩이 가능
3) 전역 스코프(Global Scope): 가장 바깥쪽의 스코프
4) 지역 스코프(local scope): 전역이 아닌 다른 스코프
5) 우선 순위: 지역 스코프의 변수 > 전역 스코프의 변수

두 가지 종류의 스코프:
1) 블록 스코프 : 중괄호 기준
2) 함수 스코프 : function 키워드를 사용하는 함수 선언식, 함수 표현식 스코프 (화살표 함수는 블록 스코프)

변수 키워드(let, var, const);

var: 블록 스코프를 무시(외부에서 접근 불가능)하고 함수 스코프(화살표 함수 제외)만 따른다(외부에서 접근 가능)

let: 재선언을 방지

Closer

MDN 정의: 함수와 함수가 선언된 어휘적 환경의 조합
1) 함수를 리턴하는 함수

const adder = x => y => x + y

2) 내부 함수는 외부 함수에 선언된 변수에 접근이 가능하다

const adder = function (x) {
  return function (y) {
    return x + y;
  }
}

장점

1) 데이터를 보존하는 함수:

외부 함수의 실행이 마치더라고 외부 함수의 변수를 사용할 수 있다.

const tagMaker = tag => content => `<${tag}>${content}</${tag}>

const divMaker = tagMaker('div');
divMaker('hello') // <div>hello</div>

2) 클로저 모듈(정보의 접근 제한 '캡슐화')

const makeCounter = () => {
  let value = 0;

  return {
    increase: () => {
      value = value + 1
    },
    decrease: () => {
      value = value - 1
    },
    getValue: () => value
    }
  }
const counter1 = makeCounter();

Spread/Rest/Restructing

• spread: 배열을 풀어서 인자 또는 요소로 전달
• rest: 매개변수를 배열의 형태로 받아 사용

1) 배열 합치기

let arr1 = [0, 1, 2];
let arr2 = [3, 4, 5];
arr1 = [...arr1, ...arr2];

2) 배열 복사

let arr = [1, 2, 3];
let arr2 = [...arr]; // arr.slice() 와 유사

• restructing: spread 문법을 이용하여 값을 해체한 후, 개별 값을 변수에 새로 할당하는 과정을 말합니다.

1) 유용한 예제

function whois({displayName: displayName, fullName: {firstName: name}}){
  console.log(displayName + " is " + name);
}

let user = {
  id: 42,
  displayName: "jdoe",
  fullName: {
      firstName: "John",
      lastName: "Doe"
  }
};

whois(user) // 질문: 콘솔에서 어떻게 출력될까요?

2) 퀴즈

let arr = ['code', 'states']
let value = [
  ...arr,
  'pre',
  ...['course', 'student']
] 
// value값은?
['code', 'states', 'pre', 'course', 'student']