Bu eğitimde, örnekler yardımıyla JavaScript'in bu anahtar kelimesini öğreneceksiniz.
JavaScript'te thisanahtar kelime, çağrıldığı nesneyi ifade eder.
1. Küresel Kapsam İçinde
Zaman this, tek başına kullanıldığında, thisgenel nesneyi (belirtmektedir windowtarayıcılarda nesne). Örneğin,
let a = this; console.log(a); // Window () this.name = 'Sarah'; console.log(window.name); // Sarah
Burada this.nameda aynısı window.name.
2. bu İç İşlevi
Bir thisişlevde kullanıldığında this, genel nesneyi ifade eder ( windowtarayıcılardaki nesne). Örneğin,
function greet() ( // this inside function // this refers to the global object console.log(this); ) greet(); // Window ()
3. Bu İç Yapıcı İşlevi
JavaScript'te, nesneler oluşturmak için yapıcı işlevler kullanılır. Bir işlev bir yapıcı işlev olarak kullanıldığında, thisiçinde kullanıldığı nesneyi ifade eder. Örneğin,
function Person() ( this.name = 'Jack'; console.log(this); ) let person1 = new Person(); console.log(person1.name);
Çıktı
Kişi (adı: "Jack") Jack
Burada thisperson1 nesnesini ifade eder. Bu yüzden person1.namebize Jack verir.
Not : thisES6 sınıflarıyla birlikte kullanıldığında, içinde kullanıldığı nesneyi ifade eder (yapıcı işlevlerine benzer).
4. bu İç Nesne Yöntemi
Bir thisnesnenin yönteminin içinde kullanıldığında, içinde thisbulunduğu nesneyi ifade eder. Örneğin,
const person = ( name : 'Jack', age: 25, // this inside method // this refers to the object itself greet() ( console.log(this); console.log(this.name); ) ) person.greet();
Çıktı
(isim: "Jack", yaş: 25, selam: ƒ) Jack
Yukarıdaki örnekte, nesneyi thisifade eder person.
5. bu İç İç Fonksiyon
Bir thisiç işleve eriştiğinizde (bir yöntemin içinde), thisglobal nesneyi ifade eder. Örneğin,
const person = ( name : 'Jack', age: 25, // this inside method // this refers to the object itself greet() ( console.log(this); // (name: "Jack", age… ) console.log(this.age); // 25 // inner function function innerFunc() ( // this refers to the global object console.log(this); // Window (… ) console.log(this.age); // undefined ) innerFunc(); ) ) person.greet();
Çıktı
(isim: "Jack", yaş: 25, selamlama: ƒ) 25 Pencere (…) tanımsız
Burada, thisiç innerFunc()belirtir küresel nesne için innerFunc()bir usul içinde.
Bununla birlikte, this.agedışarısı nesneyi innerFunc()ifade eder person.
6. bu İç Ok İşlevi
Ok işlevinin içinde, thisana kapsamı ifade eder. Örneğin,
const greet = () => ( console.log(this); ) greet(); // Window (… )
Ok işlevlerinin kendilerine ait özellikleri yoktur this. Bir thisok işlevinin içinde kullandığınızda this, üst kapsam nesnesine başvurur. Örneğin,
const greet = ( name: 'Jack', // method sayHi () ( let hi = () => console.log(this.name); hi(); ) ) greet.sayHi(); // Jack
Burada işlevin this.nameiçinde nesneye hi()atıfta bulunulmaktadır greet.
undefinedBir yöntem içinde bir işlevi kullanırken sahip olma sorununu çözmek için ok işlevini de kullanabilirsiniz (Örnek 5'te görüldüğü gibi). Örneğin,
const person = ( name : 'Jack', age: 25, // this inside method // this refers to the object itself greet() ( console.log(this); console.log(this.age); // inner function let innerFunc = () => ( // this refers to the global object console.log(this); console.log(this.age); ) innerFunc(); ) ) person.greet();
Çıktı
(isim: "Jack", yaş: 25, selamlama: ƒ) 25 (adı: "Jack", yaş: 25, selam: ƒ) 25
Burada, innerFunc()ok işlevi kullanılarak tanımlanır. thisÜst kapsamından alır . Dolayısıyla 25this.age verir .
Ok işlevi ile birlikte kullanıldığında this, dış kapsamı ifade eder.
7. Sıkı Modlu Bu İç İşlev
Ne zaman thisyüksek düzey moduyla bir fonksiyonu kullanılır, thisolduğu undefined. Örneğin,
'use strict'; this.name = 'Jack'; function greet() ( // this refers to undefined console.log(this); ) greet(); // undefined
Not : thisKatı modda bir işlevin içinde kullanırken, JavaScript Function call () kullanabilirsiniz.
Örneğin,
'use strict'; this.name = 'Jack'; function greet() ( console.log(this.name); ) greet.call(this); // Jack
Geçmek zaman thisile call()fonksiyonu greet()yöntemiyle olarak kabul edilir thisbir nesne (bu durumda global nesne).
