[TIL] JavaScript: function (함수 선언, 함수 표현식)

Bas·2021년 2월 24일
0

JavaScript

목록 보기
4/12

🔑 Point!
🎉 함수선언 (function declation)
🎉 함수표현 (function Expression)
🎉 arrow function


함수란?

  • 함수는 프로그램을 구성하는 기본적인 빌딩 블럭
  • Sub-program이라고도 불리며, 여러 번 재사용이 가능하다.
  • 한 가지(ons function === one thing!!) task를 수행하거나 어떤 값을 계산하기 위해 쓰여진다.

함수 선언의 방법에 대해 이해하고, 함수 선언과 함수 표현식의 차이점을 이해해 봅시다.

👉 함수 선언

  • "함수 선언"의 구조는 간단하게 아래와 같습니다.
function name(param1, param2...) {
	body~~~~
    return;
}
  • name: 함수의 이름은 verb형태로 작성합니다.
    ex) doSomethig, printMessage

  • parameter (매개변수)
    1) premitive parameters 일 때는 value가 그대로 전달됩니다.
    2) object parameter은 refernse가 전달됩니다.

  • Default parameter
    매개변수의 기본값을 설정하는 방법은 간단합니다. 매개변수 옆에 = '기본 값'을 입력

function doSomething(who, what = 'dog') {
	console.log(`${who} likes ${what}.`);
    }
doSomething('hyojin'); //--> what에 대한 param2가 없기때문에
			  // 'hyojin likes dog.'이 출력
  • return (반환)
    모든 함수에는 return undefined(생략 가능)이거나 return을 할 수있다.

👉 함수 표현

First-class Function ?

  • 함수는 다른 변수와 마찬가지로 변수에 할당이 가능하고,
  • 함수의 parameter로도 전달이 되며,
  • return 값으로 반환이 가능하다.
    --> 이것들을 가능하게 한 것이 함수 표현이다.

callback 함수

함수를 전달해서 나중에 호출하는 것이다.

  • anonymous function / named function
    1. anonymous function(이름 없는 function)
    function ()
    1. named function (이름 있는 function)
    function name(param)
    named function은 디버깅할 때 함수 이름이 나오게 하거나, 함수 안에서 자기 자신을 또다른 함수로 호출할 때 쓰인다.

arrow function

function expression을 간결하게 만들어 준다.
항상 이름이 없는 anonymous function이다!

const simplePrint = function () {
  console.log('simplePrint');
};

// arrow function으로 
const simplePrint = () => console.log('simplePrint');

✅ 함수 표현과 함수 선언의 가장 큰 차이점은?

함수 표현은 할당 된 다음부터 호출이 가능한 반면에! (즉, 선언 전에 호출하면 Error)
함수 선언은 hoisting이 가능하다. (선언하기 전에 호출이 가능)
(Q. 함수 선언을 hoisting해서 사용하는 경우는 언제? 왜?)

profile
바스버거

0개의 댓글