[JavaScript] 함수(Function) vs 메서드(Method)

✅ 함수(Function) vs 메서드(Method)

: 호출방식, 함수를 호출하는 객체가 있는 경우 '메서드'. 함수를 호출하는 객체가 없는 경우 '함수'. 자바스크립트 함수에서 그 자체는 객체이므로, 그런 맥락에서 메소드는 실제로 함수에 대한 객체 참조인 것이다.

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

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

obj.show1(); // 메서드(show1()함수는 객체 obj의 프로퍼티, obj객체통해 호출)
show2();     // 함수(객체 생성X 직접호출)

➡️ 함수를 호출하는 전역 객체

show2()는 객체없이 호출되는 것처럼 보이지만, 사실 show2()함수를 호출하는 객체 존재. 전역범위에서 함수가 선언되는 경우 전역객체인 window의 프로퍼티가 된다. JavaScript에서 '메서드'라는 개념은 사용자가 정의한 객체의 프로퍼티가 함수인 경우. 따라서 show2()함수는 메서드가 아니라 함수다!

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

show2();
window.show2();

➡️ 메서드를 변수에 할당

JavaScript에서 함수는 변수에 할당할 수 있음. 함수를 변수처럼 사용할 수 있음. 즉, 메서드도 변수에 할당할 수 있음.

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

obj.show1(); // 메서드

let funcCall = obj.show1;
funcCall();  // 함수(변수 funcCall에 obj객체의 show1()메서드 할당)

=> funcCall에 메서드 할당했지만, funcCall을 호출하는 객체가 존재하지 않으므로 funcCall은 함수다!

💡 함수(Function)와 메서드(Method)의 차이점

함수(Function)	메서드(Method)
함수는 특정 작업을 수행하기 위해 설계된 기능	메서드는 객체의 프로퍼티가 함수인 경우
함수는 직접 호출할 수 있음	메서드는 점 표기법 또는 대괄호 표기법 사용하여 호출
재사용가능함	함수에 비해 재사용하기 어렵다
함수는 자체적으로 존재	메서드는 객체와 연결되어 있음

출처: [JavaScript]함수와 메서드(Function and Method)

🚀 TIL

• 함수,Function
• 메서드,Method