1월 19일 여정 11일차이다.
오늘은 함수에 대해 공부하다가 함수와 메서드에 궁금증이 생겼다. 그래서 자바스크립트의 함수와 메서드에 대해 더욱 자세히 보려고 한다.

오늘의 Today I Learned

Problem

내가 쓰고 있는 함수에 대해서 그동안 의문을 가진적이 없었던 것 같다. 그래서 함수와 그리고 객체 안에 메서드에 대해서 궁금증이 생겨서 더욱 알아보았다.

Try

기본적으로 함수는 흔히 function이라고 자바스크립트에서 시작된다. 그러나 객체 안에 메서드 라는 것은 조금 다르다. 그러면 무엇이 다른걸까? 구글에 검색하고 항해99에서 준 문서를 살펴보았다.

solve

먼저 예제를 보겠다.

let obj = {
  show1: function() {
    console.log('show1() 메서드 호출');
  }
}

function show2() {
  console.log('show2() 함수 호출');
}

obj.show1(); // 메서드
show2();     // 함수

show1()함수는 객체 obj의 프로퍼티이며, obj 객체를 통해 호출되었다. 그러므로 메서드이다. 그러나 show2()는 객체가 아닌 직접 호출이 되었으므로 함수가 된다.

그러면 여기서 의문이 하나든다. 함수는 정말로 객체가 없이 호출이 되는 걸까? 밑의 예제를 보겠다.

function show2() {
  console.log('show2() 함수 호출');
};

show2();
window.show2();

사실 show()2함수를 호출하는 객체가 존재한다. 이 경우 window의 프로퍼티가 된다.

또한 자바스크립트에서 함수는 변수에 할당이 가능하다.

let obj = {
  show1: function() {
    console.log('show1() 메서드 호출');
  }
}

obj.show1(); // 메서드

let funcCall = obj.show1;
funcCall();  // 함수

코드를 보면 funcCall에 obj.show1을 변수로써 할당 한것을 볼 수 있다. 할당된 변수는 함수처럼 사용이 가능하다.

Knew

기본적인 내용이지만 더욱 깊게 한번 살펴보았다.
가장 큰 차이점은 메서드는 객체 안에 함수가 존재하지만, 함수는 특정 작업을 수행하기 위해 만들어졌다는 것이다.

마지막으로

함수와 메서드에 대해 더욱 자세하게 알아본 것은 어찌보면 내가 실력이 늘고 있다는 뜻일 수도 있다.