JavaScript 함수 apply() 및 bind() 메서드

Shiv Yadav 2023년10월12일
  1. JavaScript Function.apply() 메서드
  2. JavaScript Function.bind() 메서드
JavaScript 함수 apply() 및 bind() 메서드

이 자습서에서는 JavaScript 함수 유형의 apply()bind() 메서드를 사용하는 방법을 알려줍니다.

JavaScript Function.apply() 메서드

Function.prototype.apply() 메소드를 사용하여 지정된 매개변수 배열과 주어진 this 값을 사용하여 함수를 호출할 수 있습니다. apply() 함수의 구문은 다음과 같습니다.

Function.apply(thisArg, [args]);

두 개의 매개변수가 apply() 함수로 전송될 수 있습니다. thisArg 매개변수는 함수 호출에 제공된 this의 값이고 args 인수는 함수의 인수를 정의하는 배열입니다.

args 매개변수는 배열 객체이거나 ES5 이후의 배열과 유사한 객체일 수 있습니다.

call() 메서드와 유사하게 apply() 메서드는 함수의 매개변수를 개별 인수가 아닌 배열로 받아들입니다.

apply() 메서드를 사용하는 몇 가지 예를 살펴보겠습니다. 다음과 같이 indivi 개체와 gt라는 인사말 함수가 있다고 가정합니다.

const indivi = {
  fName: 'Shiv',
  lName: 'Yadav',
};
function gt(wave, sms) {
  return `${wave} ${this.fName}. ${sms}`;
}
let output = gt.apply(indivi, ['Hello', 'Where are you going?']);
console.log(output);

실행 코드

wavesmsgt() 메서드가 취하는 두 개의 인수입니다. gt() 함수 내부에 fName 필드가 있는 객체를 참조합니다.

apply() 메서드는 아래 예제를 사용하여 this가 개별 개체로 설정된 gt() 함수를 호출하는 데 사용할 수 있습니다.

출력:

"Hello Shiv. Where are you going?"

위의 예는 함수 내에서 indivi 객체를 this 값으로 설정합니다. apply() 메서드는 gt() 함수의 매개변수를 배열로 받았습니다.

gt() 함수는 ["Hello," "Where are you going?"] 배열의 매개변수와 함께 apply() 메소드에 의해 호출되었으며 이 값은 indivi 객체로 설정됩니다. .

JavaScript Function.bind() 메서드

bind() 메서드에 의해 생성된 새 함수의 this 키워드는 호출 시 제공된 값으로 설정됩니다. 진정으로 더 많은 주제에 대해 논의하지만 다른 시간을 위해 저장하겠습니다.

이것은 많은 힘을 가지고 있습니다. 함수를 호출하면 this 값을 명시적으로 선언할 수 있습니다.

코드를 살펴보겠습니다.

var indivi = {
  fName: 'Shiv',
  lName: 'Yadav ',
  getIndiviName: function() {
    var fName = this.fName + ' ' + this.lName;
    return fName;
  },
};

var indiviName = function() {
  console.log(this.getIndiviName() + 'Where are you Going ?');
};

var logName = indiviName.bind(indivi);

logName();

실행 코드

그것을 해부하자. JS 엔진은 indiviName의 새 인스턴스를 생성하고 bind() 함수를 사용할 때 indivi를 이 변수로 바인딩합니다. indiviName 기능을 복제한다는 사실을 깨닫는 것이 중요합니다.

logName()은 원래 indivi 객체에 없었지만 이제는 indiviName 함수를 복제한 후에 호출할 수 있습니다. 이제 속성(ShivYadav)과 관행을 식별할 수 있습니다.

중요한 부분은 값이 바인딩된 후 다른 일반 함수와 마찬가지로 함수를 사용할 수 있다는 것입니다.

출력:

"Shiv Yadav Where are you Going ?"
작가: Shiv Yadav
Shiv Yadav avatar Shiv Yadav avatar

Shiv is a self-driven and passionate Machine learning Learner who is innovative in application design, development, testing, and deployment and provides program requirements into sustainable advanced technical solutions through JavaScript, Python, and other programs for continuous improvement of AI technologies.

LinkedIn

관련 문장 - JavaScript Function