01 Massivlər nədir?
Massivlər JavaScript-də sıralı məlumat kolleksiyalarını saxlamaq üçün istifadə olunan məlumat strukturlarıdır. Bir massiv eyni anda bir neçə dəyəri saxlaya bilər və hər bir dəyərə indeks (sıra nömrəsi) vasitəsilə daxil olmaq olar.
Massivlərin əsas xüsusiyyətləri
- Sıralıdır - elementlər müəyyən sırada saxlanılır
- İndeksləşdirilmişdir - hər element 0-dan başlayan indeksə malikdir
- Dinamikdir - uzunluq istənilən vaxt dəyişdirilə bilər
- Müxtəlif tiplərdə dəyərlər saxlaya bilər
02 Massiv yaratmaq
JavaScript-də massiv yaratmağın bir neçə yolu var. Ən çox istifadə olunan üsulları öyrənək.
Massiv literalı (tövsiyə olunan üsul)
Massiv literalı kvadrat mötərizələr istifadə edərək massiv yaratmağın ən sadə və ən çox istifadə olunan üsuludur.
// Boş massiv
let emptyArray = [];
// Rəqəmlərdən ibarət massiv
let numbers = [1, 2, 3, 4, 5];
// Sətirlərdən ibarət massiv
let fruits = ['alma', 'armud', 'banan'];
// Müxtəlif tiplərdən ibarət massiv
let mixed = [1, 'mətn', true, null, { name: 'Ali' }];
console.log(numbers); // Nəticə: [1, 2, 3, 4, 5]
console.log(fruits); // Nəticə: ['alma', 'armud', 'banan']Array konstruktoru
Array konstruktorundan istifadə edərək massiv yaratmaq mümkündür, lakin bu üsulun bəzi özəllikləri var.
// Uzunluq göstərərək
let arr1 = new Array(5);
console.log(arr1); // Nəticə: [ <5 empty items> ]
console.log(arr1.length); // Nəticə: 5
// Elementlərlə
let arr2 = new Array(1, 2, 3);
console.log(arr2); // Nəticə: [1, 2, 3]
// ⚠️ Diqqət: qarışıqlıq yarana bilər!
let arr3 = new Array(5); // 5 boş yer
let arr4 = new Array(5, 2); // [5, 2] - iki elementArray.of() və Array.from()
ES6-da əlavə olunan bu iki metod massiv yaratmağın daha güvənli və çevik yollarını təqdim edir.
// Array.of() - həmişə arqumentləri element kimi qəbul edir
let arr1 = Array.of(5);
console.log(arr1); // Nəticə: [5]
let arr2 = Array.of(1, 2, 3, 4, 5);
console.log(arr2); // Nəticə: [1, 2, 3, 4, 5]
// Array.from() - iterable-dan massiv yaradır
let str = 'salam';
let chars = Array.from(str);
console.log(chars); // Nəticə: ['s', 'a', 'l', 'a', 'm']
// mapping funksiyası ilə
let doubled = Array.from([1, 2, 3], x => x * 2);
console.log(doubled); // Nəticə: [2, 4, 6]03 Massiv elementlərinə daxil olmaq
Massiv elementlərinə kvadrat mötərizələrdə indeks nömrəsini göstərərək daxil olunur. JavaScript-də indekslər 0-dan başlayır.
let fruits = ['alma', 'armud', 'banan', 'gilas'];
// İndekslə daxil olmaq
console.log(fruits[0]); // Nəticə: 'alma'
console.log(fruits[2]); // Nəticə: 'banan'
// Son element
console.log(fruits[fruits.length - 1]); // Nəticə: 'gilas'
// Yanlış indeks
console.log(fruits[10]); // Nəticə: undefined
// Dəyəri dəyişdirmək
fruits[1] = 'portağal';
console.log(fruits); // Nəticə: ['alma', 'portağal', 'banan', 'gilas']Vacib məlumatlar
- Massiv indeksləri 0-dan başlayır (birinci element arr[0]-dır)
- Mövcud olmayan indeksə daxil olmaq undefined qaytarır
- Son elementə daxil olmaq üçün arr[arr.length - 1] istifadə edin
04 Massiv uzunluğu (length)
Hər massivin length xassəsi var ki, bu da massivdəki elementlərin sayını göstərir. Bu xassə yalnız oxuna bilən deyil, həm də yazıla bilən xassədir.
let numbers = [1, 2, 3, 4, 5];
// Uzunluğu əldə etmək
console.log(numbers.length); // Nəticə: 5
// Uzunluğu azaltmaq
numbers.length = 3;
console.log(numbers); // Nəticə: [1, 2, 3]
// Uzunluğu artırmaq
numbers.length = 5;
console.log(numbers); // Nəticə: [1, 2, 3, <2 empty items>]
// Massivi təmizləmək
numbers.length = 0;
console.log(numbers); // Nəticə: []05 Ümumi massiv metodları
JavaScript massivlərlə işləməyi asanlaşdıran çoxlu daxili metodlar təqdim edir. Gəlin ən çox istifadə olunanlarını öyrənək.
Sondan əlavə etmək/silmək: push() və pop()
Bu metodlar massivin sonunda əməliyyatlar aparmaq üçün istifadə olunur. Stack (yığın) strukturu yaratmaq üçün idealdır.
let stack = [1, 2, 3];
// push() - sondan əlavə edir və yeni uzunluğu qaytarır
stack.push(4);
console.log(stack); // Nəticə: [1, 2, 3, 4]
stack.push(5, 6);
console.log(stack); // Nəticə: [1, 2, 3, 4, 5, 6]
// pop() - sondan silir və silinmiş elementi qaytarır
let last = stack.pop();
console.log(last); // Nəticə: 6
console.log(stack); // Nəticə: [1, 2, 3, 4, 5]Əvvəldən əlavə etmək/silmək: unshift() və shift()
Bu metodlar massivin əvvəlində əməliyyatlar aparmaq üçün istifadə olunur. Queue (növbə) strukturu yaratmaq üçün faydalıdır.
let queue = [1, 2, 3];
// unshift() - əvvəldən əlavə edir və yeni uzunluğu qaytarır
queue.unshift(0);
console.log(queue); // Nəticə: [0, 1, 2, 3]
queue.unshift(-2, -1);
console.log(queue); // Nəticə: [-2, -1, 0, 1, 2, 3]
// shift() - əvvəldən silir və silinmiş elementi qaytarır
let first = queue.shift();
console.log(first); // Nəticə: -2
console.log(queue); // Nəticə: [-1, 0, 1, 2, 3]slice() - massivin bir hissəsini kopyalamaq
slice() metodu orijinal massivi dəyişdirmədən onun bir hissəsinin kopyasını qaytarır.
let arr = ['a', 'b', 'c', 'd', 'e'];
// İndeks 1-dən 3-ə qədər (3 daxil deyil)
let part1 = arr.slice(1, 3);
console.log(part1); // Nəticə: ['b', 'c']
console.log(arr); // Nəticə: ['a', 'b', 'c', 'd', 'e'] (dəyişməyib)
// İndeks 2-dən sonuna qədər
let part2 = arr.slice(2);
console.log(part2); // Nəticə: ['c', 'd', 'e']
// Sondan ikinci elementdən başla
let part3 = arr.slice(-2);
console.log(part3); // Nəticə: ['d', 'e']
// Massivi kopyalamaq
let copy = arr.slice();
console.log(copy); // Nəticə: ['a', 'b', 'c', 'd', 'e']splice() - elementləri silmək/əlavə etmək/dəyişdirmək
splice() metodu orijinal massivi dəyişdirərək elementləri silə, əlavə edə və ya dəyişdirə bilər. Bu, ən çoxfunksiyalı massiv metodudur.
let arr = ['a', 'b', 'c', 'd', 'e'];
// İndeks 1-dən başlayaraq 2 element sil
let removed = arr.splice(1, 2);
console.log(removed); // Nəticə: ['b', 'c']
console.log(arr); // Nəticə: ['a', 'd', 'e']
// İndeks 1-ə 2 element əlavə et (heç nə silmə)
arr.splice(1, 0, 'x', 'y');
console.log(arr); // Nəticə: ['a', 'x', 'y', 'd', 'e']
// İndeks 1-dən başlayaraq 2 element dəyişdir
arr.splice(1, 2, 'b', 'c');
console.log(arr); // Nəticə: ['a', 'b', 'c', 'd', 'e']slice() və splice() arasında fərq
slice()- Orijinal massivi dəyişdirmir, yeni massiv qaytarırsplice()- Orijinal massivi dəyişdirir, silinmiş elementləri qaytarır
06 Massivlər və obyekt xassələri
Massivlər əslində JavaScript-də xüsusi növ obyektlərdir. Bu o deməkdir ki, onlara adi obyektlər kimi xassələr əlavə edə bilərsiniz və obyekt metodlarından istifadə edə bilərsiniz. Lakin bu, tövsiyə olunmur və gözlənilməz davranışlara səbəb ola bilər.
let arr = [1, 2, 3];
// typeof 'object' qaytarır
console.log(typeof arr); // Nəticə: 'object'
console.log(Array.isArray(arr)); // Nəticə: true
// Obyektlər kimi xassələr əlavə edə bilərik
console.log(arr.length); // Nəticə: 3
arr.customProp = 'test';
console.log(arr.customProp); // Nəticə: 'test'
// Massivlərin metodları var
console.log(arr.push); // Nəticə: [Function: push]
console.log(arr.hasOwnProperty('length')); // Nəticə: false (miras alınmış)
// Object.keys() həm indeksləri, həm də xüsusi xassələri göstərir
console.log(Object.keys(arr)); // Nəticə: ['0', '1', '2', 'customProp']07 Əsas iterasiya (dövrlər)
Massivin bütün elementlərini emal etmək üçün dövrlər istifadə olunur. Gəlin ənənəvi dövr üsullarına baxaq.
For dövrü
For dövrü massiv üzərində iterasiya üçün klassik və ən çox idarə olunan üsuldur.
let fruits = ['alma', 'armud', 'banan'];
// Ənənəvi for dövrü
for (let i = 0; i < fruits.length; i++) {
console.log(i, fruits[i]);
}
// Nəticə:
// 0 'alma'
// 1 'armud'
// 2 'banan'
// Tərsinə iterasiya
for (let i = fruits.length - 1; i >= 0; i--) {
console.log(fruits[i]);
}While və do...while dövləri
While dövləri də massivlərlə işləmək üçün istifadə edilə bilər, lakin for dövrü daha adekvat seçimdir.
let numbers = [1, 2, 3, 4, 5];
let i = 0;
// While dövrü
while (i < numbers.length) {
console.log(numbers[i]);
i++;
}
// Do...while dövrü
let j = 0;
do {
console.log(numbers[j]);
j++;
} while (j < numbers.length);08 Qabaqcıl iterasiya: for...of və for...in
ES6 massivlər üzərində iterasiya üçün daha müasir və təmiz üsullar təqdim etdi. Bu üsullar kodunuzu daha oxunaqlı edir.
for...of dövrü (massivlər üçün tövsiyə olunur)
for...of dövrü iterable obyektlərin (massivlər, stringlər və s.) dəyərləri üzərində iterasiya üçün nəzərdə tutulmuşdur.
let fruits = ['alma', 'armud', 'banan'];
// for...of - dəyərlər üzərində iterasiya
for (let fruit of fruits) {
console.log(fruit);
}
// Nəticə: 'alma', 'armud', 'banan'
// İndeks və dəyər ilə (entries() istifadə edərək)
for (let [index, fruit] of fruits.entries()) {
console.log(index, fruit);
}
// Nəticə:
// 0 'alma'
// 1 'armud'
// 2 'banan'
// break istifadə etmək
for (let fruit of fruits) {
if (fruit === 'armud') break;
console.log(fruit);
}for...of-un üstünlükləri
- Təmiz və oxunaqlı sintaksis
- Birbaşa dəyərlərlə işləyir, indekslərlə yox
- İstənilən iterable obyektlə işləyir
for...in dövrü (massivlər üçün tövsiyə olunmur)
for...in dövrü obyektin bütün enumerable xassələri üzərində iterasiya edir. Xatırladaq ki, massivlər obyektlərdir (Bölmə 6-ya baxın), ona görə də for...in həm indeksləri, həm də massivə əlavə edilmiş istənilən xüsusi xassələri daxil edəcək.
let fruits = ['alma', 'armud', 'banan'];
// for...in - indekslər üzərində iterasiya (string kimi)
for (let index in fruits) {
console.log(index, typeof index); // Nəticə: '0' 'string', '1' 'string', '2' 'string'
console.log(fruits[index]);
}
// ⚠️ for...in əlavə xassələri də daxil edir
fruits.customProperty = 'test';
for (let key in fruits) {
console.log(key); // Nəticə: '0', '1', '2', 'customProperty'
}for...of və for...in arasında fərq
- for...of: İterable obyektlərin dəyərləri üzərində iterasiya edir (massivlər üçün ideal)
- for...in: Obyektin enumerable xassələri (açarları) üzərində iterasiya edir (obyektlər üçün ideal)
09 Çoxölçülü massivlər
Çoxölçülü massivlər massivlərin içində massivlərdir. Bunlar cədvəl, matris və ya şəbəkə strukturlu məlumatları təmsil etmək üçün istifadə olunur.
// 2D massiv (3x3 matris)
let matrix = [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9]
];
// Elementlərə daxil olmaq
console.log(matrix[0][0]); // Nəticə: 1
console.log(matrix[1][2]); // Nəticə: 6
console.log(matrix[2][1]); // Nəticə: 8
// İç-içə for dövrlə iterasiya
for (let i = 0; i < matrix.length; i++) {
for (let j = 0; j < matrix[i].length; j++) {
console.log(`[${i}][${j}] = ${matrix[i][j]}`);
}
}
// İç-içə for...of dövrlə
for (let row of matrix) {
for (let value of row) {
console.log(value);
}
}İstifadə halları
- Riyazi matrisləri təmsil etmək
- Oyunlar üçün şəbəkə və lövhələr
- Cədvəl strukturlu məlumatlar
10 Massiv destrukturizasiyası
Destrukturizasiya massiv elementlərini ayrı-ayrı dəyişənlərə çıxarmaq üçün rahat sintaksisdir. Bu, ES6-da təqdim olunmuşdur.
// Əsas destrukturizasiya
let [first, second, third] = ['alma', 'armud', 'banan'];
console.log(first); // Nəticə: 'alma'
console.log(second); // Nəticə: 'armud'
// Elementləri buraxmaq
let [a, , c] = [1, 2, 3];
console.log(a, c); // Nəticə: 1 3
// Rest operatoru ilə
let [head, ...tail] = [1, 2, 3, 4, 5];
console.log(head); // Nəticə: 1
console.log(tail); // Nəticə: [2, 3, 4, 5]
// Əvvəlcədən təyin olunan (default) dəyərlərlə
let [x = 10, y = 20] = [5];
console.log(x, y); // Nəticə: 5 20
// Dəyişənləri dəyişdirmək
let num1 = 10, num2 = 20;
[num1, num2] = [num2, num1];
console.log(num1, num2); // Nəticə: 20 1011 Spread operatoru (...) massivlərlə
Spread operatoru massivi ayrı-ayrı elementlərə açmaq üçün istifadə olunur. Bu, massivlərlə işləməyi xeyli asanlaşdırır.
// Spread ilə kopyalamaq
let original = [1, 2, 3];
let copy = [...original];
console.log(copy); // Nəticə: [1, 2, 3]
// Massivləri birləşdirmək
let arr1 = [1, 2];
let arr2 = [3, 4];
let merged = [...arr1, ...arr2];
console.log(merged); // Nəticə: [1, 2, 3, 4]
// Elementlər əlavə edərək birləşdirmək
let nums = [2, 3];
let extended = [1, ...nums, 4, 5];
console.log(extended); // Nəticə: [1, 2, 3, 4, 5]
// Funksiyada spread istifadə etmək
let numbers = [5, 2, 8, 1, 9];
console.log(Math.max(...numbers)); // Nəticə: 9
// Stringi massivə çevirmək
let chars = [...'Salam'];
console.log(chars); // Nəticə: ['S', 'a', 'l', 'a', 'm']İstifadə halları
- Massivin kopyasını yaratmaq
- Bir neçə massivi birləşdirmək
- Funksiyaya massiv elementlərini arqument kimi ötürmək
- Massivə yeni elementlər əlavə etmək
12 Massiv referansları
Obyektlər kimi, massivlər də JavaScript-də referans tipləridir. Massivi təyin etdikdə və ya parametr kimi ötürdükdə, referansı kopyalanır, massivin özü yox.
Massiv referansları nədir?
Massivi başqa dəyişənə təyin etdikdə yeni massiv yaranmır - hər iki dəyişən eyni massivə işarə edir.
// Primitivlər dəyərə görə kopyalanır
let x = 5;
let y = x; // dəyəri kopyalayır
y = 10;
console.log(x); // Nəticə: 5 (dəyişməyib)
console.log(y); // Nəticə: 10
// Massivlər referansa görə kopyalanır
let arr1 = [1, 2, 3];
let arr2 = arr1; // referansı kopyalayır
arr2.push(4);
console.log(arr1); // Nəticə: [1, 2, 3, 4] (dəyişdi!)
console.log(arr2); // Nəticə: [1, 2, 3, 4]
console.log(arr1 === arr2); // Nəticə: true (eyni massiv)Massivləri kopyalamaq
Massivin həqiqi kopyasını yaratmaq üçün spread operatoru (...), slice() metodu və ya strukturlaşdırılmış klonlaşdırma istifadə edə bilərsiniz.
let original = [1, 2, 3];
// Spread operatoru ilə kopya
let copy1 = [...original];
copy1.push(4);
console.log(original); // Nəticə: [1, 2, 3] (dəyişməyib)
console.log(copy1); // Nəticə: [1, 2, 3, 4]
// slice() metodu ilə kopya
let copy2 = original.slice();
copy2.push(5);
console.log(original); // Nəticə: [1, 2, 3] (dəyişməyib)
console.log(copy2); // Nəticə: [1, 2, 3, 5]
// Dayaz kopya problemi - iç-içə massivlərlə
let nested = [[1, 2], [3, 4]];
let shallowCopy = [...nested];
shallowCopy[0].push(99);
console.log(nested); // Nəticə: [[1, 2, 99], [3, 4]] (iç-içə massiv dəyişdi!)
console.log(shallowCopy); // Nəticə: [[1, 2, 99], [3, 4]]
// Dərin kopya (structuredClone)
let deepCopy = structuredClone(nested);
deepCopy[0].push(100);
console.log(nested); // Nəticə: [[1, 2, 99], [3, 4]] (dəyişməyib)
console.log(deepCopy); // Nəticə: [[1, 2, 99, 100], [3, 4]]13 Praktiki nümunələr
Gəlin massivləri və iterasiyanı real dünya ssenarilərində necə istifadə edəcəyimizə baxaq.
Nümunə 1: Alış-veriş səbəti
Alış-veriş səbətini massiv ilə idarə edək və ümumi məbləği hesablayaq.
// Alış-veriş səbəti sistemi
let cart = [];
// Məhsullar əlavə edirik
cart.push({ name: 'Kitab', price: 25 });
cart.push({ name: 'Qələm', price: 5 });
cart.push({ name: 'Dəftər', price: 10 });
console.log(`Səbətdə ${cart.length} məhsul var`);
// Ümumi məbləği hesablayırıq
let total = 0;
for (let item of cart) {
total += item.price;
}
console.log(`Ümumi məbləğ: ${total} AZN`);
// Bütün məhsulları göstəririk
for (let [index, item] of cart.entries()) {
console.log(`${index + 1}. ${item.name} - ${item.price} AZN`);
}Nümunə 2: Massivdə maksimum dəyəri tapmaq
Massivdəki ən böyük dəyəri tapmaq üçün müxtəlif üsullar.
// Maksimum dəyəri tapmaq
let scores = [85, 92, 78, 95, 88, 91];
// Üsul 1: Dövrə ilə
let max = scores[0];
for (let i = 1; i < scores.length; i++) {
if (scores[i] > max) {
max = scores[i];
}
}
console.log(`Ən yüksək bal: ${max}`);
// Üsul 2: Math.max() və spread ilə
let maxWithSpread = Math.max(...scores);
console.log(`Ən yüksək bal: ${maxWithSpread}`);
// Maksimum dəyərin indeksini tapmaq
let maxIndex = scores.indexOf(max);
console.log(`İndeks: ${maxIndex}`);Xülasə
Təklifiniz var, səhv və ya xəta tapdınız? Zəhmət olmasa bizimlə əlaqə saxlayın.