* 함수 선언문

* 함수 선언문 vs 함수 표현식

* 함수 선언식

function sayHello(){
    console.log('Hello')
}

sayHello();

* 함수 표현식

let sayHello = function(){
    console.log('Hello');
}

sayHello();

• 두 표현식의 작성방식은 다르지만 실제로 결과값은 같다.
  차이점은 호출하는 타이밍 이다.

함수 선언문은 어디선든 호출 가능하다.

sayHello();

function sayHello(){
    console.log('Hello')
}
				/// 이렇게 위치가 바뀌어도 동일하게 작동

인터프리팅 언어

• 자바스크립트는 기본적으로 위에서 아래로 한줄식 코드를 읽으면서 즉시 결과를 반환하는 언어

console.log(num);

let num = 1;			///이 코드의 콘솔은 1이라는 값을 출력하지 않는다
							순차적으로 진행됬기 때문에 아직 1이라는 값을 못받았기 때문

호이스팅(Hoisting)

sayHello();

function sayHello(){
    console.log('Hello')
}
				

그렇다면 이 코드는 호출하는 부분이 위에있는데도 어떻게 실행이 된걸까?

• 이것은 자바스크립트의 특성으로 자바스크립트는 초기화 단계에서 모든 함수 선언문을 찾아서 생성해 둔다. 즉 눈으로 봤을때는 실행문이 위에 있어 보이지만 실제로는 더 넓은 범위에 작용하는것

이것을 호이스팅 이라고 한다.

(함수를 미리 읽는것일뿐 실제로 위치가 바뀌는것은 아님)

• 함수 선언문과 함수 표현식의 차이는 호이스팅 되냐 안되냐의 차이다. 함수 선언문은 호이스팅이 되지만, 함수 표현식은 호이스팅이 되지 않는다.

* 화살표 함수

• 화살표 함수는 지금까지 사용한 코드식을 좀더 간결하게 바꿀수 있다.

let add = function(num1,num2){
    return num1 + num2;
}						/// 이 함수식을

let add = (num1,num2) => {
    return num1 + num2;
}
						///function 을 없애고 화살표로 할수도 있고,


let add = (num1,num2) => (
    num1 + num2;
)

						/// 또한 return문이 한줄이니 이렇게도 바꿀 수 있는데, return문은 중괄호가 아닌 
                        	일반 괄호로 바꿀수도 있다.
                        


let add = (num1,num2) => num1 + num2;
   
						///또한 리턴문이 한줄이면 괄호도 생략 가능하다.

showError();

let showError = function(){
    console.log('error')
}
				/// 함수 표현식 이라서 실행시 오류가 발생

showError();

function showError(){
    console.log("error")
}
				/// 함수 선언문 이라서 실행시 콘솔값이 실행된다.

let showError = () =>{
    console.log("error")
}
				/// 화살표 함수로 바꾼 식

화살표 함수로 바꾸기

const sayHello = function (name){
    const msg = `Hello, ${name}`;
    console.log(msg);
}



const sayHello =  (name)=>{
    const msg = `Hello, ${name}`;
    console.log(msg);
}
					///function 을 지우고 괄호뒤에 화살표로 바꿔준다.

인수가 2개인 함수식
const add = function (num1, num2){
    const result = num1 + num2;
    return result
}


인수가 2개인 함수식
const add =  (num1, num2) => {		///1. function을 지우고 화살표로 바꾼뒤
    const result = num1 + num2;		///3. 리턴문을 올려줘서 const result 가 사라져도 무방함 
    return result					// 2. return문을 한줄로 바꾼 후
}


인수가 2개인 함수식
const add = (num1, num2) =>{
    return= num1 + num2;				/// return문이 한줄이기 때문에 더 간결하게도 가능
    
}


const add = function (num1, num2) => num1 + num2;

					///최종본