본문 바로가기
javaScript/J Query & 스크립트

메소드 call에 대해서

by mooyou 2022. 5. 12.
728x90
300x250
SMALL

call 메서드

call 메소드는 주어진 this값과 각각 전달된 인수와 함께 호출한다.

 

function Product(name, price) {
  this.name = name;
  this.price = price;
}

function Fruit(name, price) {
  Product.call(this, name, price); //call을 이용해 Fruit 호출시 넘긴 매개변수 name, price를 받아서 Product 함수 호출 
  this.category = 'food';
}

console.log(new Fruit('apple', 500).name); //Fruit에는 name 프로퍼티가 없지만 호출한 Product에서 name을 가져온다.
// apple 출력

 

호출할때 .call을 붙여서 주어진 this 값과 전달된 각각의 인수를 함수와 함께 호출한다.

 

call, apply 차이

call과 apply는 거의 동일하지만 call은 인수 목록을 받고, apply는 인자를 하나로 묶어서 배열로 만들어 넣는 것의 차이가 있다.

 

Syntax

call()
call(thisArg)
call(thisArg, arg1)
call(thisArg, arg1, arg2)
call(thisArg, arg1, ... , argN)
apply(thisArg)
apply(thisArg, argsArray)

 

call과 apply의 Syntax를 비교해 보자 둘 다 첫 번째 인자로 thisArg를 가지는데 이는 this를 thisArg(첫번째 인자)로 변경하는 것이다.

이렇게 하면 다른 객체의 함수를 자기 것처럼 사용할 수 있게 된다.

 

this는 기본적으로 window를 가리키는데 call, apply 첫 번째 인자를 이용해서 this를 변경할 수 있게 된다.

 

 

참고 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Function/call

728x90
반응형
LIST

댓글