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'sı 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 Dizisi Yinelemesi


Dizi yineleme yöntemleri, her dizi öğesinde çalışır.


Her biri için JavaScript Dizisi()

Yöntem forEach(), her dizi öğesi için bir işlevi (geri çağırma işlevi) bir kez çağırır.

Örnek

const numbers = [45, 4, 9, 16, 25];
let txt = "";
numbers.forEach(myFunction);

function myFunction(value, index, array) {
  txt += value + "<br>";
}

İşlevin 3 bağımsız değişken aldığını unutmayın:

  • öğe değeri
  • öğe dizini
  • Dizinin kendisi

Yukarıdaki örnek yalnızca value parametresini kullanır. Örnek şu şekilde yeniden yazılabilir:

Örnek

const numbers = [45, 4, 9, 16, 25];
let txt = "";
numbers.forEach(myFunction);

function myFunction(value) {
  txt += value + "<br>";
}

JavaScript Dizi haritası()

Yöntem map(), her dizi öğesinde bir işlev gerçekleştirerek yeni bir dizi oluşturur.

Yöntem map(), değerleri olmayan dizi öğeleri için işlevi yürütmez.

Yöntem map(), orijinal diziyi değiştirmez.

Bu örnek, her dizi değerini 2 ile çarpar:

Örnek

const numbers1 = [45, 4, 9, 16, 25];
const numbers2 = numbers1.map(myFunction);

function myFunction(value, index, array) {
  return value * 2;
}

İşlevin 3 bağımsız değişken aldığını unutmayın:

  • öğe değeri
  • öğe dizini
  • Dizinin kendisi

Geri arama işlevi yalnızca değer parametresini kullandığında, dizin ve dizi parametreleri atlanabilir:

Örnek

const numbers1 = [45, 4, 9, 16, 25];
const numbers2 = numbers1.map(myFunction);

function myFunction(value) {
  return value * 2;
}


JavaScript Dizi filtresi()

Yöntem filter(), bir testi geçen dizi öğeleriyle yeni bir dizi oluşturur.

Bu örnek, değeri 18'den büyük olan öğelerden yeni bir dizi oluşturur:

Örnek

const numbers = [45, 4, 9, 16, 25];
const over18 = numbers.filter(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

İşlevin 3 bağımsız değişken aldığını unutmayın:

  • öğe değeri
  • öğe dizini
  • Dizinin kendisi

Yukarıdaki örnekte, geri arama işlevi dizin ve dizi parametrelerini kullanmaz, dolayısıyla bunlar atlanabilir:

Örnek

const numbers = [45, 4, 9, 16, 25];
const over18 = numbers.filter(myFunction);

function myFunction(value) {
  return value > 18;
}

JavaScript Dizisi azaltmak()

Yöntem reduce(), tek bir değer üretmek (azaltmak) için her dizi öğesinde bir işlev çalıştırır.

Yöntem reduce()dizide soldan sağa doğru çalışır. Ayrıca bkz reduceRight().

Yöntem reduce(), orijinal diziyi azaltmaz.

Bu örnek, bir dizideki tüm sayıların toplamını bulur:

Örnek

const numbers = [45, 4, 9, 16, 25];
let sum = numbers.reduce(myFunction);

function myFunction(total, value, index, array) {
  return total + value;
}

İşlevin 4 argüman aldığını unutmayın:

  • Toplam (başlangıç ​​değeri / önceden döndürülen değer)
  • öğe değeri
  • öğe dizini
  • Dizinin kendisi

Yukarıdaki örnek, dizin ve dizi parametrelerini kullanmaz. Şu şekilde yeniden yazılabilir:

Örnek

const numbers = [45, 4, 9, 16, 25];
let sum = numbers.reduce(myFunction);

function myFunction(total, value) {
  return total + value;
}

Yöntem reduce()bir başlangıç ​​değeri kabul edebilir:

Örnek

const numbers = [45, 4, 9, 16, 25];
let sum = numbers.reduce(myFunction, 100);

function myFunction(total, value) {
  return total + value;
}

JavaScript Dizisi azaltmaSağ()

Yöntem reduceRight(), tek bir değer üretmek (azaltmak) için her dizi öğesinde bir işlev çalıştırır.

Dizide reduceRight()sağdan sola işler. Ayrıca bkz reduce().

Yöntem reduceRight(), orijinal diziyi azaltmaz.

Bu örnek, bir dizideki tüm sayıların toplamını bulur:

Örnek

const numbers = [45, 4, 9, 16, 25];
let sum = numbers1.reduceRight(myFunction);

function myFunction(total, value, index, array) {
  return total + value;
}

İşlevin 4 argüman aldığını unutmayın:

  • Toplam (başlangıç ​​değeri / önceden döndürülen değer)
  • öğe değeri
  • öğe dizini
  • Dizinin kendisi

Yukarıdaki örnek, dizin ve dizi parametrelerini kullanmaz. Şu şekilde yeniden yazılabilir:

Örnek

const numbers = [45, 4, 9, 16, 25];
let sum = numbers1.reduceRight(myFunction);

function myFunction(total, value) {
  return total + value;
}

JavaScript Dizisi her()

Yöntem every(), tüm dizi değerlerinin bir testi geçip geçmediğini kontrol eder.

Bu örnek, tüm dizi değerlerinin 18'den büyük olup olmadığını kontrol eder:

Örnek

const numbers = [45, 4, 9, 16, 25];
let allOver18 = numbers.every(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

İşlevin 3 bağımsız değişken aldığını unutmayın:

  • öğe değeri
  • öğe dizini
  • Dizinin kendisi

Bir geri arama işlevi yalnızca ilk parametreyi (değeri) kullandığında, diğer parametreler atlanabilir:

Örnek

const numbers = [45, 4, 9, 16, 25];
let allOver18 = numbers.every(myFunction);

function myFunction(value) {
  return value > 18;
}

JavaScript Dizi bazı()

Yöntem some(), bazı dizi değerlerinin bir testi geçip geçmediğini kontrol eder.

Bu örnek, bazı dizi değerlerinin 18'den büyük olup olmadığını kontrol eder:

Örnek

const numbers = [45, 4, 9, 16, 25];
let someOver18 = numbers.some(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

İşlevin 3 bağımsız değişken aldığını unutmayın:

  • öğe değeri
  • öğe dizini
  • Dizinin kendisi

JavaScript Dizi indexOf()

Yöntem indexOf(), bir öğe değeri için bir dizi arar ve konumunu döndürür.

Not: İlk öğenin konumu 0, ikinci öğenin konumu 1'dir, vb.

Örnek

"Apple" öğesi için bir dizi arayın:

const fruits = ["Apple", "Orange", "Apple", "Mango"];
let position = fruits.indexOf("Apple") + 1;

Sözdizimi

array.indexOf(item, start)
item Required. The item to search for.
start Optional. Where to start the search. Negative values will start at the given position counting from the end, and search to the end.

Array.indexOf() öğe bulunamazsa -1 döndürür.

Öğe bir kereden fazla mevcutsa, ilk oluşumun konumunu döndürür.


JavaScript Dizisi lastIndexOf()

Array.lastIndexOf()ile aynıdır Array.indexOf(), ancak belirtilen öğenin son oluşumunun konumunu döndürür.

Örnek

"Apple" öğesi için bir dizi arayın:

const fruits = ["Apple", "Orange", "Apple", "Mango"];
let position = fruits.lastIndexOf("Apple") + 1;

Sözdizimi

array.lastIndexOf(item, start)
item Required. The item to search for
start Optional. Where to start the search. Negative values will start at the given position counting from the end, and search to the beginning

JavaScript Dizisi bul()

Yöntem find(), bir test işlevinden geçen ilk dizi öğesinin değerini döndürür.

Bu örnek, 18'den büyük olan ilk öğeyi bulur (değerini döndürür):

Örnek

const numbers = [4, 9, 16, 25, 29];
let first = numbers.find(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

İşlevin 3 bağımsız değişken aldığını unutmayın:

  • öğe değeri
  • öğe dizini
  • Dizinin kendisi

Tarayıcı Desteği

find() bir ES6 özelliğidir (JavaScript 2015).

Tüm modern tarayıcılarda desteklenir:

Chrome Edge Firefox Safari Opera
Yes Yes Yes Yes Yes

find() Internet Explorer'da desteklenmez.


JavaScript Dizisi findIndex()

Yöntem findIndex(), bir test işlevinden geçen ilk dizi öğesinin dizinini döndürür.

Bu örnek, 18'den büyük olan ilk öğenin dizinini bulur:

Örnek

const numbers = [4, 9, 16, 25, 29];
let first = numbers.findIndex(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

İşlevin 3 bağımsız değişken aldığını unutmayın:

  • öğe değeri
  • öğe dizini
  • Dizinin kendisi

Tarayıcı Desteği

findIndex() bir ES6 özelliğidir (JavaScript 2015).

Tüm modern tarayıcılarda desteklenir:

Chrome Edge Firefox Safari Opera
Yes Yes Yes Yes Yes

findIndex() Internet Explorer'da desteklenmez.




JavaScript Dizisi.from()

Yöntem Array.from(), length özelliğine sahip herhangi bir nesneden veya yinelenebilir herhangi bir nesneden bir Array nesnesi döndürür.

Örnek

Bir Dizeden Dizi Oluşturun:

Array.from("ABCDEFG");

Tarayıcı Desteği

from() bir ES6 özelliğidir (JavaScript 2015).

Tüm modern tarayıcılarda desteklenir:

Chrome Edge Firefox Safari Opera
Yes Yes Yes Yes Yes

from() Internet Explorer'da desteklenmez.


JavaScript Dizi Anahtarları()

Yöntem Array.keys(), bir dizinin anahtarlarıyla birlikte bir Array Iterator nesnesi döndürür.

Örnek

Create an Array Iterator object, containing the keys of the array:

const fruits = ["Banana", "Orange", "Apple", "Mango"];
const keys = fruits.keys();

for (let x of keys) {
  text += x + "<br>";
}

Browser Support

keys() is an ES6 feature (JavaScript 2015).

It is supported in all modern browsers:

Chrome Edge Firefox Safari Opera
Yes Yes Yes Yes Yes

keys() is not supported in Internet Explorer.


JavaScript Array includes()

ECMAScript 2016 introduced Array.includes() to arrays. This allows us to check if an element is present in an array (including NaN, unlike indexOf).

Example

const fruits = ["Banana", "Orange", "Apple", "Mango"];

fruits.includes("Mango"); // is true

Syntax

array.includes(search-item)

Array.includes() allows to check for NaN values. Unlike Array.indexOf().

Array.includes() is not supported in Internet Explorer and Edge 12/13.

The first browser versions with full support are:


Browser Support

includes() is an ECMAScript 2016 feature.

It is supported in all modern browsers:

Chrome Edge Firefox Safari Opera
Yes Yes Yes Yes Yes

includes() is not supported in Internet Explorer.


Complete Array Reference

For a complete Array reference, go to our:

Complete JavaScript Array Reference.

The reference contains descriptions and examples of all Array properties and methods.