Makale Geçmişi

Bir önceki makalemizde nesne yapılandırırken kullanılan ve daha sonraki konumuzda da yer alacak olan  this  ifadesini biraz incelemek gerekir.  this  (bu), kullanıldığı yere ve fonksiyonun çağırılma şekline göre farklı değer içerir. Örneğin sınıf olarak tanımlanmayan fonksiyonların içinde veya dışında kullanılan  this , global nesneyi işaret eder (global nesnenin referansıdır). Global nesne, web sayfaları içinde kullanılan JavaScript için  window  nesnesidir. Farklı JavaScript uygulama ortamlarında global nesne değişebilir. Bir sınıf veya doğrudan nesne tanımı içinde kullanılan  this  ise önceki sınıf tanımlama makalemizde olduğu gibi oluşturulan nesneye işaret eder. function Sinif() { console.log(this.constructor.name); } console.log(this.constructor.name); Sinif(); var ornek = new Sinif(); Çıktısı: Window Window Sinif Örnekteki  constructor.name , bir nesnenin yapılandırıcısının adını verir. Örnekte bu yolla nesnenin hangi sınıftan türetildiğini öğreniyoruz. Çıktıdan da görüleceği gibi fonksiyon tanımından sonraki  console.log , Window şeklinde bir çıktı veriyor. Bu  this 'in Window sınıfının bir örneği olduğunu bildiriyor. Bu örnek web sayfaları içinde JavaScript programlarken kullandığımız  window  nesnesidir. Sonraki fonksiyonun doğrudan çağırılmasında ise fonksiyon içindeki  console.log(this)  de Window çıktısı veriyor. Ancak yapılandırıcı fonksiyonumuzu  new  operatörü ile çağırdığımızda yani bir nesne oluşturduğumuzda  this , oluşturulan nesneyi ifade ettiği için çıktıya nesnemizin türünü (türetildiği sınıf) belirten  Sinif  metni çıkıyor. this  ifadesi, bir olay fonksiyonunun içinde kullanıldığında olayın atandığı etiketi / nesneyi temsil eder. Örnek: function tiklama() { console.log(this.constructor.name); } document.getElementById("tus1").onclick = tiklama; tus1   id  özelliğine sahip etiketin bir input type button (tuş) olduğunu varsaydığımızda, bu tuş tıklandığında şöyle bir çıktı alırsınız: HTMLInputElement Ancak bunu fonksiyonu doğrudan etiketi tanımladığınız yerdeki  onclick  bildirimine yazarsanız  this  tuşu işaret etmez.  window  nesnesini işaret eder. Örnek: <input type="button" id="tus1" onclick="tiklama()" value="Tıkla" /> <script> function tiklama() { console.log(this.constructor.name); } </script> Çıktısı: Window Böyle bir durumda  onclick="..."  özellik tanımlamasının içinde  this  kullanırsanız bu  this  etiketi işaret eder. Bunu, olay fonksiyonunu etiket özelliği olarak bildirdiğimizde etiketin referansını fonksiyona geçmek için kullanabilirsiniz. <input type="button" id="tus1" onclick="tiklama(this)" value="Tıkla" /> <script> function tiklama(etiket) { console.log(etiket.value); console.log(etiket.constructor.name); } </script> Tuş tıklandığında görülecek çıktı: Tıkla HTMLInputElement Arrow (Ok) fonksiyonları this kullanımını desteklemez. Bu yüzden bir olay dinleyici fonksiyon olarak kullanıldıklarında fonksiyon içindeki this olaya atanan klasik fonksiyon bildirimi gibi olayın sahibi olan etikete değil global nesneye (Window) işaret eder. Örnek: <input type="text" id="ittTest" /> <script> var el = document.getElementById("ittTest"); // Klasik fonksiyon bildirimi ile olay fonksiyonu atama. el.addEventListener("click", function(ev) { console.log("111Olaya atanan fonksiyon içinden this = ", this.constructor.name); }); // Ok fonksiyonu şeklinde olay fonksiyonu atama. el.addEventListener("click", ev => { console.log("Olaya atanan ok fonksiyonu içinden this = ", this.constructor.name); }); </script> Örnekte bir etiketin click olayına bir tane klasik fonksiyon bildirimi ile bir fonksiyon, bir tane de ok fonksiyonu atanmıştır. Etiket tıklandığında atanan olayların her ikisi de ardı ardına çalıştırılacaktır. Click olayı gerçekleştiğinde klasik fonksiyon bildirimi şeklinde tanımlanan fonksiyon içindeki this, ilgili olduğu etikete işaret ettiğinden this.constructor.name ifadesi HTMLInputElement değerini verecek, ok fonksiyonu içinde ise aynı ifade Window değerini döndürecektir. Bu kadar. Eksik veya hata görürseniz lütfen bildirin. JavaScript Fonksiyonları ile İlgili Makaleler: JavaScript Fonksiyonları: Temel Kullanım JavaScript Fonksiyonları: Fonksiyonun Kendini Çağırması (Recursion) JavaScript Fonksiyonları: Fonksiyon İfadeler - Function Expressions JavaScript Fonksiyonları: Kapsanımlar - Closures Javascript Fonksiyonları: Yerinde Çalıştırılan İsimsiz Fonksiyonlar JavaScript Fonksiyonları: Nesne İçinde Fonksiyon - Metotlar JavaScript Fonksiyonları: Nesne Yapılandırıcısı Olarak Fonksiyon Kullanma JavaScript Fonksiyonları: this Kullanımı  (Bu makale) JavaScript Fonksiyonlari: arguments Nesnesi JavaScript Fonksiyonları: rest Parametreleri JavaScript Fonksiyonları: Function Yapılandırıcısı JavaScript Fonksiyonları: getter ve setter Fonksiyonlar JavaScript Fonksiyonları: Arrow (ok) Fonksiyonları JavaScript Fonksiyonları: Üretici Fonksiyonlar - Generator Functions

Bir önceki makalemizde nesne yapılandırırken kullanılan ve daha sonraki konumuzda da yer alacak olan  this  ifadesini biraz incelemek gerekir.  this  (bu), kullanıldığı yere ve fonksiyonun çağırılma şekline göre farklı değer içerir. Örneğin sınıf olarak tanımlanmayan fonksiyonların içinde veya dışında kullanılan  this , global nesneyi işaret eder (global nesnenin referansıdır). Global nesne, web sayfaları içinde kullanılan JavaScript için  window  nesnesidir. Farklı JavaScript uygulama ortamlarında global nesne değişebilir. Bir sınıf veya doğrudan nesne tanımı içinde kullanılan  this  ise önceki sınıf tanımlama makalemizde olduğu gibi oluşturulan nesneye işaret eder. function Sinif() { console.log(this.constructor.name); } console.log(this.constructor.name); Sinif(); var ornek = new Sinif(); Çıktısı: Window Window Sinif Örnekteki  constructor.name , bir nesnenin yapılandırıcısının adını verir. Örnekte bu yolla nesnenin hangi sınıftan türetildiğini öğreniyoruz. Çıktıdan da görüleceği gibi fonksiyon tanımından sonraki  console.log , Window şeklinde bir çıktı veriyor. Bu  this 'in Window sınıfının bir örneği olduğunu bildiriyor. Bu örnek web sayfaları içinde JavaScript programlarken kullandığımız  window  nesnesidir. Sonraki fonksiyonun doğrudan çağırılmasında ise fonksiyon içindeki  console.log(this)  de Window çıktısı veriyor. Ancak yapılandırıcı fonksiyonumuzu  new  operatörü ile çağırdığımızda yani bir nesne oluşturduğumuzda  this , oluşturulan nesneyi ifade ettiği için çıktıya nesnemizin türünü (türetildiği sınıf) belirten  Sinif  metni çıkıyor. this  ifadesi, bir olay fonksiyonunun içinde kullanıldığında olayın atandığı etiketi / nesneyi temsil eder. Örnek: function tiklama() { console.log(this.constructor.name); } document.getElementById("tus1").onclick = tiklama; tus1   id  özelliğine sahip etiketin bir input type button (tuş) olduğunu varsaydığımızda, bu tuş tıklandığında şöyle bir çıktı alırsınız: HTMLInputElement Ancak bunu fonksiyonu doğrudan etiketi tanımladığınız yerdeki  onclick  bildirimine yazarsanız  this  tuşu işaret etmez.  window  nesnesini işaret eder. Örnek: <input type="button" id="tus1" onclick="tiklama()" value="Tıkla" /> <script> function tiklama() { console.log(this.constructor.name); } </script> Çıktısı: Window Böyle bir durumda  onclick="..."  özellik tanımlamasının içinde  this  kullanırsanız bu  this  etiketi işaret eder. Bunu, olay fonksiyonunu etiket özelliği olarak bildirdiğimizde etiketin referansını fonksiyona geçmek için kullanabilirsiniz. <input type="button" id="tus1" onclick="tiklama(this)" value="Tıkla" /> <script> function tiklama(etiket) { console.log(etiket.value); console.log(etiket.constructor.name); } </script> Tuş tıklandığında görülecek çıktı: Tıkla HTMLInputElement JavaScript Fonksiyonları ile İlgili Makaleler: JavaScript Fonksiyonları: Temel Kullanım JavaScript Fonksiyonları: Fonksiyonun Kendini Çağırması (Recursion) JavaScript Fonksiyonları: Fonksiyon İfadeler - Function Expressions JavaScript Fonksiyonları: Kapsanımlar - Closures Javascript Fonksiyonları: Yerinde Çalıştırılan İsimsiz Fonksiyonlar JavaScript Fonksiyonları: Nesne İçinde Fonksiyon - Metotlar JavaScript Fonksiyonları: Nesne Yapılandırıcısı Olarak Fonksiyon Kullanma JavaScript Fonksiyonları: this Kullanımı  (Bu makale) JavaScript Fonksiyonlari: arguments Nesnesi JavaScript Fonksiyonları: rest Parametreleri JavaScript Fonksiyonları: Function Yapılandırıcısı JavaScript Fonksiyonları: getter ve setter Fonksiyonlar JavaScript Fonksiyonları: Arrow (ok) Fonksiyonları JavaScript Fonksiyonları: Üretici Fonksiyonlar - Generator Functions

Bir önceki makalemizde nesne yapılandırırken kullanılan ve daha sonraki konumuzda da yer alacak olan  this  ifadesini biraz incelemek gerekir.  this  (bu), kullanıldığı yere ve fonksiyonun çağırılma şekline göre farklı değer içerir. Örneğin sınıf olarak tanımlanmayan fonksiyonların içinde veya dışında kullanılan  this , global nesneyi işaret eder (global nesnenin referansıdır). Global nesne, web sayfaları içinde kullanılan JavaScript için  window  nesnesidir. Farklı JavaScript uygulama ortamlarında global nesne değişebilir. Bir sınıf veya doğrudan nesne tanımı içinde kullanılan  this  ise önceki sınıf tanımlama makalemizde olduğu gibi oluşturulan nesneye işaret eder. function Sinif() { console.log(this.constructor.name); } console.log(this.constructor.name); Sinif(); var ornek = new Sinif(); Çıktısı: Window Window Sinif Örnekteki  constructor.name , bir nesnenin yapılandırıcısının adını verir. Örnekte bu yolla nesnenin hangi sınıftan türetildiğini öğreniyoruz. Çıktıdan da görüleceği gibi fonksiyon tanımından sonraki  console.log , Window şeklinde bir çıktı veriyor. Bu  this 'in Window sınıfının bir örneği olduğunu bildiriyor. Bu örnek web sayfaları içinde JavaScript programlarken kullandığımız  window  nesnesidir. Sonraki fonksiyonun doğrudan çağırılmasında ise fonksiyon içindeki  console.log(this)  de Window çıktısı veriyor. Ancak yapılandırıcı fonksiyonumuzu  new  operatörü ile çağırdığımızda yani bir nesne oluşturduğumuzda  this , oluşturulan nesneyi ifade ettiği için çıktıya nesnemizin türünü (türetildiği sınıf) belirten  Sinif  metni çıkıyor. this  ifadesi, bir olay fonksiyonunun içinde kullanıldığında olayın atandığı etiketi / nesneyi temsil eder. Örnek: function tiklama() { console.log(this.constructor.name); } document.getElementById("tus1").onclick = tiklama; tus1   id  özelliğine sahip etiketin bir input type button (tuş) olduğunu varsaydığımızda, bu tuş tıklandığında şöyle bir çıktı alırsınız: HTMLInputElement Ancak bunu fonksiyonu doğrudan etiketi tanımladığınız yerdeki  onclick  bildirimine yazarsanız  this  tuşu işaret etmez.  window  nesnesini işaret eder. Örnek: <input type="button" id="tus1" onclick="tiklama()" value="Tıkla" /> <script> function tiklama() { console.log(this.constructor.name); } </script> Çıktısı: Window Böyle bir durumda  onclick="..."  özellik tanımlamasının içinde  this  kullanırsanız bu  this  etiketi işaret eder. Bunu, olay fonksiyonunu etiket özelliği olarak bildirdiğimizde etiketin referansını fonksiyona geçmek için kullanabilirsiniz. <input type="button" id="tus1" onclick="tiklama(this)" value="Tıkla" /> <script> function tiklama(etiket) { console.log(etiket.value); console.log(etiket.constructor.name); } </script> Tuş tıklandığında görülecek çıktı: Tıkla HTMLInputElement JavaScript Fonksiyonları ile İlgili Makaleler: JavaScript Fonksiyonları: Temel Kullanım JavaScript Fonksiyonları: Fonksiyonun Kendini Çağırması (Recursion) JavaScript Fonksiyonları: Fonksiyon İfadeler - Function Expressions JavaScript Fonksiyonları: Kapsanımlar - Closures Javascript Fonksiyonları: Yerinde Çalıştırılan İsimsiz Fonksiyonlar JavaScript Fonksiyonları: Nesne İçinde Fonksiyon - Metotlar JavaScript Fonksiyonları: Nesne Yapılandırıcısı Olarak Fonksiyon Kullanma JavaScript Fonksiyonları: this Kullanımı  (Bu makale) JavaScript Fonksiyonlari: arguments Nesnesi JavaScript Fonksiyonları: rest Parametreleri JavaScript Fonksiyonları: Function Sınıfı JavaScript Fonksiyonları: getter ve setter Fonksiyonlar JavaScript Fonksiyonları: Arrow (ok) Fonksiyonları JavaScript Fonksiyonları: Üretici Fonksiyonlar - Generator Functions

Bir önceki makalemizde nesne yapılandırırken kullanılan ve daha sonraki konumuzda da yer alacak olan  this  ifadesini biraz incelemek gerekir.  this  (bu), kullanıldığı yere ve fonksiyonun çağırılma şekline göre farklı değer içerir. Örneğin sınıf olarak tanımlanmayan fonksiyonların içinde veya dışında kullanılan  this , global nesneyi işaret eder (global nesnenin referansıdır). Global nesne, web sayfaları içinde kullanılan JavaScript için  window  nesnesidir. Farklı JavaScript uygulama ortamlarında global nesne değişebilir. Bir sınıf veya doğrudan nesne tanımı içinde kullanılan  this  ise önceki sınıf tanımlama makalemizde olduğu gibi oluşturulan nesneye işaret eder. function Sinif() { console.log(this.constructor.name); } console.log(this.constructor.name); Sinif(); var ornek = new Sinif(); Çıktısı: Window Window Sinif Örnekteki  constructor.name , bir nesnenin yapılandırıcısının adını verir. Örnekte bu yolla nesnenin hangi sınıftan türetildiğini öğreniyoruz. Çıktıdan da görüleceği gibi fonksiyon tanımından sonraki  console.log , Window şeklinde bir çıktı veriyor. Bu  this 'in Window sınıfının bir örneği olduğunu bildiriyor. Bu örnek web sayfaları içinde JavaScript programlarken kullandığımız  window  nesnesidir. Sonraki fonksiyonun doğrudan çağırılmasında ise fonksiyon içindeki  console.log(this)  de Window çıktısı veriyor. Ancak yapılandırıcı fonksiyonumuzu  new  operatörü ile çağırdığımızda yani bir nesne oluşturduğumuzda  this , oluşturulan nesneyi ifade ettiği için çıktıya nesnemizin türünü (türetildiği sınıf) belirten  Sinif  metni çıkıyor. this  ifadesi, bir olay fonksiyonunun içinde kullanıldığında olayın atandığı etiketi / nesneyi temsil eder. Örnek: function tiklama() { console.log(this.constructor.name); } document.getElementById("tus1").onclick = tiklama; tus1   id  özelliğine sahip etiketin bir input type button (tuş) olduğunu varsaydığımızda, bu tuş tıklandığında şöyle bir çıktı alırsınız: HTMLInputElement Ancak bunu fonksiyonu doğrudan etiketi tanımladığınız yerdeki  onclick  bildirimine yazarsanız  this  tuşu işaret etmez.  window  nesnesini işaret eder. Örnek: <input type="button" id="tus1" onclick="tiklama()" value="Tıkla" /> <script> function tiklama() { console.log(this.constructor.name); } </script> Çıktısı: Window Böyle bir durumda  onclick="..."  özellik tanımlamasının içinde  this  kullanırsanız bu  this  etiketi işaret eder. Bunu, olay fonksiyonunu etiket özelliği olarak bildirdiğimizde etiketin referansını fonksiyona geçmek için kullanabilirsiniz. <input type="button" id="tus1" onclick="tiklama(this)" value="Tıkla" /> <script> function tiklama(etiket) { console.log(etiket.value); console.log(etiket.constructor.name); } </script> Tuş tıklandığında görülecek çıktı: Tıkla HTMLInputElement JavaScript Fonksiyonları ile İlgili Makaleler: JavaScript Fonksiyonları: Temel Kullanım JavaScript Fonksiyonları: Fonksiyonun Kendini Çağırması (Recursion) JavaScript Foksiyonları: Fonksiyon İfadeler - Function Expressions JavaScript Fonksiyonları: Kapsanımlar - Closures Javascript Fonksiyonları: Yerinde Çalıştırılan İsimsiz Fonksiyonlar JavaScript Fonksiyonları: Nesne İçinde Fonksiyon - Metotlar JavaScript Fonksiyonları: Nesne Yapılandırıcısı Olarak Fonksiyon Kullanma JavaScript Fonksiyonları: this Kullanımı  (Bu makale) JavaScript Fonksiyonlari: arguments Nesnesi JavaScript Fonksiyonları: rest Parametreleri JavaScript Fonksiyonları: Function Sınıfı JavaScript Fonksiyonları: getter ve setter Fonksiyonlar JavaScript Fonksiyonları: Arrow (ok) Fonksiyonları JavaScript Fonksiyonları: Üretici Fonksiyonlar - Generator Functions