Sobes.tech
Junior

JavaScript'te bir fonksiyonun bağlamını nasıl değiştirirsiniz?

sobes.tech yapay zeka

AI'dan gelen yanıt

JavaScript'te, bir fonksiyonun çalışma bağlamı (this değeri) birkaç farklı şekilde değiştirilebilir:

  1. call(): Bir fonksiyonu, belirli bir this değeri ve virgüllerle ayrılmış argümanlar ile çalıştırır.

    // function.call(thisArg, arg1, arg2, ...)
    function greet(name) {
      console.log(`Merhaba, ${name}! Benim adım ${this.type}`);
    }
    
    const obj = { type: 'nesne' };
    
    greet.call(obj, 'Ali'); // Merhaba, Ali! Benim adım nesne
    
  2. apply(): Bir fonksiyonu, belirli bir this değeri ve dizi veya dizi-benzeri nesne olarak geçirilen argümanlar ile çalıştırır.

    // function.apply(thisArg, [argsArray])
    function sum(a, b) {
      console.log(`${this.name}: ${a + b}`);
    }
    
    const context = { name: 'Hesaplayıcı' };
    const numbers = [5, 10];
    
    sum.apply(context, numbers); // Hesaplayıcı: 15
    
  3. bind(): Belirli bir this değeri ile "bağlanmış" yeni bir fonksiyon oluşturur. Orijinal fonksiyon hemen çalıştırılmaz.

    // function.bind(thisArg, arg1, arg2, ...)
    const user = { name: 'Bob' };
    
    function sayHello() {
      console.log(`Benim adım ${this.name}`);
    }
    
    const boundSayHello = sayHello.bind(user);
    
    boundSayHello(); // Benim adım Bob
    
  4. Ok fonksiyonları (=>): Ok fonksiyonların kendi this bağlamı yoktur. Lexikal ortamdan (this) yakalarlar (tanımlandıkları üst scope'tan).

    class MyClass {
      constructor() {
        this.value = 'sınıf değeri';
        // Ok fonksiyon sınıf bağlamını korur
        this.logValue = () => {
          console.log(this.value);
        };
      }
    }
    
    const instance = new MyClass();
    const method = instance.logValue;
    
    method(); // sınıf değeri (bağlam korunur)
    
    // Bind olmadan normal fonksiyonla karşılaştır
    class BaşkaSınıf {
        constructor() {
            this.value = 'başka değer';
            this.logValue = function() {
                console.log(this.value); // 'this' window veya strict modda undefined olur
            };
        }
    }
    
    const başkaInstance = new BaşkaSınıf();
    const başkaMethod = başkaInstance.logValue;
    
    başkaMethod(); // undefined (bağlam, fonksiyon çağrısı sırasında kaybolur)