본문으로 건너뛰기

함수

작성일 : 2024.10.06

  • 함수 : 일련의 과정을 statement로 구현하고 코드 블럭으로 감싸서 하나의 실행 단위로 정의한 것
  • 함수를 사용하는 이유
    • 코드의 재사용 -> 유지보수의 편의성 향상, 실수를 줄여 코드의 신뢰성 향상, 코드의 가독성 향상
  • 이상적인 함수는 한가지 일만 해야 하며 가급적 작게 만들어야 한다.
  • js의 함수는 객체 타입의 값이다.

함수 정의​

함수 선언문​
  • 함수 선언문은 함수 이름을 생략할 수 없다.
  • 함수 선언문은 표현식이 아닌 statement
  • js 엔진은 생성된 함수를 호출하기 위해 함수 이름과 동일한 이름의 식별자를 암묵적으로 생성하고, 함수 객체를 할당한다.
function add(x,y) {
	return x+y;
}

js의 는 중의적 표현이다

  • 이 단독으로 존재하면 js엔진은 을 블록문으로 해석된다
  • 이 값으로 평가되어야 할 문맥에서 피연산자로 사용되면 js엔진은 을 객체 리터럴로 해석한다.
함수 표현식​
  • 일급 객체 : 값처럼 변수에 할당할 수도 있고 프로퍼티의 값이 될 수도 있으며 배열의 요소가 될 수 있는 객체.
  • js의 함수는 일급 객체다
  • 함수 선언문은 "표현식이 아닌 문", 함수 표현식은 "표현식인 문"
  • 함수 이름은 함수 몸체 내부에서만 유효한 식별자다.
var add = function foo(x,y) {
	return x+y;
}
console.log(add(2,5));
함수 생성 시점과 함수 호이스팅​

  • 함수 선언문으로 정의한 함수는 함수 선언문 이전에 호출할 수 있다

  • 함수 표현식으로 정의한 함수는 함수 표현식 이전에 호출할 수 없다 -> 함수의 생성 시점이 다르기 때문

  • 함수 호이스팅 : 함수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 자바스크립트 고유의 특징

Function 생성자 함수​

  • 생성자 함수 : 객체를 생성하는 함수
var add = new Function('x','y', 'return x+y');
console.log(add(2,5));

var add1 = (function(){
	var a = 10;
	return function(x,y) {
		return x+y+a;
	}
}());

var add2 = (function() {
	var a = 10;
	return new Function('x','y','return x+y+a;');
}())

화살표 함수​

const add = (x,y) => x+y;

외부 상태의 변경​

  • 순수 함수 : 외부 상태를 변경하지 않고 외부 상태에 의존하지도 않는 함수
  • 함수형 프로그래밍 : 순수함수를 통해 부수 효과를 최대한 억제하여 오류를 피하고 프로그램의 안정성을 높이려는 프로그래밍 패러다임

즉시 실행 함수​

  • 즉시 실행 함수 : 함수 정의와 동시에 즉시 호출되는 함수
  • 즉시 실행 함수는 함수 이름이 없는 익명 함수를 사용하는 것이 일반적
  • 즉시 실행 함수 내에 코드를 모아 두면 혹시 있을 수도 있는 변수나 함수 이름의 충돌을 방지할 수 있다.
  • 반드시 그룹 연산자 () 로 감싸야 함
(function() {
	var a=3;
	var b=5;
	return a*b;
}());

(function(a,b) {
	return a*b;
}(3,5));

(function () {

}());

(function() {

})();

!function () {

}();

+function () {

}()

재귀함수​

  • 재귀함수 : 자기 자신을 호출하는 함수
  • 탈출 조건을 반드시 만들어야 함
  • 반복되는 처리를 반복문 없이 구현할 수 있다는 장점
  • 무한 반복에 빠질 위험이 있고, 스택 오버플로 에러를 발생시킬 수 있음
function fact(n) {
	if(n<=1) return 1;
	return n*fact(n-1);
}

중첩 함수​

  • 중첩 함수 : 함수 내부에 정의된 함수
  • 중첩 함수는 외부 함수 내부에서만 호출 가능
  • 자신을 포함하는 외부 함수를 돕는 헬퍼 함수의 역할을 수행
  • 호이스팅으로 인한 혼란을 방지하기 위해 코드 블록 내에 함수 정의하는 것은 옳지 않음
function outer() {
	var x=1;
	function inner() {
		var y = 2;
		console.log(x+y);
	}
	inner();
}
outer();

콜백 함수​

  • 콜백함수 : 함수의 매개변수를 통해 다른 함수의 내부로 전달되는 함수
  • 고차함수 : 매개변수를 통해 함수의 외부에서 콜백 함수를 전달받은 함수
    • 고차함수는 콜백함수를 자신의 일부분으로 합성
    • 고차함수는 매개변ㅅ후를 통해 전달받은 콜백함수의 호출 시점을 결정해서 호출
    • 콜백함수는 고차함수에 의해 호출되며, 이때 고차함수는 필요에 따라 콜백함수에 인수를 전달할 수 있음
function repeat(n,f) {
	for(var i=0;i<n;i++){
		f(i);
	}
}
var logAll = function(i) {
	console.log(i);
}
repeat(5, logAll);

순수함수와 비순수 함수​

  • 순수 함수 : 외부 상태에 의존하지 않고 변경되지도 않는, 즉 부수 효과가 없는 함수

  • 비순수 함수 : 외부 상태에 의존하거나 외부 상태를 변경하는 즉 부수 효과가 있는 함수 외부 상태 : 전역 변수, 서버 데이터, 파일, console, DOM 등..

  • 순수 함수 : 동일한 인자가 전달되면 언제나 동일한 값을 반환하는 함수

  • 함수의 외부 상태를 변경하지 않는다

함수가 외부 상태를 변경하면 상태 변화를 추적하기 어려워짐 -> 함수 외부 상태의 변경을 지양하는 순수 함수를 사용하는 것이 좋음

함수형 프로그래밍 : 순수 함수와 보조 함수의 조합을 통해 외부 상태를 변경하는 부수 효과를 최소화해서 불변성을 지향하는 프로그래밍 패러다임

  • 순수 함수를 통해 부수 효과를 최대한 억제해 오류를 피하고 프로그램의 안전성을 높이려는 노력의 일환