javascript-array-methods-all

Bu belge Javascript 'in tüm temel array metotlarını, bu metotların tanımlarını ve kullanım örneklerini içermektedir. Bu markdown dosyası github.com/burakkrt tarafından hazırlanmıştır.

Array Methods

concant()

İki veya daha fazla diziyi birleştirmek için kullanılır. Yeni bir dizi geriye döndürür.

const array1 = ['a', 'b', 'c'];
const array2 = ['d', 'e', 'f'];
const array3 = array1.concat(array2);

console.log(array3);
// Expected output: Array ["a", "b", "c", "d", "e", "f"]

const result = array1.concat(array2,array3) //Üç diziyi birleştirme

copyWithin()

Bir dizinin bir bölümünü başka bir diziye kopyalar, bunu yaparken kopyaladığı dizinin eleman sayısını değiştirmek yerine üzerine yazar.

const array1 = ['a', 'b', 'c', 'd', 'e'];

// array1 'deki 3. indexden başlayıp 4. indexe kadar olan elemanları 0. index 'e yaz
console.log(array1.copyWithin(0, 3, 4));
// Expected output: Array ["d", "b", "c", "d", "e"]
// Burada çıktı olarak dizini 0. elemanı olan a elemanın üzerine 3 ile 4 index arasındaki
// d elemanını yazdırdı. Dizinin uzunluğu değişmedi.

console.log(array1.copyWithin(1, 3));
// Expected output: Array ["d", "d", "e", "d", "e"]
// 3. indexten itibaren (d,e) olan tüm elemanları 1. index 'den itibaren üzerine yazıp
// kopyaladı.

every()

Dizideki tüm elemanların belirtilen koşulu sağlayıp sağlamadığına göre boolean değer döndürür.

const array1 = [1, 30, 39, 29, 10, 13];
console.log(array1.every((eleman) => eleman !== 0)); //true

// yada dışarıdan fonksiyon gönderebiliriz.
const isBelowThreshold = (currentValue) => currentValue < 10;
console.log(array1.every(isBelowThreshold)); //false

filter()

Verilen dizideki koşulları sağlayan elemanların kopyasını bir dizi olarak geri döndürür.

const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];

const result = words.filter(word => word.length > 6);

console.log(result);
// Expected output: Array ["exuberant", "destruction", "present"]

const fruits = ["apple", "banana", "grapes", "mango", "orange"];

/**
 * Filter array items based on search criteria (query)
 */
function filterItems(arr, query) {
  return arr.filter((el) => el.toLowerCase().includes(query.toLowerCase()));
}

console.log(filterItems(fruits, "ap")); // ['apple', 'grapes']
console.log(filterItems(fruits, "an")); // ['banana', 'mango', 'orange']

const array = [-3, -2, -1, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13];

function isPrime(num) {
  for (let i = 2; num > i; i++) { //her sayı 1 e bölüneceği için 2 den başla.
    if (num % i === 0) { //eğer tam bölünüyor ise
      return false;  //bu elemanı false olarak döndür yani alma
    }
  }
  return num > 1;  //onun haricinde 1 den büyük tüm sayıları geri döndür.
}

// kendisi ve 1 haricinde hiçbir sayıya bölünmeneyenler. (asay sayılar)
console.log(array.filter(isPrime)); // [2, 3, 5, 7, 11, 13]

forEach()

Bu yöntem, bir dizi (array) üzerindeki her bir eleman için belirtilen bir fonksiyonu çağırmak için kullanılır.

const array1 = ['a', 'b', 'c'];

array1.forEach(element => console.log(element));

//index değeride alınabilir
array1.forEach((element,index) => console.log(index + " : " + element));

map döngü sonucunda yeni bir dizi oluşturulur ve bu dizi, döngüde yapılan işlemlerin sonuçları ile doldurulur ama forEach geriye bir değer döndürmez.

const dizi = [1, 2, 3, 4];

const yeniDizi = dizi.map(function(eleman) {
  return eleman * 2;
});

indexOf()

Dizideki elemanın index numarasını döndürür, yoksa -1 döner.

const beasts = ['ant', 'bison', 'camel', 'duck', 'bison'];

console.log(beasts.indexOf('bison'));
// Expected output: 1

// 2. indexten itibaren arama yapıyor. (yani 1. indexteki bison 'u görmez)
console.log(beasts.indexOf('bison', 2));
// Expected output: 4

console.log(beasts.indexOf('giraffe'));
// Expected output: -1

lastIndexOf()

Dizide aranan elemanın en sonuncu index ‘ini döndürür. Birden fazla aynı eleman olduğu dizilerde kullanışlıdır.

const animals = ['Dodo', 'Tiger', 'Penguin', 'Dodo'];

console.log(animals.lastIndexOf('Dodo'));
// Expected output: 3

console.log(animals.lastIndexOf('Tiger'));
// Expected output: 1

map()

Amacı, dizi içindeki her bir elemana sırayla erişerek belirli bir işlem sonucunda yeni bir dizi oluşturmaktır.

const array1 = [1, 4, 9, 16];

// Pass a function to map
const map1 = array1.map(x => x * 2);

console.log(map1);
// Expected output: Array [2, 8, 18, 32]

reduce()

Bir dizi (array) üzerinde döngü yaparak tüm elemanları birleştirerek veya toplayarak sonuç elde etmek için kullanılan bir dizi yöntemidir.

const array1 = [1, 2, 3, 4];

const initialValue = 0; //başlangıç değeri

const sum= array1.reduce(
  (oncekiDeger, suankiEleman) => oncekiDeger+ oncekiDeger, initialValue
);

//return 0+1+2+3+4 = 10

Başlangıç değerini istediğimiz değer atayabiliriz. Eğer önceki değer yok ise dizideki ilk elemanın değerini kabul eder. (burada ilk eleman 1)

const array1 = [1, 2, 3, 4];

const sum = array1.reduce((prev, current) => { return prev + current }, 2);

console.log(sum) // 0 dan başla 2 + 1 + 2 + 3 + 4 = 12

reduceRight()

reduce ile aynı sadece dizinin sonundan başına doğru ters hareket eder.

const array1 = [0,1,2,3,4];

let sum = array1.reduceRight((prev,current) =>  prev + " - " + current);

console.log(sum); "4-3-2-1-0"

Birkaç farklı örnek

const array1 = [[0, 1], [2, 3], [4, 5]];

const result = array1.reduceRight((accumulator, currentValue) => accumulator.concat(currentValue));

console.log(result);
// Expected output: Array [4, 5, 2, 3, 0, 1]

const array1 = [[0, 1], [2, 3], [4, 5]];

const result = array1.map(arr => 
     arr.reduce((prev,current) => prev + current)
).reduce((prev, current) => prev + current)

console.log(result);
// Expected output: 15

reverse()

Bir dizideki elemanları index sırasına göre tersten geri döndürür.

const array1 = ['one', 'two', 'three'];

const reversed = array1.reverse();
console.log(reversed) //result ["three", "two", "one"]

console.log(array1) // ÖNEMLİ : reverse yi başka bir diziye aktarsak bile 
// ana dizide değişmiş olur. result ["three", "two", "one"]

toReverse()

Uygulanan diziyi değiştirmeden tersine döndürür.

const array1 = ['one', 'two', 'three'];

const reversed = array1.reverse();
console.log(reversed) //result ["three", "two", "one"]

console.log(array1) // ana dizi değişmez ['one', 'two', 'three']

slice()

Bir dizinin belirtilen index aralığının kopyasını geri döndürür. Orijinal diziyi değiştirmez. İkinci parametre olarak belirtilen son index ‘i saymaz, yani slice[0,2] methunda indexi 0 ve 1 olan değerleri geri döndürür.

const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];

console.log(animals.slice(2));
// Expected output: Array ["camel", "duck", "elephant"]

console.log(animals.slice(2, 4));
// Expected output: Array ["camel", "duck"]

console.log(animals.slice(1, 5));
// Expected output: Array ["bison", "camel", "duck", "elephant"]

console.log(animals.slice(-2));
// Expected output: Array ["duck", "elephant"]

console.log(animals.slice(2, -1));
// Expected output: Array ["camel", "duck"]

some()

Dizideki belirtilen koşulun en az bir kere sağlanması durumunda true, hiç sağlanmaz ise false değerini döndürmek için kullanılır.

[0,1,2,3,4].some(element => element > 2) //return true
[0,1,2,3,4].some(element => element % 2 === 0) //return true
[0,1,2,3,4].some(element => element > 5) //return false

//dışarıdan callBack fonksiyon atama
function cbFunc(element){
return element > 2
}

[0,1,2,3,4].some(cbFunc) //return true

//dışarıdan atanan callBack function 3 değer alabilir. element zorunlu diğerleri opsionel.
function cbThree(element, index, arr){
		console.log(index + " : " +  element);
return element.length > 7;
}

["elma","muz","portakal","kivi"].some(cbThree);

// her bir elemanın tarar ve verilen koşulu sağladığı anda döngü durur ve true sonucu döndürür)
// koşul sağlanana kadar tüm elemanları gezer ve sağlanmaz ise en sonunda false döndürür.
//return
// 0 : "elma"
// 1 : "muz"
// 2 : "portakal"
// true  

function cbThree(element, index, arr){
		console.log(index + " : " +  element);
return element.length > 15;
}

["elma","muz","portakal","kivi"].some(cbThree);
// 0 : "elma"
// 1 : "muz"
// 2 : "portakal"
// 3 : "kivi"
// false

sort()

Dizideki elemanları küçükten büyüğe doğru sıralar. Sıralamayı UTF-16 kod birimi değerlerine göre yaptığı için genellikle beklediğimiz sonuçları sergilemez. Orijinal diziyi değiştirir.

const months = ["Ocak","Mart","Şubat","Nisan","Ali"];
months.sort();
console.log(months); // return ["Ali","Mart","Nisan","Ocak","Şubat"] (alfabeye göre sıralar)

ÖNEMLİ : Sayılarda karşılaştırma işlevi (compare function) geçirerek doğru sıralama yapabilirsiniz:

//unicode göre sıralama
const array1 = [1, 30, 4, 21, 100000];
array1.sort();
console.log(array1);
// Expected output: Array [1, 100000, 21, 30, 4]

//doğru sıralama
let numbers = [40, 100, 1, 5, 25, 10];
numbers.sort(function(a, b) {
  return a - b;  //a - b diyerek eğer a değeri b den büyükse çıkartılabilir mantığı ile sıralar.
});

console.log(numbers);
// Çıktı: [1, 5, 10, 25, 40, 100]

toSort()

Orijinal diziyi değiştirmeden geriye yeni bir dizi döndürerek sıralar.

let numbers = [40, 100, 1, 5, 25, 10];
let newArray = numbers.toSort(function(a, b) {
  return a - b;  //a - b diyerek eğer a değeri b den büyükse çıkartılabilir mantığı ile sıralar.
});

console.log(newArray );
// Çıktı: [1, 5, 10, 25, 40, 100]

splice()

Dizilerdeki elemanları eklemek, çıkarmak veya değiştirmek için kullanılan bir dizi işlevidir. Bu yöntem, dizi üzerinde değişiklik yapar ve değiştirilen elemanları yeni bir dizi olarak döndürür.

array.splice(start, deleteCount, item1, item2, ...);

Parametreler:

start: Dizide değişiklik yapılacak başlangıç indeksi. Ekleme veya çıkarma işlemi bu indeksten başlayarak yapılır.
deleteCount: Başlangıç indeksinden itibaren kaç elemanın silineceği. 0 ise eleman silinmez, yalnızca ekleme yapılır.
item1, item2, ...: Eklenecek yeni elemanlar. Bu parametreler isteğe bağlıdır.

Eleman ekleme:

let fruits = ["elma", "armut", "portakal"];
fruits.splice(2, 0, "muz", "çilek");

console.log(fruits);
// Çıktı: ["elma", "armut", "muz", "çilek", "portakal"]

Eleman silme:

let numbers = [10, 20, 30, 40, 50];
numbers.splice(2, 2);

console.log(numbers);
// Çıktı: [10, 20, 50]

Eleman değiştirme:

let colors = ["kırmızı", "mavi", "yeşil", "sarı"];
colors.splice(1, 1, "turuncu");

console.log(colors);
	// Çıktı: ["kırmızı", "turuncu", "yeşil", "sarı"]

entries()

Bir dizi veya bir nesne içindeki her bir öğenin key-value çiftlerinden oluşan bir dizi döndüren bir dizi veya nesne yöntemidir. Geriye yeni bir dizi döndürür.

const fruits = ['apple', 'banana', 'orange'];

const entries = fruits.entries(); //geriye yeni dizi döndürür.

for (const entry of entries) {
  console.log(entry);
}
// [0, 'apple']
// [1, 'banana']
// [2, 'orange']

const fruits = ['apple', 'banana', 'orange'];

for(let [key, value] of fruits.entries){
	console.log(key + " : " + value)
}
// "0 : apple"
// "1 : banana"
// "2 : orange"

const person = {
  name: 'John',
  age: 30,
  city: 'New York'
};

for(let [key,value] of Object.entries(person)){
  console.log(key + " : " + value)
}

// "name : John"
// "age : 30"
// "city : New York"

for (const element of [, "a"].entries()) {
  console.log(element);
}
// [0, undefined]
// [1, 'a']

fill()

Bir dizideki elemanları verilen değerle değiştirip geriye döndürür. Dizinin uzunluğundan fazla ekleme yapmaz. fill(value, start, end)

const array1 = [1, 2, 3, 4];

console.log(array1.fill(0, 2, 4)); 
//  Array [1, 2, 0, 0] (0 değerini 2 den başlayıp 4 indexde kadar var olan elemanla değiş.)

console.log(array1.fill(5, 1)); 
// Array [1, 5, 5, 5] (5 değerini 1. indexten itibaren var olan elemanlar değiştir.)

console.log(array1.fill(6)); 
//Array [6, 6, 6, 6] Tüm elemanları 6 deperi ile değiştir.

find()

Dizide verilen koşulun sağlandığı ilk elemanı geriye döndürür. Eğer hiçbir eleman koşulu sağlamaz ise undefied değeri döner.

onst array1 = [5, 12, 8, 130, 44];

const found = array1.find(element => element > 10);

console.log(found); // Expected output: 12

const array1 = [{id: 1, name: "kadir"},{id: 2, name: "süleyman"},{id: 3, name: "coşkun"}];

const found = array1.find(({id}) => id > 1);

console.log(found); // Expected output: return object {id: 2, name: "süleyman"}

findIndex()

Dizideki verilen koşulu sağlayan ilk elemanın index numarasını geriye döndürür. Koşulu sağlayan eleman yok ise -1 değerini döndürür.

const array1 = [5, 12, 8, 130, 44];

const isLargeNumber = (element) => element > 13;

console.log(array1.findIndex(isLargeNumber)); // Expected output: 3

findLast()

Diziye tersten başlayarak verilen koşulu sağlayan ilk elemanı geriye döndürür. Eleman yok ise undefied değeri geriye döndürür.

const array1 = [5, 12, 50, 130, 44];

const found = array1.find((element) => element > 45);

console.log(found);  // Expected output: 130

findLastIndex()

Diziye tersten başlayarak verilen koşulu sağlayan ilk elemanın index numarasını geriye döndürür. Eleman yok ise -1 değeri geriye döner.

const array1 = [5, 12, 50, 130, 44];

const isLargeNumber = (element) => element > 45;

console.log(array1.findLastIndex(isLargeNumber));  // Expected output: 3

includes()

Dizideki belirli bir değerin olup olmadığını kontrol eder ve geriye true veya false döndürür.

const pets = ['cat', 'dog', 'bat',12];

console.log(pets.includes(12)) //true
console.log(pets.includes("a")) //true
console.log([0,1, ,2].includes(undefined)) //true

join()

Bir dizideki elemanları birleştirerek yeni bir string ifade döndürür.

const elements = ['Fire', 'Air', 'Water'];

console.log(elements.join()); // "Fire,Air,Water"
console.log(elements.join('')); // "FireAirWater"
console.log(elements.join('-')); // "Fire-Air-Water"
console.log([1, undefined, 3].join()); // '1,,3'

keys()

Dizideki her bir eleman için index numarası döndürür. Object ile kullanmak daha faydalı.

const array1 = ['a', 'b', ,'c',];
const ite = Object.keys(array1); 
console.log(ite) // ["0","1","3"]

// yada spread operatör ile elemanları yayarak string değer döndürebiliriz.
const ite2 = Object.keys(array1);
console.log(...ite2) // "0","1","2"

toLocaleString()

Tarihlerin dile duyarlı string değerini geriye döndürür.

let date = new Date();

console.log(date) //return "2023-07-31T06:39:18.979Z"
console.log(date.toLocaleString('tr-TR')) //return "31.07.2023 09:39:18"

pop()

Bu yöntem, dizinin sonundaki elemanı kaldırır ve kaldırılan elemanı döndürür. Diziyi değiştirir.

const myArray = [1, 2, 3, 4, 5];

const removedElement = myArray.pop();
console.log(removedElement); // 5 (kaldırılan eleman)
console.log(myArray); // [1, 2, 3, 4] (kalan dizinin son hali)

const emptyArray = [];
console.log(emptyArray.pop()); // undefined

shift()

Bu yöntem, dizinin başındaki elemanı kaldırır ve kaldırılan elemanı döndürür. Dizi üzerinde değişiklik yapar.

const myArray = [1, 2, 3, 4, 5];

console.log(myArray.shift()); // 1 (kaldırılan eleman)
console.log(myArray); // [2, 3, 4, 5] (kalan dizinin son hali)

console.log(emptyArray.shift()); // undefined

push()

Bu yöntem, dizinin sonuna bir veya daha fazla eleman ekler. Dizi üzerinde değişiklik yapar ve yeni uzunluğunu döndürür.

const myArray = [1, 2, 3, 4];
console.log(myArray.push(5, 6)); // 6 (yeni dizi uzunluğu)
console.log(myArray); // [1, 2, 3, 4, 5, 6] (kalan dizinin son hali)

const myArray = [1, 2];
const additionalItems = [3, 4, 5];

myArray.push(...additionalItems);
console.log(myArray); // [1, 2, 3, 4, 5]

unshift()

Bu yöntem, diziye yeni eleman(lar) ekler ve dizinin başındaki indeksleri kaydırarak elemanları yerine yerleştirir. Dizi üzerinde değişiklik yapar.

const myArray = [3, 4, 5];
console.log(myArray.unshift(1, 2)); // [1, 2, 3, 4, 5]

//array eklenebilir
const additionalItems = [0, -1];
myArray.unshift(...additionalItems);

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

README.md

README.md

javascript-array-methods-all

Array Methods

concant()

copyWithin()

every()

filter()

forEach()

indexOf()

lastIndexOf()

map()

reduce()

reduceRight()

reverse()

toReverse()

slice()

some()

sort()

toSort()

splice()

entries()

fill()

find()

findIndex()

findLast()

findLastIndex()

includes()

join()

keys()

toLocaleString()

pop()

shift()

push()

unshift()

Files

README.md

Latest commit

History

README.md

File metadata and controls

javascript-array-methods-all

Array Methods

concant()

copyWithin()

every()

filter()

forEach()

indexOf()

lastIndexOf()

map()

reduce()

reduceRight()

reverse()

toReverse()

slice()

some()

sort()

toSort()

splice()

entries()

fill()

find()

findIndex()

findLast()

findLastIndex()

includes()

join()

keys()

toLocaleString()

pop()

shift()

push()

unshift()