Javascript: function 메소드

자바스크립트에서 function을 다루는 몇 가지 메소드

1. call:

call 메소드는 함수를 호출할 때 this를 지정할 수 있게 해준다. 인자는 첫 번째로 this로 사용할 객체를, 그 다음은 함수에 전달할 인자들을 나열한다.

function greet() {
    console.log(`Hello, ${this.name}`);
}

const user = { name: 'Alice' };

greet.call(user); // "Hello, Alice"

2. apply:

apply 메소드는 call과 비슷하지만, 함수에 전달할 인자를 배열로 받는다. 따라서 여러 인자를 동시에 전달할 때 유용하다.

function introduce(greeting, punctuation) {
    console.log(`${greeting}, ${this.name}${punctuation}`);
}

const user = { name: 'Bob' };

introduce.apply(user, ['Hi', '!']); // "Hi, Bob!"

3. bind:

bind 메소드는 함수를 호출하지 않고, 새로운 함수를 생성하여 this 값을 고정한다. 이 새로운 함수는 나중에 호출할 수 있다.

function showName() {
    console.log(this.name);
}

const user = { name: 'Charlie' };

const boundShowName = showName.bind(user);
boundShowName(); // "Charlie"

• call: 즉시 함수를 호출하며 인자를 개별적으로 전달한다.
• apply: 즉시 함수를 호출하며 인자를 배열로 전달한다.
• bind: 함수를 호출하지 않고 this 값을 고정한 새로운 함수를 반환한다.

4. setTimeout과 setInterval:

• setTimeout: 지정한 시간 후에 함수를 한 번 실행한다.
• setInterval: 지정한 시간 간격으로 함수를 반복 실행한다.

setTimeout(() => {
    console.log("Hello after 2 seconds");
}, 2000);

const intervalId = setInterval(() => {
    console.log("Hello every second");
}, 1000);

// 중지하려면 clearInterval(intervalId) 사용

5. Function.prototype.bind와 화살표 함수:

화살표 함수는 자신만의 this 값을 가지지 않기 때문에 상위 스코프의 this를 유지한다.

const obj = {
    name: 'Diana',
    greet() {
        setTimeout(() => {
            console.log(`Hello, ${this.name}`);
        }, 1000);
    }
};

obj.greet(); // "Hello, Diana" (1초 후)