함수 메소드(call, apply, bind)

call

call은 함수(Function)의 메소드이다. 이미 할당되어 있는 다른 객체의 함수나 메소드를 해당 객체에 재할당 할때 사용된다

//this가 없을 경우
Func.call(null, arg, arg1, ...)
//this가 있을 경우
Func.call(this, instance1, instance2, ...)

ㅣㅣㅣs

let divs = document.querySelectorAll('div') 
//divs를 console.log로 찍어보면 NodeList라는 유사배열에 담겨 출력된다.
//divs를 this로 지정하면 다음 코드는 이렇게된다.
[].map.call(divs, function(el) {
	return el.className
})

// divs는 유사배열로 map 메소드를 사용할 수 없다.
// call 함수메소드를 이용해 Array.prototype의 map메소드를 빌려 this로 넘겨 사용할 수 있게 해준다.

객체지향 프로그래밍에서의 사용법

var Item = function () {
    this.model = 'WIFI-6';
    this.company = 'iptime';
    this.type = 'router';
};

var Item = require('./Item');

var NewRouter = function (company, type) {
    
    Item.call(this, company, type);
    
    this.usb = 'USB Type C 3.2 Gen2'
    this.bandwitdh = '160hz';
    };

NewRouter.prototype = Object.create(Item.prototype);
NewRouter.prototype.constructor = NewRouter;

apply

//this가 없을 경우
Func.apply(null, [arg, arg1, ...])
//this가 있을 경우
Func.apply(this, [instance1, instance2, ...])

var Item = function () {
    this.model = 'WIFI-6';
    this.company = 'iptime';
    this.type = 'router';
    this.color = 'white';
};

//var Item = require('./Item');

var NewRouter = function (company, type, color) {
    
    Item.call(this,  [...color]);
    
    this.usb = 'USB Type C 3.2 Gen2'
    this.bandwitdh = '160hz';
    };

NewRouter.prototype = Object.create(Item.prototype);
NewRouter.prototype.constructor = NewRouter;

 

call과 apply의 차이

둘이 기능은  동일하지만 기능의 차이가 있다.

• call은 인자 하나 하나를  전달한다
• apply는 인자 리스트(배열)을 전달한다.

bind