blog posts

JavaScript dili özellikle web alanında en güçlü ve pratik programlama dillerinden biridir ve hem kullanıcı hem de sunucu tarafında kullanılabilir. Aslında JavaScript, web sayfalarıyla daha iyi etkileşime olanak tanır ve web sayfalarının temel görünümünü ve yapısını oluşturan HTML ve CSS ile birlikte, JavaScript kullanarak web sayfalarının etkileşimini denetleyebilirsiniz. JavaScript dilini öğrenerek bizi takip edin .

Bu dili kullanarak web sayfalarını statik moddan çıkarıp dinamik sayfalara sahip olabilirsiniz. Sunucu tarafıyla bağlantı kurulmadan ve ona istek gönderilmeden, kullanıcının faaliyetlerine göre site üzerinde değişiklik yapılması anlamına gelir.

Bu makalede JavaScript dilinin öğretilmesinin yanı sıra , bu dilin ve uygulamasının web sayfalarının daha iyi ve etkileşimli tasarımında nasıl kullanılacağı da tartışılacaktır. Web alanında ve özellikle kullanıcı tarafında programlama yapan kişiler için bu dili öğrenmek oldukça gereklidir. Web sayfası tasarımı alanında bu dil için güçlü ve ünlü kütüphaneler ve çerçeveler bulunduğundan, bu dili öğrenmek yeni teknolojilerle çalışmak ve daha çekici sayfalar tasarlamak için ellerinizi açabilir.

 

JavaScript’in kullanım alanları nelerdir?

Bahsettiğim gibi JavaScript dili oldukça kullanışlı ve güçlüdür. Burada bu dilin programlama dünyasındaki en önemli kullanımlarından bazılarını sunacağım.

Etkileşimli ve dinamik web sayfalarının tasarlanması

Web alanındaki JavaScript’i ve kütüphanelerini ve çerçevelerini kullanarak her türlü şeyi yapabilirsiniz. Kullanıcının tıklamasıyla sitenin bir bölümünü tüm site olarak değiştirebilir veya bir animasyon çalıştırabilirsiniz. Site adresini değiştirmeden veya siteyi yeniden yüklemeden dahili bilgilerini ve daha birçok şeyi değiştirebilirsiniz.

Web uygulama tasarımı

React, angular ve vue gibi yeni kütüphane ve çerçevelerin varlığıyla JavaScript dilini kullanarak mobil uygulamalar yazmak mümkün hale geldi. Elbette bu kütüphaneler ve çerçeveler yerel kodlama (Android ve Swift) kadar kullanışlı olmayabilir ancak iyi bir gelecekleri var.

Sunucu tarafı uygulamaların geliştirilmesi

Bu olasılık aynı zamanda JavaScript tarafından, nodejs dahil olmak üzere sunucu tarafı kitaplıklarını ve çerçevelerini kullanarak web sayfalarının sunucu tarafını tasarlamanız için de sağlanmıştır.

Web oyunlarının tasarımı ve geliştirilmesi

Web’de bir tarayıcı aracılığıyla oynayabileceğiniz oyunlar görürseniz, bu oyunlar güçlü JavaScript dili tarafından yazılmıştır.

JavaScript programlama dilinin dünyası çok büyük ve bu dilin de kendine has karmaşıklıkları var. Bu dili öğrenmek çok fazla pratik, çaba ve çalışma gerektirir.

Bu makalenin amaçlarından biri web sayfalarını tasarlarken JavaScript dilinin nasıl kullanılacağını öğretmek olduğundan, eğitime ilk olarak web sayfalarında ve HTML’de JavaScript dilinin nasıl kullanılacağıyla başlayacağım.

HTML ve web sayfalarına aşina iseniz, script etiketini görmüş olmalısınız. Bu etiket, istediğiniz sayfalar için JavaScript kodunuzu yazmanıza olanak tanır. Aslında bu etiketin içinde tanımlanan her kod JavaScript dilindedir. Aşağıdaki kod örneğinde tarayıcı konsolunda console.log komutunu kullanarak My First Javascript deyimini görebilirsiniz.

<script>
       console.log("İlk JavaScript'im")
</script>

Tarayıcının konsol kısmına gitmek için önce tarayıcının içindeki F12 tuşuna basarak tarayıcının alt kısmında bir sayfa açın, ardından mevcut sekmeler arasından konsol sekmesini bulun ve üzerine tıklayın. Eğer elinizde yukarıdaki kodun bulunduğu bir html dosyanız varsa sayfayı yeniden yükledikten sonra konsol kısmında istediğiniz ifadeyi görebilirsiniz.

Her sayfada javascript kodları tanımlayıp kullanmanın yanı sıra, tüm kodları ayrı bir javascript dosyası içerisine yazabilir ve daha sonra html kodu içerisinde dosyaların adreslerini tanımlayabilirsiniz. Bu dosyalara harici JavaScript dosyaları denir.

“JavaScript dosyasının uzantısı js’dir.”

JavaScript dosyası:

işlev işlevim() {
    console.log("İlk JavaScript'im")
}

Html dosyasının içinde:

<script src="myScript.js"></script>

Harici JavaScript dosyalarını kullanmanın avantajlarından biri, bir html dosyası içinde birden fazla JavaScript dosyası tanımlama olanağıdır.

Ayrıca diğer paket ve kütüphanelerin JavaScript dosyalarına da aynı şekilde ve bu tanımla erişebilirsiniz.

JavaScript görüntüleme ve çıktı türleri:

Tüm programlama dillerinde olduğu gibi özel bir komut kullanarak program değişkenlerinin değerlerini yazdırabilir veya programın herhangi bir yerindeki çıktıyı görüntüleyebilirsiniz. JavaScript’te bu komut aşağıdaki gibidir:

console.log("İlk JavaScript'im")

console.log’un içine farklı değişkenler yazabilir ve bunları tarayıcı konsolunda görebilirsiniz. console.log girişlerinin dize olması gerektiğinden emin olun.

JavaScript programlama diline özel olan yukarıdaki komuta ek olarak, html’de JavaScript kullandığınızda html içinde istediğiniz çıktıyı da görüntüleyebilirsiniz. Bunun için innerHTML komutunu kullanmanız gerekmektedir. Bu komutu kullanarak javascript’inizin çıktı değerini bir html öğesinin içinde görüntüleyebilirsiniz. Aşağıdaki örnek html dosyasına dikkat edin.

Bu örnekte <p> etiketinin içerisine tarayıcı ve html sayfası açıldıktan sonra 11 sayısına dönüşen 5+6 değeri yerleştirilmiştir. Komutun ilk bölümünde, yani innerHTML’den önce, istenen öğe önce ID’si kullanılarak seçilir ve ardından istenen değer, html’sinin içine yerleştirilir.

<!DOCTYPEhtml>
<html>
<gövde>

<h1>İlk Web Sayfam</h1>
<p>İlk Paragrafım</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 5 + 6;
</script>

</body>
</html>

Ayrıca bir diğer yöntem ise uyarı oluşturmaktır. Yürütüldüğünde tarayıcıda bir hata mesajı görüntüleyen bu seçenek, JavaScript çıktısını görüntülemenin başka bir kolay yoludur.

Bu komut iki şekilde kullanılabilir:

uyarı('JS')
window.alert('JS')

Bu bölümde, JavaScript’te olası çıktı türlerini ve değeri JavaScript aracılığıyla bir html öğesinin içine yerleştirmeyi gördük.

JavaScript’te yorum yapmak için // komutunu kullanmanız yeterlidir.

var x = 5; // x'i tanımlayalım, 5 değerini verelim

Aynı anda birden fazla satıra yorum yapmak istiyorsanız aralarına /* */ koyun.

/*
Aşağıdaki kod değişecek
kimliğe sahip başlık = "myH"
ve kimliği = "myP" olan paragraf
web sayfamda:
*/
document.getElementById("myH").innerHTML = "İlk Sayfam";
document.getElementById("myP").innerHTML = "İlk paragrafım.";

Bir sonraki bölümde JavaScript’teki değişkenlerden ve türlerinden bahsedeceğim.

JavaScript’teki değişkenler:

Diğer programlama dilleri gibi JavaScript dilinin de çeşitli tanımlanabilir değişkenleri vardır. JavaScript’te değişkenler üç şekilde tanımlanabilir.

• İlk tür değişkenlerin var anahtar sözcüğü kullanılarak tanımlanmasıdır.
• İkinci tür ise değişkenlerin let anahtar sözcüğü kullanılarak tanımlanmasıdır.
• Son tür de const’tır.

Değişkenleri tanımlamak için hem var hem de let kullanılır, ancak bu iki tür değişken tanımı arasındaki temel farklardan biri, değişkene erişim şeklidir. var tipinde bir değişken tanımlarken, kodun tamamında ona erişebileceksiniz, ancak let tipi tanımı durumunda, ona yalnızca onu tanımladığınız blokta erişilebilir ({} durumunda) yani yalnızca {} içinde kullanılabilir). Ona sahip olacaksınız.

Let türünde bir değişken tanımlarsanız ancak değişken tanımlama satırına ulaşmadan önce onu çağırırsanız, bir hata alırsınız ve bu size değişken yok hatası verir. Ancak aynı şeyi var türünde bir değişken tanımlayarak yaparsanız, bu size yalnızca tanımsız çıktıyı verecektir, bu da istenen değişkenin tanımlanmadığı anlamına gelir ve bu, ikisi arasındaki değişken tanımı arasındaki başka bir farktır.

Bu ikisi arasındaki diğer bir fark ise, bir değişkene aynı değeri iki kez verirseniz ve var kullandıysanız sorun olmaz ve her zaman son değeri değişkenin yeni değeri olarak kabul eder, ancak let kullanırsanız, size yinelenen bir tanım hatası verir. Bu problem, aynı isimdeki değişkenlerin tanımlanmamasını kontrol etmek için var’a göre bir avantaj olabilir.

Programda kullanılan sabit değerler için de const tipinin değişken tanımı kullanılmaktadır. Değişken bu tip değerde olduğunda program içerisinde değerinin değiştirilmesi mümkün değildir. Genellikle bu türdeki değişkenler büyük harflerle görüntülenir.

mesaj atalım;
var mesajı;
const MESSAGE = 'Merhaba'

Let ve var arasındaki farkı anlamak için aşağıdaki örneği deneyin:

var foo = "Foo"; // global kapsamlı
let bar = "Çubuk"; // global kapsamlı

console.log(window.foo); // Foo
console.log(pencere.bar); // Tanımsız

Var ve let’in başka bir örneği:

Let kullanma

işlev çalıştırma() {
    var foo = "Foo";
    let bar = "Çubuk";
  
    console.log(foo, bar);
  
    {
      let baz = "Bazz";
      console.log(baz);
    }
  
    console.log(baz); // Referans Hatası
  }
  
  koşmak();

Var kullanma

var işlevler = [];
// 3 fonksiyon oluşturalım
for (var i = 0; i < 3; i++) {
  // ve bunları işlevlerde saklıyoruz
  işlevler[i] = işlev() {
    // her biri kendi değerini kaydetmelidir.
    console.log("Değerim: " + i);
  };
}
for (var j = 0; j < 3; j++) {
  // ve şimdi görmek için her birini çalıştıralım
  işlevler[j]();
}

JavaScript’te birden fazla değişkeni aynı anda farklı stillerde tanımlayabilirsiniz. Bunları virgülle ayırıp arkamda bir satırda tanımlayabileceğiniz gibi, her birini ayrı bir satırda ve ile de tanımlayabilirsiniz; Sonunda bunları birbirinden ayırın (zorunlu değil) veya her birini ayrı bir satıra yazın, ancak her satırda virgülle ayırın.

Değişken tanım modellerinin türlerini aşağıda görebilirsiniz, bu tamamen zevklidir ve nasıl kodladığınıza bağlıdır:

let kullanıcı = 'John', yaş = 25, mesaj = 'Merhaba';

let kullanıcı = 'John';
yaş = 25 olsun;
let mesaj = 'Merhaba';

kullanıcı = 'John' olsun,
  yaş = 25,
  mesaj = 'Merhaba';

Const kullanımına bir örnek:

const COLOR_RED = "#F00";

COLOR_RED = '#000'; // hata, sabit yeniden atanamıyor!

JavaScript’teki değişken adları üç şekilde tanımlanabilir:

• İngilizce alfabeyle başlayın.
• $ ile başlayın.
• ile başla _

var x = 10
var $param = 5;
var _lastName = "Johnson";

JavaScript’te değişkenlerin nasıl tanımlanacağından sonra JavaScript’teki veri türlerine geliyoruz. JavaScript’te aşağıdaki türlerdeki verileri tanımlayabilirsiniz:

• Sayısal
• alan
• Bolín
• nesne
• sıralamak

Sayısal veriler, adından da anlaşılacağı üzere pozitif ve negatif, ondalık ve tamsayı değerleri alan verilerdir.

String tipi veriler “” arasında tanımlanır ve harf, sembol ve sayılardan oluşan ifadeler içerir.

Boolean verileri doğru ve yanlış olmak üzere iki değer içerir. Bu tür veriler koşullu komutlarda çok faydalıdır.

Nesne türü verileri anahtar:değer olarak tanımlanır, yani her değer için istenen değerlere ulaşabileceğiniz belirli bir anahtar vardır. Nesneler JavaScript’te en çok kullanılan öğeler arasındadır.

Dizi verileri aynı zamanda bir değişkende birden fazla değişkeni tanımlamak için de kullanılır. Bir dizi içinde her türlü sayısal, dize, boolean, nesne ve hatta dizi değişkenini tanımlayabilirsiniz. Bu tür veriler de oldukça faydalıdır.

Aşağıdaki örnekte veri türlerinin bir örneğini görebilirsiniz:

var uzunluğu = 16; // Sayı
var lastName = "Johnson"; // Sicim
var x = {firstName:"John", lastName:"Doe"}; // Nesne
var arabalar = ["Saab", "Volvo", "BMW"]; // Sıralamak
var bool = doğru // Boolean
var x1 = 34,00; // Ondalık sayılarla yazılır
var x2 = 34; // Ondalık sayılar olmadan yazılır

Tanımlanan değişkenin tipini bilmiyorsanız, tipini komut tipini kullanarak öğrenebilirsiniz.

typeof 0 // "sayı"yı döndürür
typeof 314 // "sayı"yı döndürür
typeof 3.14 // "sayı"yı döndürür
typeof (3) // "sayı"yı döndürür
typeof (3 + 4) // "sayı"yı döndürür
typeof "" // "string" değerini döndürür
typeof "John" // "string" değerini döndürür
typeof "John Doe" // "string" değerini döndürür

String ve sayısal verilerle ilgili dikkat edilmesi gereken nokta, operatörleri kullandığınızda (bunları daha sonra açıklayacağım), sayı ve dizelerden oluşan iki veri türünü aynı cinsiyette olmadığı sürece ekleyemez veya çıkaramazsınız.

Tanımlanmamış veri adı verilen başka bir veri türü daha vardır. Bir değişkeni değer olmadan tanımladığınızda, siz ona bir değer atayıp onu çağırana kadar tanımsız değerini döndürür. Dikkat edin unDefinition değerini alamıyorsanız değer değişken tarafından alınır.

var araba; // Değer tanımsız, tür tanımsız

Bir değişkenin boş olmasını istiyorsanız ancak türü değişmediyse değerini null olarak ayarlayabilirsiniz. Bu durumda değişken tanımlanır ancak değeri null olur. (Bu eşyanın değerine sahip olmamaktan farklıdır)

var kişi = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
kişi = boş; // Şimdi değer boş ama tür hala bir nesne

Aslında şöyle:

Veri türleri farklıdır ancak her ikisinin de değeri sıfırdır, yani boştur. == ve === arasındaki fark hakkında daha fazla şey söyleyeceğim.

türü tanımsız // tanımsız
typeof null // nesne

null === tanımsız // yanlış
null == tanımsız // doğru

Bir dizi değişkeni için komut türünü kullanırsanız nesne türünü döndürür. Bunun nedeni, JavaScript’te dizilerin aslında bir tür nesne olmasıdır. ”

JavaScript’teki operatörler:

Tüm programlama dilleri gibi JavaScript programlama dilinde de çeşitli matematiksel, mantıksal, karşılaştırmalı vb. operatörler bulunmaktadır.

Matematiksel operatörler:

Bu operatörler isimlerinden de anlaşılabileceği gibi temel matematiksel işlemlerle ilgilidir. Bu operatörleri aşağıdaki tabloda görebilirsiniz.

Matematiksel operatör örnekleri:

var x = 5;
değişken y = 2;
var z = x + y;
var z = x - y;
var z = x * y;
var z = x / y;
var z = x %y;
x++;
var z = x;
X--;
var z = x;
var z = x ** 2;

Matematiksel operatörlerde işlemleri gerçekleştirme önceliği matematikteki öncelikleriyle aynıdır.

Başlatma operatörleri:

Bu operatörlere bir örnek:

var x = 10;
x += 5; // x=x+5
x-= 5; // x=x-5
x *= 5; // x=x*5
x /= 5; // x=x/5
x %= 5; // x=x%5

Karşılaştırma operatörleri:

Mantıksal operatörler:

Üçlü operatör:

Koşullu komutlara benzer şekilde çalışan bu operatör ? kullanıldı. Bu operatörde önce koşul, sonra ? sembolü yazılır? Koşul doğruysa değer1 değeri, aksi durumda değer2 değeri yerleştirilir.

değişkenadı = (koşul) ? değer1:değer2

Örnek:

var oylanabilir = (yaş < 18) ? "Çok genç": "Yeterince yaşlı";

Bu örnekte, yaş 18’den küçükse ilk ifade yani Çok genç, oylanabilir değişken olarak alınacaktır, aksi takdirde Yeterince Yaşlı ifadesini alacaktır.

JavaScript eğitimindeki işlevler

Fonksiyonlar programlama dillerinde en çok kullanılan öğelerden biridir. Bir işlemi gerçekleştiren bir kod parçanız olduğunu ve bu kod parçasını programınızın farklı bölümlerinde kullandığınızı düşünün. Bunun bir yolu bu kod parçasını her seferinde programa koymak, bu da kodunuz için gereksiz hacim yaratabilir, diğer bir yol ise fonksiyonları kullanmaktır.

Tek satır kodla ve istediğiniz fonksiyonu çağırarak istediğiniz işlemi gerçekleştiren bir fonksiyona sahip olabilir ve bunu programınızın herhangi bir yerinde kullanabilirsiniz.

Ayrıca fonksiyonlar farklı girdiler alabilir, bu da programınızın farklı bölümlerinde farklı girdilerle farklı çıktılar elde etmenizi sağlar. Bir fonksiyonu tanımlamak için aşağıdakileri yapabilirsiniz.

Bir işlevin tanımlandığını belirtmek için işlev adlı bir anahtar kelime. Daha sonra fonksiyonun adını ve parantez içinde istenilen fonksiyon girişi alıyorsa, giriş parametrelerini, aksi halde boş bırakabilirsiniz.

Son olarak istenilen fonksiyon size bir çıktı veriyorsa return deyimini kullanabilirsiniz. Karşılığında bir değer veya liste döndürebilirsiniz.

fonksiyon adı(parametre1, parametre2, parametre3) {
    //çalıştırılacak kod
}
  
function işlevim(p1, p2) {
    p1 * p2'yi döndür; // Fonksiyon p1 ve p2'nin çarpımını döndürür
}

Html sayfalarında javascript işlevlerinin kullanımına bir örnek. Aşağıdaki örnekte Fahrenheit’i Celsius’a çevirecek bir fonksiyon yazılmıştır. İstenilen fonksiyona Fahrenheit cinsinden bir giriş verilir ve ardından Celsius çıktısını size döndürür ve son olarak değeri istenen komut kullanılarak Html sayfasına yerleştirilir.

fonksiyon -Santigrat(fahrenheit) {
    dönüş (5/9) * (fahrenheit-32);
  }
  document.getElementById("demo").innerHTML = toCelsius(77);

Fonksiyonlarda kullanılan değişkenlerde yerel ve global olmak üzere iki tür değişkenimiz vardır. Yerel değişkenler yalnızca istenilen fonksiyonda tanımlanır ve onun dışında fonksiyonun içinden farklı bir değere sahip olur veya tanımlanmasa bile tanımlanmaz. Global değişkenlere fonksiyonun içinden ve dışından erişilebilir ve eğer değeri fonksiyonun içinde değişirse, bu onun global değerini de etkileyecektir.

// buradaki kod arabaAdı KULLANILAMAZ

işlev işlevim() {
    var arabaAdı = "Volvo";
    // buradaki kod arabaAdı'nı kullanabilir
  }
  
  // buradaki kod arabaAdı KULLANILAMAZ

Eğer bir fonksiyonun çıktısını bir string veya sayısal değer içerisinde kullanmak istiyorsanız, istediğiniz fonksiyonun çıktısını bir değişken içerisinde saklayabilir ve daha sonra bu değişkeni programda kullanılan yerlerde kullanabilirsiniz, bunu yaparak yazılan kod miktarı azalır ve aynı zamanda daha temiz olur.

var x = ilaSantigrat(77);
var text = "Sıcaklık " + x + " Celsius";

JavaScript’teki veri türleri:

Hatırlarsanız daha önce veri türlerinden bahsetmiştim, şimdi her veri türünü daha detaylı anlatacağım. Ele alacağım ilk veri türü nesnelerdir.

Bir nesnenin basit tanımında, bir nesne farklı özelliklere ve niteliklere sahip olabilir. Nasıl ki insan ten rengi, göz rengi, boyu, kilosu, yaşı ve saç rengi gibi niteliklere ve çeşitli özelliklere sahipse, bir nesnenin de çeşitli nitelik ve özellikleri olabilir. Aşağıdaki örnekte adı, soyadı, yaşı ve göz rengi özelliklerini taşıyan bir insan nesnemiz var.

var kişi = {
    ad: "John",
    soyadı: "Doe",
    Yaş: 50
    göz rengi: "mavi"
  };

Bu özelliklerden herhangi birine erişmenin iki yolu vardır:

nesneAdı["özellikAdı"]

nesneAdı.özellikAdı

Yukarıdaki iki yöntem arasında hiçbir fark yoktur.

Ayrıca bir nesnede bir işleve de sahip olabilirsiniz:

var kişi = {
    ad: "John",
    soyadı : "Doe",
    Kimlik: 5566,
    tamAd : işlev() {
      return this.firstName + " " + this.lastName;
    }
  };

Object, JavaScript’te sıklıkla karşılaşacağınız güçlü ve kullanışlı bir araçtır. Eğer nesnenin bu özelliğine fonksiyon olarak erişmeyi düşünüyorsanız onu fonksiyonlar gibi çağırmanız gerekir:

nesneAdı.yöntemAdı()
isim = kişi.fullName();

Bu örnekte this, this here ifadesini gördünüz, istenen nesnenin içindeki değerleri ifade ediyor. bu, kullanıldığı yere bağlı olarak farklı bir değeri ifade eder. Bu boş olarak kullanılırsa çıktıda bir pencere nesnesi döndürür. Bir işlev veya yöntemde kullanılıyorsa, tanım alanındaki o değişkenin değerine döner. Aslında bu, bir nesnenin, yöntemin veya olayın içinde tanımlanan parametreyi, olayı ve değeri ifade eder.

Nesnelerle ilgili dikkat edilmesi gereken son husus, nesnelerin birbiriyle kıyaslanamaz olmasıdır. Bu, nesne türünün iki veri türünü karşılaştırmak için karşılaştırma veya eşitlik işleçlerini kullanamayacağınız anlamına gelir. Aşağıdaki örnekte her ikisi de aynı değere sahip olmasına rağmen nesne türünde oldukları için eşitlikle karşılaştırıldığında çıktı değeri false olacaktır.

“Bu, bir sayıdan nesne oluşturmak için kullanabileceğiniz sayılardan oluşan bir komuttur. ”

var x = yeni Sayı(500);             
var y = new Number(500);

// (x == y) yanlıştır çünkü nesneler karşılaştırılamaz

Nesnelerde tarih adı verilen özel bir nesne türü vardır. Bu nesne tarih ve saatle ilişkili olarak kullanılır. Bir tarih nesnesi oluşturmak için aşağıdakileri yapabilirsiniz.

Bu tarihi farklı şekillerde tanımlayabilirsiniz. Örneğin, girdi olarak dize biçiminde bir tarih verin veya istenen tarihi milisaniye cinsinden alın (unix ile aynı).

yeni tarih()
yeni Tarih(yıl, ay, gün, saat, dakika, saniye, milisaniye)
yeni Tarih(milisaniye)
yeni Tarih(tarih dizesi)

var d = yeni Tarih();
var d = new Date(2018, 11, 24, 10, 33, 30, 0);
var d = new Date(2018, 11, 24, 10, 33, 30);
var d = new Date(2018, 11, 24, 10, 33);
var d = new Date(2018, 11, 24, 10);
var d = new Date(2018, 11, 24);
var d = new Date(2018, 11);
var d = yeni Tarih(2018);
var d = yeni Tarih(0);
var d = new Date("13 Ekim 2014 11:13:00");

İstediğiniz tarih bir önceki yüzyıla (20. yüzyıla) ait ise tarihi her yılın son iki rakamı olacak şekilde yazmalısınız. Örneğin 1999 yılı şöyle:

var d = new Date(99, 11, 24);

Bir tarih nesnesini dizeye dönüştürmek için toDateString komutunu kullanabilirsiniz. UTC’de istediğiniz tarihi bir dizeye dönüştürmek istiyorsanız toUTCString komutunu kullanabilirsiniz:

var d = yeni Tarih();
document.getElementById("demo").innerHTML = d.toDateString();   
// 25 Ağu 2020 Salı

var d = yeni Tarih();
document.getElementById("demo").innerHTML = d.toUTCString();   
// 25 Ağu 2020 Salı 19:03:20 GMT

Bir tarihi milisaniyeye (unix) dönüştürmek için parse komutunu kullanabilirsiniz. Döndürülen sayı, 1 Ocak 1970’den istenen tarihe kadar geçen saniye sayısıdır.

var msec = Date.parse("21 Mart 2012");
document.getElementById("demo").innerHTML = msn;

Bir tarihiniz varsa ve yalnızca saatini veya yılını veya ayını ve saatini ayrı ayrı çıkarmak istiyorsanız, tarih için JavaScript’teki özel komutları kullanabilirsiniz.

Aslında JavaScript’te Date nesnesinde Date için iki Get ve Set metodumuz var. Get yöntemi, belirli bir yıl, belirli bir saat veya saat ve dakika gibi belirli bilgileri almak içindir ve set yöntemi, özellikle saatleri, yılları veya saat ve tarih parametrelerini değiştirmek içindir.

yöntemleri al

Yukarıdaki değerleri UTC formatında almak istiyorsanız get’den sonra UTC yazmanız yeterlidir. getUTCYear() ile aynı.

var d = yeni Tarih();
var aylar = ["Ocak", "Şubat", "Mart", "Nisan", "Mayıs", "Haziran", "Temmuz", "Ağustos", "Eylül", "Ekim", "Kasım", "Aralık "];
var günler = ["Pazar", "Pazartesi", "Salı", "Çarşamba", "Perşembe", "Cuma", "Cumartesi"];
document.getElementById("demo").innerHTML = d.getFullYear();
document.getElementById("demo").innerHTML = d.getMonth();
document.getElementById("demo").innerHTML = aylar[d.getMonth()];
document.getElementById("demo").innerHTML = d.getDate();
document.getElementById("demo").innerHTML = d.getHours();
document.getElementById("demo").innerHTML = d.getMinutes();
document.getElementById("demo").innerHTML = d.getSeconds();
document.getElementById("demo").innerHTML = d.getMilliseconds();
document.getElementById("demo").innerHTML = d.getDay();
document.getElementById("demo").innerHTML = gün[d.getDay()]

yöntemleri ayarla

Örnek:

<script>
  var d = yeni Tarih();
  d.setFullYear(2020);
  document.getElementById("demo").innerHTML = d;
  d.setFullYear(2020, 11, 3);
  document.getElementById("demo").innerHTML = d;
  d.setMonth(11);
  document.getElementById("demo").innerHTML = d;
  d.setDate(15);
  document.getElementById("demo").innerHTML = d;
  d.setDate(d.getDate() + 50);
  document.getElementById("demo").innerHTML = d;
  d.setHours(22);
  document.getElementById("demo").innerHTML = d;
  d.setMinutes(30);
  document.getElementById("demo").innerHTML = d;
  d.setSeconds(30);
  document.getElementById("demo").innerHTML = d;
</script>

Nesne türünün iki tarihini karşılaştırmak için karşılaştırma işleçlerini de kullanabilirsiniz.

var bugün, bir gün, metin;
bugün = yeni Tarih();
bir gün = yeni Tarih();
birgün.setFullYear(2100, 0, 14);

eğer (bir gün > bugün) {
  text = "Bugün 14 Ocak 2100'den önce.";
} başka {
  text = "Bugün 14 Ocak 2100'den sonra.";
}
document.getElementById("demo").innerHTML = metin;

Bir sonraki veri türü dizeler ve ilgili yöntemlerdir.

Daha önce de örnek verdiğim gibi “” ile “” arasına string koyun. Bir dizenin başlangıç ​​ve bitiş noktalarının aynı türde olmasına dikkat edin. Ya ” ile başlayın ve bitirin ya da her ikisi de ‘ ile.

Bir dize içinde ” veya ” kullanmak için. Bunu iki şekilde yapabilirsiniz:

• İstenilen dizeyi yazmak için ‘ kullanırsanız, bunun içinde de ‘ kullanabilirsiniz veya bunun tersi de geçerlidir.
• İstenilen ifadeden önce ve sonra \’ veya “\” kullanmanın başka bir yolu.

İfadenizin içinde \ kullanmayı düşünüyorsanız, hedef dizginizin içinde \\ kullanmanız gerekir.

var x = "Biz kuzeyden gelen sözde \"Vikingler\"iz.";
var x = "Biz kuzeyden gelen sözde \'Vikingler\'iz.";

var x = "Biz kuzeyden gelen sözde 'Vikingler'iz.";
var x = 'Biz kuzeyden gelen sözde "Vikingler"iz.';

var x = "\\ karakterine ters eğik çizgi denir.";

Dizelerde belirli işlemleri gerçekleştirmek için kullanabileceğiniz başka özel karakterler de vardır. Bu karakterler JavaScript programlama dilinde kullanılır ve html öğelerinin içine yerleştirilen içeriği etkilemez.

Özel bir komutla nesne türünde bir dize oluşturabilirsiniz. Bunun için aşağıdaki komutu kullanmanız gerekir:

var y = new String("John");

Bu durumda y, nesne olarak bir dizedir.

JavaScript’teki dizelerin farklı yöntemleri vardır. Bu yöntemleri kullanarak bir dizenin uzunluğunu, bir karakterin konumunu veya bir dize içindeki ifadeyi elde edebilirsiniz.

Dizeler konusunda tartışacağım ilk yöntem, bir dizenin nasıl sayıya dönüştürüleceğidir. Diyelim ki sayısal bir diziniz var (örneğin “20”), şimdi bu diziyi sayı türüne dönüştürmek istiyorsunuz. Bunun için alanlarda bu işlemi kolaylıkla yapabileceğiniz özel yöntemler bulunmaktadır. Bunun için iki spesifik yöntem vardır:

• parseInt: Dizgiyi tamsayı türüne dönüştürün
• parseFloat: Dizeyi ondalık sayısal türe dönüştürün

Number adında üçüncü bir yöntem daha var. Bu yöntem, öncekiler gibi, dizeyi sayıya dönüştürür. aradaki fark, eğer istenen sayı dizede bulunuyorsa, onu yalnızca sayısal türüne dönüştürür. Yukarıdaki yöntemlerin özellikle bir tamsayı türüne veya ondalık türe dönüştürülmesi amaçlanmıştır. Boş bir dizeyi veya yalnızca boşlukların bulunduğu bir dizeyi sayıya dönüştürmek istiyorsanız, çıktı 0 olacaktır, ancak istenen dizede sayısal olmayan karakterler veya hatta sayılar arasında boşluklar varsa, istenen çıktı olur. NaN olacak. String içerisinde başından istenilen sayıya kadar boşluk varsa ya da stringin istenilen sayısından sonuna kadar boşluk varsa ya da istenilen sayının ilki ile sonuncusu arasında boşluk varsa bu komutu kullanabilirsiniz. İstenilen dizeyi istenen sayıya dönüştürmek için; rakamlar arasındaki boşluktan farklı olarak size bir NaN vermez.

10 numara"); // 10 değerini döndürür
10 numara"); // 10 değerini döndürür
10 numara "); // 10 değerini döndürür
10 numara "); // 10 değerini döndürür
Sayı("10.33"); // 10.33 değerini döndürür
Sayı("10,33"); // NaN'yi döndürür
Sayı("10 33"); // NaN'yi döndürür
Sayı("John"); // NaN'yi döndürür

var x = parseFloat('20')
var x = parseFloat('142.53')
var x = parseInt('20.15')
var x = parseInt('52')

Dizeden sayıya dönüştürme yöntemlerine ek olarak, bir Boolean’ı veya bir tarihi bir Boolean’dan veya bir tarihi bir dizeye dönüştürebilirsiniz. Bunun için stringlerde iki metodumuz var, bir metod String (büyük harfle yazılmalıdır) ve diğeri toString.

false.toString() // "false" değerini döndürür
true.toString() // "true" değerini döndürür

String(yanlış) // "yanlış" değerini döndürür
String(true) // "true" değerini döndürür

String(Date()) // "Per 17 Temmuz 2014 15:38:19 GMT+0200 (Batı Avrupa Yaz Saati)" değerini döndürür

Date().toString() // "17 Temmuz 2014 Per 15:38:19 GMT+0200 (Batı Avrupa Yaz Saati)" değerini döndürür

Bir dizenin uzunluğunu bulmak için uzunluk komutu kullanılır. Bir dizenin uzunluğunu elde etmek için bunu kullanabilirsiniz.

var txt = "ABC DEF GHIJ KLMNO PQRS T UVWX YZ";
var sln = txt.uzunluk;

Bir sonraki komut, bir ifadenin dize içindeki konumunu elde etmektir. Bu komut indexof’tur. Bu komut, ifadenin içindeki istenen ifadenin ilk karakterinin konumunu döndürür.

var str = "Lütfen 'yer bulma'nın gerçekleştiği yeri bulun!";
var konum = str.indexOf("yerini bul");

“Bir dize içindeki karakterlerin konumu 0’dan itibarendir. ”

Döndürülen değerin dizede istenen ifadenin son karakteri olmasını istiyorsanız lastindexof komutunu kullanmanız gerekir:

var str = "Lütfen 'yer bulma'nın gerçekleştiği yeri bulun!";
var pos = str.lastIndexOf("yerini bul");

Yukarıdaki komutta istenen ifade dizede mevcut değilse -1 değeri döndürülecektir.

Şimdi, istediğiniz ifadenin dizede birden fazla kez bulunduğu bir durum olduğunu varsayalım ve söz konusu ifadenin dizede ikinci geçtiği yeri döndürmek istediğinizi varsayalım. Bunun için istenilen ifadenin bulunduğu ilk zamanın değerini bilmek ve indexof veya lastindexof’tan büyük bir sayı vermek yeterlidir.

Bir dizede bir ifadeyi aramak için kullanabileceğiniz başka bir komut da aramadır. Yetenekler açısından bu komut indexof’tan daha iyidir, ancak indexof komutundan farklı olarak bu komut, aramanın başlangıcını belirtmek için ikinci bir parametre alamaz.

var str = "Lütfen 'yer bulma'nın gerçekleştiği yeri bulun!";
var konum = str.indexOf("bul", 15);

var str = "Lütfen 'yer bulma'nın gerçekleştiği yeri bulun!";
var konum = str.lastIndexOf("bul", 15);


var str = "Lütfen 'yer bulma'nın gerçekleştiği yeri bulun!";
var konum = str.search("yerini bul");

Bir ifadenin bir bölümünü ayırıp onu başka bir değişkenin içine dize olarak kaydetmek için kullanabileceğiniz başka bir komut da dilim komutudur. Bu komut iki giriş parametresi alır; ilk parametre istenen dizenin ayrılan kısmının başlangıcı ve ikinci parametresi sonudur.

Dilime negatif sayılar da verebilirsiniz, negatif sayılar pozitif sayıların tersidir, yani -1 dizedeki son karakterdir. Bu komut yalnızca bir parametre alıyorsa bu parametre, istenen ifadeyi dizeden ayırmak için başlangıç ​​noktasıdır.

var str = "Elma, Muz, Kivi";
var res = str.slice(7, 13);

var str = "Elma, Muz, Kivi";
var res = str.slice(-12, -6);

var res = str.slice(7);

Dizelerdeki bir sonraki komut substring’dir. Bu komut, negatif değerleri alamaması dışında dilim komutuna benzer.

Bir sonraki komut substr’dir. Bu komut dilim komutuna benzer. tek fark, ikinci parametrenin istenen ifadeyi dizeden ayırmak için parçanın bitiş noktası yerine ayrılan parçanın uzunluğu olmasıdır. Örneğin aşağıdaki örnekte uzunluğu 6 olan dizedeki 7. pozisyondan istenilen bölümü bu noktadan ayırır. Eğer ona tek bir değer verilirse dilim gibi davranacaktır.

var str = "Elma, Muz, Kivi";
var res = str.substr(7, 6);

var str = "Elma, Muz, Kivi";
var res = str.substr(7);

Bir sonraki komut değiştirmedir. Bu komut, bir dizenin bir kısmını başka bir değerle değiştirmek istediğinizde kullanılır. Bu komut iki parametre alır; ilk parametre dizedeki istenen değerdir ve ikinci değer dizedeki istenen değerin yerine geçen değerdir. String içerisinde item ifadesinin birden fazla değeri varsa yalnızca ilk değer yeni değerle değiştirilir. Her şeyi değiştirmek istiyorsanız \g kullanmanız gerekir.

Bu komutun büyük/küçük harfe duyarlı olduğunu unutmayın. Bu komutta büyük/küçük harf duyarlılığını kaldırmak istiyorsanız \i kullanmanız gerekir.

str = "Lütfen Microsoft'u ziyaret edin!";
var n = str.replace("Microsoft", "Maktabkhooneh");

str = "Lütfen Microsoft ve Microsoft'u ziyaret edin!";
var n = str.replace("Microsoft", "Maktabkhooneh");

str = "Lütfen Microsoft'u ziyaret edin!";
var n = str.replace("MICROSOFT", "Maktabkhooneh");

str = "Lütfen Microsoft'u ziyaret edin!";
var n = str.replace(/MICROSOFT/i, "Maktabkhooneh");

str = "Lütfen Microsoft ve Microsoft'u ziyaret edin!";
var n = str.replace(/Microsoft/g, "Maktabkhooneh");

Bir sonraki komut, bir dizenin küçük harflerini büyük harflere (veya tam tersi) dönüştürmektir. Küçük harfleri büyük harflere dönüştürmek için toUpperCase() komutunu, büyük harfleri küçük harflere dönüştürmek için toLowerCase() komutunu kullanabilirsiniz.

var text1 = "Merhaba Dünya!"; // Sicim
var text2 = text1.toUpperCase(); // metin2, metin1'in üst metine dönüştürülmesidir

var text1 = "Merhaba Dünya!"; // Sicim
var text2 = text1.toLowerCase(); // metin2 metin1'in daha düşük değere dönüştürülmesidir

Karşılaşacağınız disiplinlerden biri. İki dize değerini birbirine bağlama. Basit bir yöntem, farklı dizeleri birbirine bağlamak ve onlardan bir dize oluşturmak için + operatörünü kullanmaktır. Diğer bir yöntem ise concat komutunu kullanmaktır. Bu komutu kullanmak için bu komuta giriş parametresi olarak istenilen stringin verilmesi yeterlidir. Aşağıdaki her iki komut da size aynı çıktıyı verecektir.

var text = "Merhaba" + " " + "Dünya!";
var text = "Merhaba".concat(" ", "Dünya!");

Bir sonraki komut trimdir. Bu komut, bir dizenin başındaki ve sonundaki boşlukları kaldırmak istediğinizde kullanılır.

var str = "Merhaba Dünya!";
uyarı(str.trim());

Dizelerdeki bir sonraki öğe, dizelerdeki karakterlerin her birine nasıl erişileceğidir.

Bunun için charAt komutunu kullanabilir veya [] kullanarak istenilen değere ulaşabilirsiniz.

var str = "MERHABA DÜNYA";
str.charAt(0); // H'yi döndürür

var str = "MERHABA DÜNYA";
dizi[0]; // H'yi döndürür

Bu komutu kullanarak dizenin içindeki karakter değerini değiştiremeyeceğinizi unutmayın. Bu, bu komutun dizeler üzerinde çalışmadığı anlamına gelir.

dizi[0] = "A";

Dizelerin son durumunda, bir dizi dize oluşturmaktır. Bunun için split adı verilen komut kullanılır. Bu komut bir giriş parametresi alır. Bu parametre aslında string içindeki terimlerin birbirinden ayrıldığı yerleri belirtir. Yalıtılmış parçaların her biri bir dizide ayrı bir üye olarak yerleştirilir. Eğer istenilen parametre istenilen stringin içinde bulunmuyorsa, stringin tamamı dizi içerisine üye olarak yerleştirilir. Giriş parametresi “” ise istenilen stringin karakterlerini birbirinden ayırır ve bir dizide saklanır.

var txt = "a,b,c,d,e"; // Sicim
txt.split("); // Virgüllerle böl
txt.split(" "); // Boşluklara bölme
txt.split("|"); // Boru üzerinde böl

var txt = "Merhaba"; // Sicim
txt.split(""); // Karakterlere bölme

Dizelerden sonra JavaScript’te sayılara geliyorum. Sayılar tartışmasında dikkat etmeniz gereken nokta, bir sayıya bir dize eklenirse (toplama operatörü kullanılırsa), çıktının bir dize olacağı ve çıkış değerinin iki dizenin eklenmesi gibi görüntüleneceğidir. birlikte. oldu.

var x = 10;
değişken y = 20;
var z = x + y; // z 30 olacak (bir sayı)

var x = "10";
var y = "20";
var z = x + y; // z 1020 olacak (bir dize)

var x = 10;
var y = "20";
var z = x + y; // z 1020 olacak (bir dize)

Sayılar tartışılırken bir diğer sorun da, eğer elimizde dizi şeklinde bir sayı varsa ve onun üzerinde matematiksel işlemler yapılıyorsa, dizi biçimindeki sayılar sayısal doğası gibi davranır. Matematiksel operatör + bu kuralın bir istisnasıdır.

var x = "100";
var y = "10";
var z = x / y; // z 10 olacak

var x = "100";
var y = "10";
var z = x * y; // z 1000 olacak

var x = "100";
var y = "10";
var z = x - y; // z 90 olacak

var x = "100";
var y = "10";
var z = x + y; // z 110 olmayacak (10010 olacak)

Number tipindeki bir değeri bir dizgeye bölerseniz, bir NaN değeri (sayısal olmayan dizge) elde edersiniz. NaN, istenen çıktının gerçek sayı tipi olmadığı anlamına gelir.

var x = 100 / "Elma"; // x NaN olacaktır (Sayı Değil)

Ayrıca bir değerin NaN olup olmadığını kontrol eden bir komut var ve o komut isNaN’dir. Bu komutu kullanarak istediğiniz değişkeni girdi olarak verebilir ve ardından istediğiniz değişkenin NaN olup olmadığını görebilirsiniz.

var x = 100 / "Elma";
NaN(x); // x bir sayı olmadığı için true değerini döndürür

Sayılarla ilgili bir diğer şey ise sonsuzluktur. Bu değer, JavaScript’te sayı türü için tanımlanan aralığın dışında bir sayıya sahipseniz oluşturulur. Ayrıca, 0’a bölünme, sonsuz çıktıyla sonuçlanır. Sonsuz tür bir sayı türüdür.

varx = 2/0; // x Sonsuz olacak
var y = -2 / 0; // y -Sonsuz olacak

Sonsuzluk türü; // "sayı"yı döndürür

Dizelerde olduğu gibi sayı türünden nesne türü oluşturabilirsiniz. Bunun için istenilen sayıda bir nesne oluşturmanız gerekmektedir. Bunun için aşağıdaki komut kullanılır. Aşağıdaki örnekte y değişkeni nesne türünde olacaktır. Karşılaştırmalı modda === kullanma modunda her ikisinin de değeri aynı olmasına rağmen türleri farklı olduğundan çıkış değeri false olacaktır.

var x = 123;
var y = new Number(123);

// typeof x sayıyı döndürür
// typeof y nesneyi döndürür

var x = 500;             
var y = new Number(500);

// (x === y) yanlıştır çünkü x ve y farklı türlere sahiptir

Sayıların da dizeler gibi kendi yöntemleri vardır. Sayılar tartışmasında var olan ilk yöntem, sayının dizgeye nasıl dönüştürüleceğidir. Bunun için ToString veya String metodu kullanılır. Bu yöntemden stringler bölümünde de bahsetmiştim.

var x = 123;
x.toString(); // x değişkeninden 123 değerini döndürür
(123).toString(); // 123'ten 123'ü döndürür
(100 + 23).toString(); // 100 + 23 ifadesinden 123 değerini döndürür

Ayrıca bir sayıyı üstel olarak da görüntüleyebilirsiniz. Bunun için toExponential komutunu kullanmanız gerekir.

var x = 9,656;
x.toÜstel(2); // 9.66e+0 değerini döndürür
x.toÜstel(4); // 9.6560e+0 değerini döndürür
x.toÜstel(6); // 9,656000e+0 değerini döndürür

Bir sonraki komut sabittir. Bu komut, virgülden sonra görüntülenebilecek basamak sayısını belirtmek içindir. Bir sayının en fazla 20 ondalık basamağı olabilir, ancak siz yalnızca ilk iki ondalık basamağı görüntülemek istiyorsunuz, bunun için bu komutu kullanmalısınız. Virgülden sonraki hane sayısı, göstermek üzere belirttiğiniz sayıdan az ise sayıda olmayan hanelerin yerine 0 konulacaktır.

var x = 9,656;
x.toFixed(0); // 10 değerini döndürür
x.toFixed(2); // 9,66 değerini döndürür
x.toFixed(4); // 9,6560 değerini döndürür
x.toFixed(6); // 9,656000 değerini döndürür

Ancak istediğiniz sayının belirli bir uzunluğunu dizgeye dönüştürmek için kullanabileceğiniz başka bir komut daha var. Bunun için toPrecision komutunu kullanabilirsiniz. Dikkat edin, bu uzunlukta ondalık sayıdan önceki basamak sayısı ve hatta ondalık sayının kendisi de sayılır. Bu komuta herhangi bir değer verilmemişse, çıktıda size tam olarak sayının kendisini verecektir.

var x = 9,656;
x.toPrecision(); // 9,656 değerini döndürür
x.toPrecision(2); // 9,7 değerini döndürür
x.toPrecision(4); // 9,656 değerini döndürür
x.toPrecision(6); // 9,65600 değerini döndürür

Bir sonraki komut valueOf’tur. Bu komut size sayı olarak bir sayı verecektir. Aslında bu komutun kullanımı, bir sayı nesnesine sahip olduğunuzda ve bu komutla onu sayı türüne dönüştürebilmenizdir.

var x = yeni Sayı(123);
x.valueOf(); // x değişkeninden 123 değerini döndürür
(123).valueOf(); // 123'ten 123'ü döndürür
(100 + 23).valueOf(); // 100 + 23 ifadesinden 123 değerini döndürür

Ayrıca tarihi sayıya da dönüştürebilirsiniz. Bu komutun çıktısı unix cinsinden tarihtir. unix, 1 Ocak 1970 referans tarihinden istediğiniz zamana kadar sayılan saniye cinsinden bir sayıdır.

Sayı(yeni Tarih("2017-09-30")); // 1506729600000 değerini döndürür

JavaScript’te, istenen sayının tam sayı olup olmadığını kontrol etmek için kullanabileceğiniz sayılara yönelik bir komut vardır. Bu komut isInteger’dır.

Number.isInteger(123) //true
Number.isInteger(-123) //true
Number.isInteger(5-2) //true
Number.isInteger(0) //true
Number.isInteger(0.5) //yanlış
Number.isInteger('123') //yanlış
Number.isInteger(false) //false
Number.isInteger(Sonsuz) //yanlış
Number.isInteger(-Sonsuz) //yanlış
Number.isInteger(0 / 0) //yanlış

İstediğiniz sayının sınırsız mı yoksa sınırlı mı olduğunu sizin için kontrol eden başka bir komut daha var. Bu komut sonsuzdur. Bu komut, dizeye veya sonsuzluğa uygulandığında false değerini döndürür.

Number.isFinite(123) //true
Number.isFinite(-1,23) //true
Number.isFinite(5-2) //true
Number.isFinite(0) //true
Number.isFinite('123') //false
Number.isFinite('Merhaba') //yanlış
Number.isFinite('2005/12/12') //false
Number.isFinite(Sonsuz) //yanlış
Number.isFinite(-Sonsuz) //yanlış
Number.isFinite(0 / 0) //yanlış

Sayısal veri tipini kontrol ettikten sonra dizi veri tipini kontrol etmeye geçeceğim. Diziler, daha önce de söylediğim gibi, içinde veri türlerinin bir listesini barındırabilir. Bir dizinin verilerine erişmek için bir nesne gibi davranabilirsiniz, ancak burada yalnızca [] kullanılabilir. Dizilerde elemanların konumu (indeks) sıfırdan başlar.

var arabalar = ["Saab", "Volvo", "BMW"];
document.getElementById("demo").innerHTML = arabalar[0];

Bir diziye değer atamak için istenen öğeyi seçip ardından ona yeni bir değer tanımlamak yeterlidir:

var arabalar = ["Saab", "Volvo", "BMW"];
arabalar[0] = "Opel";
document.getElementById("demo").innerHTML = arabalar[0];

Belirtildiği gibi diziler bir nesne türüdür ve typeof komutuyla türünü görmek istediğinizde nesnenin türünü döndürür. Bunun bir dizi mi yoksa bir nesne mi olduğunu bulmak için. Aşağıdaki iki yöntemi kullanabilirsiniz:

isArray komutu ve exampleof komutu

var meyveler = ["Muz", "Portakal", "Elma", "Mango"];

Array'in meyve örneği; // doğruyu döndürür
Array.isArray(meyveler); // doğruyu döndürür

JavaScript’teki diğer veri türleri gibi dizilerin de kendi yöntemleri ve özellikleri vardır ve bunları burada ele alacağım.

Dizilerde kullanılan yöntemler arasında dizi uzunluğunun elde edilmesi ve dizi elemanlarının sıraya konulması da yer almaktadır.

Bir dizinin uzunluğunu elde etmek için uzunluk komutunu, dizi üyelerini sıralamak için sort() komutunu kullanabilirsiniz.

var x = arabalar.uzunluk; // uzunluk özelliği eleman sayısını döndürür
var y = arabalar.sort(); // sort() yöntemi dizileri sıralar

Bir dizinin son üyesine erişmek için aynı uzunluk yöntemi kullanılabilir.

meyveler = ["Muz", "Portakal", "Elma", "Mango"];
var son = meyveler[meyveler.uzunluk - 1];

Sort komutu üyeleri azalan düzende sıralar. Dizideki üyeleri artan şekilde sıralamak istiyorsanız ters komutunu kullanmalısınız.

var meyveler = ["Muz", "Portakal", "Elma", "Mango"];
meyveler.sort();        
meyveler.reverse();     

Dizeleri sıralarken önce büyük harfler, ardından küçük harfler ve semboller ve sayılar gelir.

Bu komutu kullanarak dizideki sayıları veya dizideki sayıları sıralamak isterseniz, bu size sıralamada yanlış bir değer verecektir, bu sorunu çözmek için aşağıdaki sıralama yöntemini kullanabilirsiniz:

var puanları = [40, 100, 1, 5, 25, 10];
point.sort(function(a, b){return a - b});

Bu şekilde değerleri sıraladıktan sonra en küçük değer olan indeks 0’ı ve en büyük değer olan dizinin son indeksini elde edebilirsiniz.

Obje tipinin üyesi olan bir diziyi sıralamak istiyorsanız aşağıdaki gibi hareket edebilirsiniz.

arabalar.sort(function(a, b){a.yıl - b.yılı döndürür});

Bir diziye üye eklemek için push komutunu da kullanabilirsiniz. İstenilen komutun çıktısını bir değişkene koyarsanız, istenilen değişkenin alacağı değer dizinin yeni uzunluğuna eşit olur.

var meyveler = ["Muz", "Portakal", "Elma", "Mango"];
meyveler.push("Limon"); // meyvelere yeni bir element (Limon) ekler

Başka bir yöntem daha var ve bu da uzunluk komutunu kullanıyor.

var meyveler = ["Muz", "Portakal", "Elma", "Mango"];
meyveler[meyveler.uzunluk] = "Limon"; // meyvelere yeni bir element (Limon) ekler

Bir dizinin çıktı uzunluğunun, dizi üyesinin son indeksinden büyük olmasına dikkat edin (çünkü 0’dan başlar), dolayısıyla indeks değerine dizinin uzunluğuna eşit bir değer atadığınızda yeni bir üye eklenir. bu durumda diziye.

Dizinin indeksine dizinin uzunluğundan daha büyük bir değer atarsanız, son üyenin indeksi ile değerin atandığı en yeni üyenin indeksi arasındaki fark için tanımsız değeri tanımlanır. Bu örnekte indeks 6’ya değer atandığı ve dizinin uzunluğu 4 ve son indeksi 3 olduğu için sonuç olarak indeks 4 ve 5’e değer olmadığı için tanımsız değer tanımlandı.

var meyveler = ["Muz", "Portakal", "Elma", "Mango"];
meyveler[6] = "Limon"; // meyvelere yeni bir element (Limon) ekler

İstenilen dizinin indeksinin bir değere sahip olmadığı bir dizinin bir üyesinin değerini almak istiyorsanız, tanımsız değeri döndürülecektir.

var y = kişi[0]; // kişi[0] tanımsız olarak dönecektir

toString komutu diziler için de kullanılabilir. Bu komut, istenilen dizinin tüm üyelerinin arka arkaya yerleştirilmesini ve birbirlerinden virgülle ayrılmasını sağlar.

var meyveler = ["Muz", "Portakal", "Elma", "Mango"];
document.getElementById("demo").innerHTML = meyveler.toString();

Sonuç

Muz, Portakal, Elma, Mango

Başka bir şekilde join komutunu kullanabilirsiniz. Bu komut listenin tüm üyelerini yan yana koyar, istediğiniz dizinin üyelerini özel bir ifade veya karakterle ayırabilirsiniz:

var meyveler = ["Muz", "Portakal", "Elma", "Mango"];
document.getElementById("demo").innerHTML = meyveler.join(" * ");

Sonuç:

Muz * Portakal * Elma * Mango

Dizinin bir üyesini kaldırmak istiyorsanız pop komutunu kullanabilirsiniz. Bu komut, son üyeyi istenen diziden kaldırır. Silinen üyeyi bir değişkene koymak istiyorsanız, bu komutu kullanırken onu bir değişkene eşitlemeniz yeterlidir.

var meyveler = ["Muz", "Portakal", "Elma", "Mango"];
meyveler.pop(); // Meyvelerden son öğeyi ("Mango") kaldırır

var x = meyveler.pop(); // x'in değeri "Mango"

Pop komutunun aksine diziden ilk üyeyi kaldıran başka bir komut daha vardır. Bunun için kaydırma komutu kullanılır. Silinen üyeyi bir değişkene koymak istiyorsanız, bu komutu kullanırken onu bir değişkene eşitlemeniz yeterlidir.

var meyveler = ["Muz", "Portakal", "Elma", "Mango"];
meyveler.shift(); // Meyvelerden ilk element olan "Muz"u kaldırıyoruz

var x = meyveler.shift(); // x'in değeri "Muz"

Artık Push gibi yeni bir üye eklemek için kullanabileceğiniz başka bir komut var. Bu komut kaydırmayı kaldırır. Bu komutta istenilen değerin istenilen diziye eklenmesi için unshift içerisine konulması yeterlidir.

var meyveler = ["Muz", "Portakal", "Elma", "Mango"];
meyveler.unshift("Limon"); // Meyvelere yeni bir element olan "Limon" eklenir

JavaScript’te, diziye birkaç üye eklemenize ve diziden aynı anda birkaç üyeyi kaldırmanıza veya herhangi bir üyeyi çıkarmadan yalnızca üyeler eklemenize ve ayrıca üyelerin ekleneceği veya silineceği konumu belirtmenize olanak tanıyan başka bir komut vardır. dizi. Bu birleştirme komutudur.

var meyveler = ["Muz", "Portakal", "Elma", "Mango"];
meyveler.splice(2, 0, "Limon", "Kivi");

var meyveler = ["Muz", "Portakal", "Elma", "Mango"];
meyveler.splice(2, 2, "Limon", "Kivi");

Diziye eklenecek veya diziden silinecek üyelerin dizinini belirten ilk parametre. İkinci parametre ise diziden silinecek parametre sayısıdır. belirtir.

Herhangi bir üye eklemek istemeseniz bile, silmek istediğiniz üye veya üyelerin indeksini belirtebilmeniz dışında sadece belirli üyeleri silebilir ve Shift ve Pop gibi hareket edebilirsiniz.

Şu ana kadar bir diziye nasıl üye eklenebileceğinden bahsettim. Şimdi bir dizinin üyelerini diğerine eklemenizi sağlayan başka bir komut. Bu komut concat’tır. Aşağıdaki örnekte myBoys listesinin üyeleri myGirls listesinin üyelerine eklenmiştir.

var myGirls = ["Cecilie", "Yalnız"];
var myBoys = ["Emil", "Tobias", "Linus"];
var myChildren = myGirls.concat(myBoys); // myGirls ve myBoys'u birleştirir (birleştirir)

Hatta bir dizinin üyelerine birden fazla dizi bile ekleyebilirsiniz.

var arr1 = ["Cecilie", "Yalnız"];
var arr2 = ["Emil", "Tobias", "Linus"];
var arr3 = ["Robin", "Morgan"];
var myChildren = arr1.concat(arr2, arr3); // arr1'i arr2 ve arr3 ile birleştirir

Bu komutla üye de ekleyebilirsiniz (Push gibi).

Dizilerde bulunan diğer bir komut ise dilimdir. Bu komutu kullanarak istenilen dizinin istenen indeksinden sonraki üyelerini belirli bir indeksten yeni bir dizi olarak alabilirsiniz.

var meyveler = ["Muz", "Portakal", "Limon", "Elma", "Mango"];
var narenciye = meyveler.slice(1);

Dilim komutu için bir başlangıç ​​noktası ve bitiş noktası tanımlamak istiyorsanız. Bu komuta iki parametre vermeniz gerekiyor, ilk parametre başlangıç ​​indeksi, ikinci parametre ise bitiş indeksidir.

var meyveler = ["Muz", "Portakal", "Limon", "Elma", "Mango"];
var narenciye = meyveler.slice(1, 3);

Bu makalede geriye kalan son şey sayıları veya dizeleri Boolean’a dönüştürmektir. Boolean komutunu kullanarak sayıları veya dizeleri Boolean’a dönüştürebilirsiniz.

Boolean’a dönüştürmede önemli olan, eğer bir sayı 0 ise, Boolean’a dönüştürüldüğünde değeri false olacaktır, ancak 0 bir dize ise Boolean dönüşüm değeri doğru olacaktır (beklenenin aksine). Ayrıca birden fazla 0 değeri true değerini döndürür.

NaN’ye sahip olmamız durumunda Boolean dönüşümünde false değeri döndürülür. Infinity ve -Infinity için boole çıktısı doğru olacaktır. Dize “” ise boolean çıktısı false olacaktır. İfade boş ve tanımsızsa boole çıktısı false olacaktır. Diğer tüm durumlarda, dizenin kendisini false veya false’a dönüştürmemiz dışında, çıktı açıkça false olacaktır, boole dönüşümü true değerini döndürür.

Bu , JavaScript dil eğitiminin ilk bölümünün son konusuydu . Umarım bu içerik sizin için faydalı olmuştur. Bir sonraki bölümde döngüler, hatalar ve JavaScript’te var olan diğer şeyler de dahil olmak üzere JavaScript’in daha fazla konusunu tartışacağım.