Javascript기초(2) - 함수/화살표함수/익명함수/구조 분해 할당

3. 함수

ㅇ 반복되는 코드를 하나로 묶거나, 의미를 부요하고 역할을 나누기 위해 사용해.
ㅇ 변수 선언, 조건문과 더불어 가장 많이 사용할 문법이야.
ㅇ 기본 형태

 function 함수이름(인자1, 인자2, 인자3) {
   //명령문
 }

 함수이름(인수1, 인수2, 인수3); // 명령문에 있는 내용을 실행해.

ㅇ 인자(Parameter 또는 매개변수)
: 함수를 호출할 때 전달받기 위해 지정한 변수를 뜻하고
몇개든 콤마를 이어붙여 입력받을 수 있어.
: 인자에 전달하는 값 그 자체라고 할 수 있어.

ㅇ 함수는 return 키워드로 값을 반환해.

4. 화살표 함수

ㅇ ES6에서 새롭게 추가된 문법인 화살표 함수(Arrow function)
ㅇ 문법의 생김새처럼 화살표 모양을 하고 있어 이러한 이름이 붙었어.
ㅇ 기존의 함수보다 더 간결한 문법으로 함수를 만들 수 있어.

ㅇ 일반 익명 함수 표현식

const sum = function (a, b) {
  return a + b;
};

ㅇ 화살표 함수 표현식 : return 생략 형태
여러 줄의 코드를 포함하고 싶을 땐 기본 형태를 써야 해.

const sum = (a, b) => a + b;

ㅇ 화살표 함수 표현식 : 인자 괄호 생략 형태
하나의 인자를 입력받는 경우에 괄호 생략이 가능해.

const hell = a => {
  return a;
};

5. 익명 함수

ㅇ 일반 함수와 달라
ㅇ 함수의 이름이 존재하지 않고 변수에 함수를 담아 사용하는 함수야.
ㅇ 변수에 값을 저장하는 방법처럼 변수에 함수를 저장해서 사용해

//일반함수
function dragon() {
  console.log("bar");
}

//익명함수
let dragon = function () {
  console.log("bar");
}

=> 익명함수는 주로 재사용 되지 않고 한번만 사용되는 함수일 경우에
주로 쓰여.

ㅇ 장점: 일회성인 함수를 일반 함수로 구현해서 불필요한 메모리를 차지하는 걸
방지해서 메모리 낭비를 줄일 수 있어.

ㅇ 딘점: hoisting(호이스팅)이 적용되지 않아.
ㅇ 익명함수의 경우 Hoisting이 적용되지 않아서 오류가 나오는 거야.
ㅇ 예시

hello(); // hello!

function hello() {
   console.log("hello!");
}

hello(); // Uncaught ReferenceError: Cannot access 'hello' before initialization 라는 참조오류가 떠

const hello = function() {
  console.log("hello!");
}

6. 구조 분해 할당

ㅇ 구조 분해 할당 문법은 배열 or 객체에서 각각 값이나 프로퍼티를
분해해서 손쉽게 개별 변수에 담을 수 있게 해줘.
ㅇ 배열에서의 구조 분해 할당
[100, 200]이 각각 a 와 b에 담겨.

const [a, b] = [100, 200];
console.log(a); //출력: 100
console.log(b); //출력: 200

//혹은 아래와 같이 표현 가능해.

const array = [100, 200]j
const [a, b] = array
console.log(a); //출력: 100
console.log(b); //출력: 200

//a에는 array[0], b에는 array[1] 값이 할당됐어.

ㅇ '객체'에서의 구조 분해 할당
: 배열에서의 구조 분해 대상이 배열의 값이였다면
객체에서는 프로퍼티(property)가 대상이 돼.

 const student = {
   name : "Harry",
   age: 30,
   movie : "Harry Potter",
 };
 const { name, age, movie} = actor
 console.log(name); // "Harry"
 console.log(age); // 30
 console.log(movie); // "Harry Potter"

=> actor라는 객체에서 name, age, movie 등의 property(속성)를
쉽게 뽑아서 사용할 수 있단 얘기야.