JS Eğitimi

ANA SAYFA JS Giriş JS Nereye JS Çıktı JS İfadeleri JS Sözdizimi JS Yorumları JS Değişkenleri JS Let JS Sabiti JS Operatörleri JS Aritmetiği JS Ataması JS Veri Türleri JS Fonksiyonları JS Nesneleri JS Etkinlikleri JS Dizeleri JS Dize Yöntemleri JS Dizisi Arama JS Dize Şablonları JS Numaraları JS Numarası Yöntemleri JS Dizileri JS Dizi Yöntemleri JS Dizi Sıralaması JS Dizi Yineleme JS Dizi Sabiti JS Tarihleri JS Tarih Formatları JS Tarih Alma Yöntemleri JS Tarih Ayar Yöntemleri JS Matematik JS Rastgele JS Booleanları JS Karşılaştırmaları JS Koşulları JS Anahtarı JS Döngüsü İçin JS Döngüsü İçin JS Döngüsü JS Döngüsü JS Arası JS Yinelenebilirler JS Setleri JS Haritaları JS Türü JS Tipi Dönüşüm JS Bitsel JS Normal İfade JS Hataları JS Kapsamı JS Kaldırma JS Sıkı Modu Bu Anahtar Kelimeyi JS JS Ok İşlevi JS Sınıfları JS JSON JS Hata Ayıklama JS Stil Kılavuzu JS En İyi Uygulamaları JS Hataları JS Performansı JS Ayrılmış Kelimeler

JS Sürümleri

JS Sürümleri JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE / Kenar JS Geçmişi

JS Nesneleri

Nesne Tanımları Nesne Özellikleri Nesne Yöntemleri Nesne Görüntüleme Nesne Erişimcileri Nesne Oluşturucuları Nesne Prototipleri Nesne Yinelenebilirler Nesne Kümeleri Nesne Haritaları Nesne Referansı

JS Fonksiyonları

Fonksiyon Tanımları Fonksiyon Parametreleri Fonksiyon Çağırma İşlev Çağrısı İşlev Uygula Fonksiyon Kapanışları

JS Sınıfları

Sınıf Tanıtımı Sınıf Kalıtımı Sınıf Statik

JS Zaman uyumsuz

JS Geri Aramaları JS Asenkron JS Sözleri JS Zaman uyumsuz/Bekliyor

JS HTML DOM'si

DOM Tanıtımı DOM Yöntemleri DOM Belgesi DOM Öğeleri DOM HTML'si DOM Formları DOM CSS'si DOM Animasyonları DOM Olayları DOM Olay Dinleyicisi DOM Gezinme DOM Düğümleri DOM Koleksiyonları DOM Düğüm Listeleri

JS Tarayıcı Malzeme Listesi

JS Penceresi JS Ekranı JS Konumu JS Geçmişi JS Navigatörü JS Açılır Pencere Uyarısı JS Zamanlaması JS Çerezleri

JS Web API'leri

Web API'sine Giriş Web Formları API'sı Web Geçmişi API'si Web Depolama API'sı Web Çalışanı API'si Web Getirme API'si Web Coğrafi Konum API'sı

JS AJAX

AJAX'a Giriş AJAX XMLHttp AJAX İsteği AJAX Yanıtı AJAX XML Dosyası AJAX PHP AJAX ASP AJAX Veritabanı AJAX Uygulamaları AJAX Örnekleri

JS JSON

JSON'a Giriş JSON Sözdizimi JSON'a karşı XML JSON Veri Türleri JSON Ayrıştırma JSON Stringify JSON Nesneleri JSON Dizileri JSON Sunucusu JSON PHP JSON HTML'si JSON JSONP

JS ve jQuery

jQuery Seçiciler jQuery HTML'si jQuery CSS'si jQuery DOM'si

JS Grafikleri

JS Grafikleri JS Tuval JS Konusu JS Chart.js JS Google Grafiği JS D3.js

JS Örnekleri

JS Örnekleri JS HTML DOM'si JS HTML Girişi JS HTML Nesneleri JS HTML Olayları JS Tarayıcı JS Editörü JS Alıştırmaları JS Testi JS Sertifikası

JS Referansları

JavaScript Nesneleri HTML DOM Nesneleri


JavaScript Sınıfları

ES6 olarak da bilinen ECMAScript 2015, JavaScript Sınıflarını tanıttı.

JavaScript Sınıfları, JavaScript Nesneleri için şablonlardır.

JavaScript Sınıfı Sözdizimi

classBir sınıf oluşturmak için anahtar kelimeyi kullanın .

Her zaman adında bir yöntem ekleyin constructor():

Sözdizimi

class ClassName {
  constructor() { ... }
}

Örnek

class Car {
  constructor(name, year) {
    this.name = name;
    this.year = year;
  }
}

Yukarıdaki örnek, "Car" adında bir sınıf oluşturur.

Sınıfın iki başlangıç ​​özelliği vardır: "name" ve "year".

JavaScript sınıfı bir nesne değildir .

JavaScript nesneleri için bir şablondur .


Sınıf Kullanmak

Bir sınıfınız olduğunda, nesneleri oluşturmak için sınıfı kullanabilirsiniz:

Örnek

let myCar1 = new Car("Ford", 2014);
let myCar2 = new Car("Audi", 2019);

Yukarıdaki örnek, iki Car nesnesi oluşturmak için Car sınıfını kullanır .

Yeni bir nesne oluşturulduğunda yapıcı yöntemi otomatik olarak çağrılır.


Yapıcı Yöntemi

Yapıcı yöntemi özel bir yöntemdir:

  • Tam adı "yapıcı" olmalıdır
  • Yeni bir nesne oluşturulduğunda otomatik olarak yürütülür.
  • Nesne özelliklerini başlatmak için kullanılır

Bir yapıcı yöntemi tanımlamazsanız, JavaScript boş bir yapıcı yöntemi ekler.


Sınıf Yöntemleri

Sınıf yöntemleri, nesne yöntemleriyle aynı sözdizimi ile oluşturulur.

classBir sınıf oluşturmak için anahtar kelimeyi kullanın .

constructor()Her zaman bir yöntem ekleyin .

Ardından istediğiniz sayıda yöntem ekleyin.

Sözdizimi

class ClassName {
  constructor() { ... }
  method_1() { ... }
  method_2() { ... }
  method_3() { ... }
}

Araba yaşını döndüren "yaş" adlı bir Sınıf yöntemi oluşturun:

Örnek

class Car {
  constructor(name, year) {
    this.name = name;
    this.year = year;
  }
  age() {
    let date = new Date();
    return date.getFullYear() - this.year;
  }
}

let myCar = new Car("Ford", 2014);
document.getElementById("demo").innerHTML =
"My car is " + myCar.age() + " years old.";

Parametreleri Class yöntemlerine gönderebilirsiniz:

Örnek

class Car {
  constructor(name, year) {
    this.name = name;
    this.year = year;
  }
  age(x) {
    return x - this.year;
  }
}

let date = new Date();
let year = date.getFullYear();

let myCar = new Car("Ford", 2014);
document.getElementById("demo").innerHTML=
"My car is " + myCar.age(year) + " years old.";


Tarayıcı Desteği

Aşağıdaki tablo, JavaScript'te Sınıflar için tam desteğe sahip ilk tarayıcı sürümünü tanımlar:

Chrome 49 Edge 12 Firefox 45 Safari 9 Opera 36
Mar, 2016 Jul, 2015 Mar, 2016 Oct, 2015 Mar, 2016


"katı kullan"

Sınıflardaki sözdizimi "katı modda" yazılmalıdır.

"Sıkı mod" kurallarına uymazsanız bir hata alırsınız.

Örnek

"Sıkı modda", bir değişkeni bildirmeden kullanırsanız bir hata alırsınız:

class Car {
  constructor(name, year) {
    this.name = name;
    this.year = year;
  }
  age() {
    // date = new Date();  // This will not work
    let date = new Date(); // This will work
    return date.getFullYear() - this.year;
  }
}

"Sıkı mod" hakkında daha fazla bilgiyi şurada öğrenin: JS Sıkı Modu .