Array.length у JavaScript — довжина масиву
Опис
Властивість length в масиві відображає кількість елементів, які він містить. Ця властивість представляє собою 32-бітне додатнє ціле число, що завжди перевищує найвищий індекс у масиві.
const listA = [1, 2, 3];
const listB = new Array(6);
console.log(listA.length); // 3
console.log(listB.length); // 6
listB.length = 2 ** 32; // 4294967296
// RangeError: Неприпустима довжина масиву
const listC = new Array(-100); // Від'ємні числа не допускаються
// RangeError: Неприпустима довжина масиву
Об'єкт масиву моніторить властивість length, синхронізуючи її значення із вмістом масиву. Це означає:
- Встановлення довжини на число, менше поточної довжини, обрізає масив - елементи, що виходять за рамки нової довжини, усуваються.
- Встановлення будь-якого індексу масиву (додатного цілого числа менше
2^32) поза поточною довжиною веде до розширення масиву - властивістьlengthзростає, відображаючи новий максимальний індекс. - Встановлення недопустимого значення довжини (наприклад, від'ємного числа або нецілого числа) викликає виняткову ситуацію
RangeError.
Коли довжина встановлюється на значення, більше ніж поточна, масив розширюється за рахунок додавання порожніх місць, а не реальних значень undefined. Ці порожні слоти взаємодіють з методами масиву особливим чином; більше про це в розділі про методи масиву та порожні слоти.
const arr = [1, 2];
console.log(arr); // [ 1, 2 ]
arr.length = 5; // встановлюємо довжину масиву на 5, в теперішній момент вона 2.
console.log(arr); // [ 1, 2, <3 порожні елементи> ]
arr.forEach((елемент) => console.log(елемент));
// 1
// 2
автор: Bond
Загальний опис
автор: NagarD
- Порада
-
Коли
Array.lengthдорівнює нулю, це означає, що масив порожній. Ви можете використати це, щоб перевірити, чи є масив порожнім або виконати певні умовні дії. Наприклад:const myArray = []; if (myArray.length === 0) { console.log("Масив порожній"); } else { console.log("Масив має елементи"); }Результат виведення буде "Масив порожній".
автор: Bond - Нотатка
-
Маєте на увазі, що властивість
автор: BondArray.lengthчитається, але безпосередньо не змінюється. Її оновлення відбувається автоматично при додаванні або видаленні елементів з масиву за допомогою таких методів, якpush(),pop(),splice()та ін. Зверніть увагу, що безпосередня зміна значенняArray.lengthможе привести до обрізки або розширення масиву.
Синтаксис
Array.length
Властивість length може отримувати єдине значення:
-
integer -
Невід'ємне ціле число, менше 232.
автор: Bond
Переглядачі
| Переглядач | ||||||
|---|---|---|---|---|---|---|
| 1 | 1 | 1 | 4 | 12 | 4 |
| Переглядач | ||||
|---|---|---|---|---|
| 1 | 18 | 4 | 1 |
| Переглядач | ||
|---|---|---|
| 0.10.0 | 1.0 |
Приклади
+ запропонувати свій приклад у пісочниці
Масив з незмінною властивістю length. Властивість length автоматично оновлюється масивом, коли елементи додаються поза поточною довжиною. Якщо властивість length зробити незмінною, масив не зможе її оновити. Це призводить до помилки в строгому режимі.
'use strict';
const numbers = [1, 2, 3, 4, 5];
Object.defineProperty(numbers, 'length', { writable: false });
try {
numbers.push(6); // мусить збільшити length — а він заморожений
} catch (error) {
console.log('push не пройшов:', error.name);
}
console.log(numbers.length); // 5 — довжина незмінна
Ітерація по масиву.
const numbers = [1, 2, 3, 4, 5];
const length = numbers.length;
for (let i = 0; i < length; i++) {
numbers[i] *= 2;
}
// numbers тепер [2, 4, 6, 8, 10]
У прикладі масив numbers скорочується до довжини 3, якщо поточна довжина більша за 3.
const numbers = [1, 2, 3, 4, 5];
if (numbers.length > 3) {
numbers.length = 3;
}
console.log(numbers); // [1, 2, 3]
console.log(numbers.length); // 3
console.log(numbers[3]); // undefined; зайві елементи видаляються
Створення порожнього масиву фіксованої довжини. Встановлення значення length більшого, ніж поточна довжина, створює розріджений масив.
const numbers = [];
numbers.length = 3;
console.log(numbers); // [empty x 3]
Цей приклад демонструє, як використовувати властивість length масива для визначення його довжини, а також як дізнатися про властивості кожного окремого елемента масиву, включаючи довжину рядків та типи даних для нерядкових елементів.
HTML
<header>
<h2 class="title">Властивість Array: length</h2>
<p class="description">Використовуємо властивість 'length' для визначення кількості елементів в масиві та розглядаємо властивості кожного елемента.</p>
</header>
<main>
<div class="result">
<h3 class="result-title">Масив:</h3>
<pre id="array"></pre>
<h3 class="result-title">Довжина масиву:</h3>
<pre id="arrayLength"></pre>
<h3 class="result-title">Властивості елементів масиву:</h3>
<pre id="elementProperties"></pre>
</div>
</main>
CSS
body {
font-size: 16px;
line-height: 1.5;
font-family: monospace;
}
pre {
color: #ff0000;
letter-spacing: 1px;
}
header {
background-color: #f1f1f1;
margin-bottom: 25px;
padding: 15px;
-webkit-box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
-moz-box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
}
header h2.title {
padding-bottom: 15px;
border-bottom: 1px solid #999;
}
header p.description {
font-style: italic;
color: #222;
}
.result {
background-color: #f8f8f8;
padding: 15px;
-webkit-box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
-moz-box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
}
.result-title {
font-weight: bold;
color: #333;
}
JS
const clothing = ['shoes', 'shirts', 'socks', 'sweaters', 123, { name: 'hat' }];
document.getElementById('array').innerText = JSON.stringify(clothing, null, 2);
document.getElementById('arrayLength').innerText = 'Довжина масиву: ' + clothing.length;
let properties = [];
for (let i = 0; i < clothing.length; i++) {if (window.CP.shouldStopExecution(0)) break;
if (typeof clothing[i] === "string") {
properties.push('Елемент ' + i + ': ' + 'рядок, довжина ' + clothing[i].length);
} else {
properties.push('Елемент ' + i + ': ' + 'тип даних - ' + typeof clothing[i]);
}
}window.CP.exitedLoop(0);
document.getElementById('elementProperties').innerText = properties.join('\n');
//# sourceURL=pen.js
Читання довжини, обрізання масиву присвоєнням і пастка порожніх місць: після length = 4 масив «має» чотири елементи, але forEach бачить лише два.
const arr = ['a', 'b', 'c', 'd'];
console.log('довжина:', arr.length); // 4
console.log('останній:', arr[arr.length - 1]); // d
console.log('те саме коротше:', arr.at(-1)); // d
arr.length = 2; // запис обрізає масив на місці
console.log('після length = 2:', arr.join(',')); // a,b
arr.length = 4; // розширення дає ПОРОЖНІ місця, не undefined
console.log('чи є індекс 3:', 3 in arr); // false
let visited = 0;
arr.forEach(() => { visited += 1; });
console.log('forEach обійшов:', visited); // 2 — порожні місця пропущено
console.log('порожній масив:', [].length === 0); // true — так і перевіряють
console.log('але сам масив істинний:', Boolean([])); // true — if (arr) не годиться
Коментарі
Коментарів ще немає — будьте першим!