[딥다이브] 함수

Dongs·2023년 3월 19일
0

[딥다이브]

목록 보기
5/11

함수

  • 함수를 사용하는 가장 큰 이유는 코드의 재사용성, 유지보수, 가독성 이다!

함수표현식과 함수선언문의 차이?

var foo = function(){
 //.... 
}

function foo(){
 //.... 
}

위의 코드를 보면 첫 번째 함수는 foo 라는 변수에 익명함수가 할당되어 있고 두 번째 함수는 foo라는 이름을 가진 함수가 선언된 것이다. 변수에 할당되어 있는 함수를 함수표현식 이라고 부르고 별도의 할당 없이 선언된 함수를 함수선언문 이라고 부른다.


헷갈렸던 점

var add = function(){
	//....
}

var add2 = function add(){
	//....
}

위의 코드는 공부하면서 헷갈렸던 점이다. 첫 번째 함수표현식은 add라는 변수에 익명함수를 할당했으며, 참조할 수 있는 식별자가 add라는 변수명뿐이기 때문에 add(); 와 같이 호출할 수 있다.

그러나 두 번째 함수표현식은 뭘까? 대체 무엇으로 호출해야 할까? add2라는 식별자와 add라는 식별자가 동시에 존재한다....

=> 첫 번째 함수와 두 번째 함수는 모두 함수객체 안 name 프로퍼티가 add로 등록되어 있다. 당연히 첫 번째 함수는 add() 로 호출해야하고 add2는 왜 add()로 호출할 수 없는 것일까?

궁금증 해결

  • 멍청했다... 당연히 add2 라는 변수에 할당되어 있기 때문에 참조 자체가 불가능하다... add2() 로 호출해야 하는것이 당연하다. 해결하고 보니 함수표현식에서는 굳이 함수이름을 정의해 줄 필요가 없는 것 같다... 또 굳이 함수표현식을 쓰지 않고 함수선언문을 주로 많이 쓸 것 같다는 생각이 든다.

함수표현식에서의 this?

var add2 = function add(){
	//....
  console.log(this);
}

add2(); // window

똑같은 코드를 가져와봤다. 함수표현식에서의 thiswindow 객체를 가리킨다! 그러나 예외가 있다.

"use strict";

var add2 = function add(){
	//....
  console.log(this);
}

add2(); // undefined

바로 strict 모드 일 때의 경우다. 이 경우에는 this가 undefined로 출력된다. 함수선언문에서의 this도 마찬가지이다!

함수 생성 시점? 호이스팅?

  • 함수도 변수선언문과 똑같이 런타임 이전에 호이스팅이 된다. 함수선언문으로 선언한 함수는 런타임 이전에 메모리 공간을 확보하여 함수객체 값을 저장하고, 함수 이름으로 자바스크립트 엔진 자체에서 암묵적으로 식별자를 만들어 메모리에 참조 정보를 저장한다. 한 마디로, add() < 이렇게 함수를 호출하면,
  1. add라는 암묵적인 식별자가 가리키는 메모리를 찾음
  2. 그 메모리가 가리키고 있는 함수객체값이 저장되어 있는 메모리를 찾음.
  • 메모리에 함수에 대한 정보가 저장되는 과정들은 모두 인터프리팅 전, 즉, 런타임 이전 실행코드평가과정 때 이루어진다!

함수표현식은?

  • 함수표현식도 동일하게 동작하지만 다른 점이 있다. 함수선언문은 런타임 이전에 메모리 공간을 모두 확보하지만, 예를 들어 var로 선언한 함수표현식은 호이스팅 되며 먼저 메모리 공간에 undefined로 저장하며, 인터프리팅 시, 새로운 참조 메모리와 함수 객체 정보의 메모리를 만들어 저장한다.

순수함수와 비순수함수?

  • 순수함수는 어떤 외부상태에 의지하지 않고, 매개변수를 통해 함수 내부로 전달된 인수에게만 의존해 값을 생성해 반환한다.
    => 즉 동일한 매개변수에 따라 동일한 결과값을 반환해낸다.

  • 비순수함수는 외부상태의 영향을 받으며 외부에 선언된 변수나 객체의 값을 바꿀 수도 있다. 이걸 부수효과, 부작용(side-Effect) 라고 부른다!

정리하면 순수함수의 비순수함수의 차이점은 크게

  1. 부작용(side effect)의 유무
  2. 동일한 인자에 대한 동일한 반환값 보장 여부

로 나눌 수 있다!

개발 시 순수함수? 비순수함수?

  • 일반적으로 순수 함수로 개발하는 것이 더 좋다고 한다. 그 이유는 순수 함수는 입력값이 같으면 항상 같은 결과를 반환하기 때문에 결과 예측이 쉽고 테스트하기도 용이하다. 또한 부작용, 부수효과(side effect)가 없기 때문에 코드의 의도가 분명해지고 유지보수가 쉽다는 특징이 있다.

  • 반면에 비순수 함수는 입력값에 따라 결과가 항상 다를 수 있고, 외부 상태를 변경시키기 때문에 코드의 의도를 파악하기 어렵고 예측하기 어려울 수 있다. 따라서 버그를 발생시키기 쉽고, 코드를 수정하기 어렵고, 테스트하기도 어려울 수 있다.

  • 하지만, 때에 따라서는 비순수 함수를 사용해야 하는 경우도 있다. 예를 들어, 파일 시스템이나 네트워크와 같은 외부 자원에 접근할 때는 순수 함수로는 처리할 수 없기 때문이다. 이 경우에는 함수 내에서 부작용이 발생하는 것이 불가피하다...

느낀 점

  • 함수의 종류에도 여러 종류가 있다는 것을 알았고, 객체 타입이라는 특징... 화살표함수와 일반함수가 가리키는 this의 개념이 다르다는 점 등등,,, 몰랐던 사실들이 많았다. 지금까지 함수를 사용해 코딩하면서 이런 개념들을 모르고 코딩했던게 정말 ....... 감자다..
profile
자대고 css 하는 프론트엔드 개발자

0개의 댓글