메서드와 함수가 동일시되는 다른 언어와 달리 Javascript에서는 Method와 함수에 차이가 존재한다.
메서드 vs 함수
메서드와 함수는 호출 방식에 따라 다르다.
함수를 호출하는 객체가 있을 경우에 메서드라고 하고, 함수를 호출하는 객체가 없는 경우 함수라고 한다.
let obj = {
show1: function() {
console.log('show1() 메서드 호출');
}
}
function show2() {
console.log('show2() 함수 호출');
}
obj.show1(); // 메서드
show2(); // 함수
위 예제에서 show1() 함수는 객체 obj의 프로퍼티이며, obj 객체를 통해 호출했으므로 메서드이다. 반면에 show2() 함수는 객체를 생성하지 않고 직접 호출했으므로 함수다.
함수를 호출하는 전역 개체
위의 예제에서의 show2()의 경우 객체 없이 호출되는 것처럼 보이지만 사실 window라는 전역객체가 show2()를 호출하고 있는 것이다.
function show2() {
console.log('show2() 함수 호출');
};
show2();
window.show2();
그렇다면 show2() 함수가 아니라 메서드일까? 그렇지 않다. 메서드는 사용자가 정의한 객체의 프로퍼티가 함수인 경우이다.
메서드 vs 함수 정리
함수(Function) | 메서드(Method) |
함수는 특정 작업을 수행하기 위해 설계된 기능입니다. | 메서드는 객체의 프로퍼티가 함수인 경우입니다. |
함수는 직접 호출할 수 있습니다. | 메서드는 점 표기법 또는 대괄호 표기법을 사용하여 호출할 수 있습니다. |
재사용 가능합니다. | 함수에 비해 재사용하기 어렵습니다. |
함수는 자체적으로 존재합니다. | 메서드는 객체와 연결되어 있습니다. |
참고
- [Javascript] Function and Method
반응형
'Front-end' 카테고리의 다른 글
[Javascript] this란 무엇인가 (1) | 2023.08.26 |
---|---|
[Javascript] Shadow DOM과 event.composed (0) | 2023.08.15 |
[Javascript] Base64 사용 방법과 사용 이유 (feat. btoa, atob) (0) | 2023.08.15 |