Стек дозволяє віднести до даних історію зміни значень змінних. Опис даних та алгоритмів лежить в основі програмування. Стек - це основа передачі управління між функціями, організації рекурсії і посилань на параметри. Синтаксис та семантика JavaScript за допомогою методів масиву push() та pop() дають можливість маніпулювати змістом та враховувати фактор часу. Особливість мови браузера та її логіка дозволяють інакше подивитись можливості фактора часу.
Масив даних та логіка його утворення
Просто описати змінну. Нескладно створити масив змінних. Алгоритм, який використовує дані, - це статичне та просте вирішення задачі. Класична робота з даними:
- описати (створити) змінну;
- надати значення;
- змінити значення;
- видалити змінну.
Функції push() та pop() дозволяють змінити сутність змінних та їх використання. Ідея стека не змінилася з моменту її «народження», але особливість JS як мови браузера та сучасної концепції програмування дозволяє врахувати фактор часу та надати даним динаміку.
Функція value") - додати щось у кінець масиву. Функція - витягти останній елемент масиву. Покажчик у контексті push/pop при додаванні переміщається на доданий елемент, при вилученні - передостанній елемент, а останній елемент є результатом виконання операції.
Стопка тарілок - традиційний опис стеку в JavaScript - набуває нового значення. Нехай завжди змінна – це масив. Власне, масив - це сукупність змінних, але розглядаючи змінну як масив, можна інакше подивитися на динаміку зміни її значень.
Рух за значеннями
Суть стека – прийшов останнім, пішов першим. Не можна отримати значення поза цим порядком. Строго дотримуючись цього правила, розглядаючи значення всього масиву як одну змінну, можна отримати динаміку зміни значень цієї змінної у часі.
У цьому прикладі додавання значень JS array.push(...) – це одна послідовність дій, вилучення значень JS array pop() – інша послідовність. Обидва варіанти процесів взаємопов'язані. Це означає, що активний елемент змінює своє значення не лише за часом, а й за логікою своєї зміни.
Рекурсія та динаміка значення
Якщо функція може викликати себе і безпечно виконати своє призначення - це повна функціональність. Простий приклад – таблиця. У таблиці можуть бути інші таблиці. А кожна таблиця - це рядки, стовпці та осередки. Кожен осередок може містити таблицю. Декілька осередків по рядку або по стовпцю можуть бути об'єднані в один осередок, в якому може бути таблиця. У таблиці, що у осередку, може бути осередок з двома і більше таблицями.
Реалізувати сказане у класичному стилі програмування практично неможливо, але у рекурсивному – елементарно. Якщо функціональність алгоритму роботи з таблицею дозволяє реалізувати себе всередині будь-якого осередку - це JS array push. На JavaScript цей «фокус» має особливе значення. Таблиці - це застосування користувача. Дерево сторінки (DOM) – це робота на сторінці.
На елементах DOM (тегах сторінки) висять обробники. Один варіант, коли такий обробник спрацьовує один раз, зовсім інший варіант, коли він може викликати сам себе багато разів. У розрізі всіх обробників всіх елементів сторінки виходить динаміка сторінки у часі.
Push/pop та рекурсія – це дещо інше уявлення про логіку роботи сторінки: все змінюється так, як потрібно у поточній ситуації, а не програмується заздалегідь у вигляді послідовного відпрацювання дій відвідувача.
Метод push()додає один або кілька елементів у кінець масиву та повертає нову довжину масиву.
Синтаксис
arr .push(element1 [, ...[, elementN ]])параметри
element NЕлементи для додавання до кінця масиву.Значення, що повертається
var vegetables = ["parsnip", "potato"]; var moreVegs = ["celery", "beetroot"]; // Merge the second array into the first one // Equivalent to vegetables.push("celery", "beetroot"); Array.prototype.push.apply(vegetables, moreVegs); console.log(vegetables); // ["parsnip", "potato", "celery", "beetroot"]Використання об'єкта у вигляді масиву
Як згадувалося вище, push навмисно є спільним, і ми можемо використати це у наших інтересах. Array.prototype.push може працювати з об'єктом просто чудово, як показує цей приклад. Зверніть увагу: ми не створюємо масиву для зберігання колекції об'єктів. Натомість ми зберігаємо колекцію на самому об'єкті та використовуємо call Array.prototype.push щоб обдурити метод, думаючи, що ми маємо справу з масивом, і він просто працює, завдяки тому, що JavaScript дозволяє нам встановити контекст виконання, однак ми будь ласка.
Var obj = ( length: 0, addElem: function addElem(elem) ( // obj.length is automatically incremented // every time an element is added. .push.call(this, elem); ) ); // Let"s add some empty objects just to illustrate. obj.addElem(()); obj.addElem(()); console.log(obj.length); // → 2
Зверніть увагу, що хоча obj не є масивом, метод push успішно збільшує значення length об'єкта obj, як би ми мали справу з фактичним масивом.
Характеристики
Сумісність із браузером
| Особливість | Веб-перегляд Android | Chrome для Android | Edge mobile | Firefox для Android | Операційна система Android | iOS Safari | Інтернет-магазин Samsung |
|---|---|---|---|---|---|---|---|
Масиви
Масив– це впорядкована колекція значень. Значення в масиві називаються елементами, і кожен елемент характеризується числовою позицією в масиві, яка називається індексом. Масиви в мові JavaScript є нетипізованими: елементи масиву можуть мати будь-який тип, причому різні елементи одного і того ж масиву можуть мати різні типи. Елементи масиву можуть бути навіть об'єктами або іншими масивами, що дозволяє створювати складні структури даних, такі як масиви об'єктів і масиви масивів.
Відлік індексів масивів у мові JavaScript починається з нуля і для них використовуються 32-бітові цілі числа - перший елемент масиву має індекс 0. Масиви JavaScript є динамічними: вони можуть збільшуватися і зменшуватися в розмірах при необхідності; немає необхідності оголошувати фіксовані розміри масивів за її створенні чи повторно розподіляти пам'ять за зміни їх розмірів.
Масиви в мові JavaScript - це спеціалізована форма об'єктів, а індекси масивів означають трохи більше, ніж просто імена властивостей, які є цілими числами.
Створення масивів
Найлегше створити масив за допомогою літералу, який є простим списком розділених комами елементів масиву в квадратних дужках. Значення в літералі масиву не обов'язково повинні бути константами - це можуть бути будь-які вирази, у тому числі літерали об'єктів:
Var empty =; // Порожній масив var numbers =; // Масив із п'ятьма числовими елементами var misc = [ 1.1, true, "a", ]; // 3 елементи різних типів + завершальна кома var base = 1024; var table =; // Масив зі змінними var arrObj = [,]; // 2 масиви всередині, що містять об'єкти
Синтаксис літералів масивів дозволяє вставляти необов'язкову завершальну кому, тобто. літерал [,] відповідає масиву з двома елементами, а чи не з трьома.
Інший спосіб створення масиву полягає у виклику конструктора Array(). Викликати конструктор можна трьома різними способами:
Викликати конструктор без аргументів:
Var arr = новий Array();
В цьому випадку буде створено порожній масив, еквівалентний літералу.
Викликати конструктор з числовим аргументом, визначальним довжину масиву:
Var arr = New Array (10);
І тут буде створено порожній масив зазначеної довжини. Така форма виклику конструктора Array() може використовуватися попереднього розподілу пам'яті під масив, якщо заздалегідь відома кількість його елементів. Зверніть увагу, що при цьому в масиві не зберігається жодних значень.
Явно вказати у виклику конструктора значення перших двох або більше елементів масиву або один нечисловий елемент:
Var arr = New Array (5, 4, 3, 2, 1, "тест");
І тут аргументи конструктора стають значеннями елементів нового масиву. Використання літералів масивів майже завжди простіше, ніж подібне застосування конструктора Array().
Читання та запис елементів масиву
Доступ до елементів масиву здійснюється за допомогою оператора. Зліва від дужок має бути посилання на масив. Усередині дужок має бути довільний вираз, що повертає невід'ємне ціле значення. Цей синтаксис придатний як читання, так запису значення елемента масиву. Отже, допустимі всі наведені далі JavaScript-інструкції:
// Створити масив із одним елементом var arr = ["world"]; // Прочитати елемент 0 var value = arr; // Записати значення елемент 1 arr = 3.14; // Записати значення елемент 2 i = 2; arr[i] = 3; // Записати значення елемент 3 arr = " привіт " ; // Прочитати елементи 0 і 2, записати значення елемент 3 arr] = arr;
Нагадаю, що масиви є спеціалізованим різновидом об'єктів. Квадратні дужки, що використовуються для доступу до елементів масиву, діють так само, як квадратні дужки, що використовуються для доступу до властивостей об'єкта. Інтерпретатор JavaScript перетворює вказані в дужках числові індекси на рядки - індекс 1 перетворюється на рядок "1" - а потім використовує рядки як імена властивостей.
У перетворенні числових індексів у рядки немає нічого особливого: те саме можна робити зі звичайними об'єктами:
Var obj = (); // Створити простий об'єкт obj = "one"; // Індексувати його цілими числами
Особливість масивів у тому, що з використанні імен властивостей, які є неотрицательными цілими числами, масиви автоматично визначають значення властивості length. Наприклад, вище було створено масив arr із єдиним елементом. Потім були присвоєні значення його елементам з індексами 1, 2 і 3. В результаті цих операцій значення length властивості масиву змінилося і стало рівним 4.
Слід чітко відрізняти індекси у масиві від імен властивостей об'єктів. Усі індекси є іменами властивостей, але лише властивості з іменами, представленими цілими числами є індексами. Всі масиви є об'єктами і ви можете додавати до них властивості з будь-якими іменами. Однак якщо ви торкаєтеся властивостей, які є індексами масиву, масиви реагують на це, оновлюючи значення властивості length при необхідності.
Зверніть увагу, що як індекс масивів допускається використовувати негативні і не цілі числа. У цьому випадку числа перетворюються на рядки, які використовуються як імена властивостей.
Додавання та видалення елементів масиву
Ми вже бачили, що найпростіший спосіб додати елементи в масив полягає в тому, щоб надати значення новим індексам. Для додавання одного або більше елементів в кінець масиву можна використовувати метод push():
Var arr =; // Створити пустий масив arr.push("zero"); // Додати значення на кінець arr.push("one",2); // Додати ще два значення
Додати елемент у кінець масиву можна також, надавши значення елементу arr. Для вставки елемента на початок масиву можна використовувати метод unshift(), при цьому існуючі елементи масиву зміщуються в позиції з вищими індексами.
Видаляти елементи масиву можна за допомогою оператора delete як звичайні властивості об'єктів:
Var arr =; delete arr; 2 in arr; // false, індекс 2 у масиві не визначено arr.length; // 3: оператор delete не змінює властивість length масиву
Видалення елемента нагадує (але дещо відрізняється) привласнення значення undefined цьому елементу. Зверніть увагу, що застосування оператора delete до елемента масиву не змінює значення властивості length і не зсуває вниз елементи з вищими індексами, щоб заповнити порожнечу після видалення елемента.
Крім того, є можливість видаляти елементи в кінці масиву простим привласненням нового значення властивості length. Масиви мають метод pop()(протилежний методу push()), який зменшує довжину масиву на 1 і повертає значення віддаленого елемента. Також є метод shift()(протилежний методу unshift()), який видаляє елемент на початку масиву. На відміну від оператора delete, метод shift() зсуває всі елементи вниз на позицію нижче за їхні поточні індекси.
Нарешті, існує багатоцільовий метод splice(), що дозволяє вставляти, видаляти та замінювати елементи масивів. Він змінює значення властивості length і зсуває елементи масиву з нижчими або високими індексами в міру потреби. Всі ці методи ми розберемо трохи згодом.
Багатовимірні масиви
JavaScript не підтримує "справжні" багатовимірні масиви, але дозволяє непогано імітувати їх за допомогою масивів з масивів. Для доступу до елемента даних у масиві масивів достатньо двічі використовувати оператор.
Наприклад, припустимо, що змінна matrix – це масив масивів чисел. Кожен елемент matrix [x] – це масив чисел. Для доступу до певного числа масиві можна використовувати вираз matrix[x][y]. Нижче наводиться конкретний приклад, де двовимірний масив використовується як таблиця множення:
// Створити багатовимірний масив var table = New Array (10); // У таблиці 10 рядків for(var i = 0; i
Методи класу Array
Стандарт ECMAScript 3 визначає у складі Array.prototype безліч зручних функцій для роботи з масивами, доступними як методи будь-якого масиву. Ці методи будуть представлені у наступних підрозділах.
Метод join()
Метод Array.join() перетворює всі елементи масиву в рядки, об'єднує їх і повертає рядок, що вийшов. У необов'язковому аргументі методу можна передати рядок, який використовуватиметься для відокремлення елементів у рядку результату. Якщо рядок-розділювач не вказано, використовується кома. Наприклад, наступний фрагмент дає в результаті рядок "1,2,3":
Var arr =; arr.join(); // "1,2,3" arr.join("-"); // "1-2-3"
Метод reverse()
Метод Array.reverse() змінює порядок проходження елементів у масиві на зворотний і повертає переупорядкований масив. Перестановка виконується у вихідному масиві, тобто. цей метод створює новий масив з переупорядкованими елементами, а переупорядковує в уже існуючому масиві. Наприклад, наступний фрагмент, де використовуються методи reverse() та join(), дає в результаті рядок "3,2,1":
Var arr =; arr.reverse().join(); // "3,2,1"
Метод sort()
Метод Array.sort() сортує елементи у вихідному масиві та повертає відсортований масив. Якщо метод sort() викликається без аргументів, сортування виконується в алфавітному порядку (для порівняння елементи тимчасово перетворюються на рядки, якщо це необхідно). Невизначені елементи переносяться на кінець масиву.
Для сортування в будь-якому іншому порядку, відмінному від алфавітного, методу sort() можна передати функцію порівняння як аргумент. Ця функція встановлює, який із двох її аргументів повинен наслідувати раніше у відсортованому списку. Якщо перший аргумент має передувати другому, функція порівняння має повертати негативне число. Якщо перший аргумент повинен слідувати за другим у відсортованому масиві, то функція має повертати число більше за нуль. А якщо два значення еквівалентні (тобто порядок їхнього слідування не важливий), функція порівняння повинна повертати 0:
Var arr =; arr.sort(); // Алфавітний порядок: 1111, 222, 33, 4 arr.sort(function(a,b) ( // Числовий порядок: 4, 33, 222, 1111 return a-b; // Повертає значення 0 // залежно від порядку сортування a і b)); // Сортуємо у зворотному напрямку, від більшого до меншого arr.sort(function(a,b) (return b-a));
Зверніть увагу, наскільки зручно використовувати у цьому фрагменті неназвану функцію. Функція порівняння використовується тільки тут, тому не потрібно давати їй ім'я.
Метод concat()
Метод Array.concat() створює та повертає новий масив, що містить елементи вихідного масиву, для якого був викликаний метод concat(), та значення всіх аргументів, переданих методу concat(). Якщо будь-який з цих аргументів сам є масивом, його елементи додаються в масив, що повертається. Слід, однак, відзначити, що рекурсивного перетворення масиву з масивів на одномірний масив не відбувається. Метод concat() не змінює вихідний масив. Нижче наводиться кілька прикладів:
Var arr =; arr.concat(4, 5); // Поверне arr.concat(); // Вернет arr.concat(,) // Вернет arr.concat(4, ]) // Вернет ]
Метод slice()
Метод Array.slice() повертає фрагмент, або підмасив зазначеного масиву. Два аргументи методу визначають початок і кінець фрагмента, що повертається. Масив, що повертається, містить елемент, номер якого вказаний у першому аргументі, плюс всі наступні елементи, аж до (але не включаючи) елемента, номер якого вказаний у другому аргументі.
Якщо вказано лише один аргумент, масив, що повертається, містить всі елементи від початкової позиції до кінця масиву. Якщо якийсь із аргументів має негативне значення, він визначає номер елемента щодо кінця масиву. Так, аргумент -1 відповідає останній елемент масиву, а аргумент -3 - третій елемент масиву з кінця. Ось кілька прикладів:
Var arr =; arr.slice(0,3); // Поверне arr.slice (3); // Поверне arr.slice (1,-1); // Поверне arr.slice(-3,-2); // Поверне
Метод splice()
Array.splice() - це універсальний метод, що виконує вставку або видалення елементів масиву. На відміну від методів slice() та concat(), метод splice() змінює вихідний масив, щодо якого він був викликаний. Зверніть увагу, що методи splice() і slice() мають дуже схожі імена, але виконують різні операції.
Метод splice() може видаляти елементи з масиву, вставляти нові елементи або виконувати обидві операції одночасно. Елементи масиву при необхідності зміщуються, щоб після вставки або видалення утворювалася безперервна послідовність.
Перший аргумент методу splice() визначає позицію в масиві, починаючи з якої виконуватиметься вставка та/або видалення. Другий аргумент визначає кількість елементів, які мають бути видалені (вирізані) із масиву. Якщо другий аргумент опущений, всі елементи масиву видаляються від зазначеного до кінця масиву. Метод splice() повертає масив віддалених елементів або (якщо жодного з елементів не було видалено) порожній масив.
Перші два аргументи методу splice() визначають елементи масиву, що підлягають видаленню. За цими аргументами може бути будь-яку кількість додаткових аргументів, визначальних елементи, які будуть вставлені в масив, починаючи з позиції, зазначеної в першому аргументі.
Var arr =; arr.splice(4); // Поверне, arr = arr.splice(1,2); // Поверне , arr = arr.splice(1,1); // Поверне; arr = arr =; arr.splice(2,0,"a","b"); // Поверне; arr =
Методи push() та pop()
Методи push() і pop() дозволяють працювати з масивами як із стеками. Метод push() додає один або кілька нових елементів у кінець масиву та повертає його нову довжину. Метод pop() виконує зворотну операцію - видаляє останній елемент масиву, зменшує довжину масиву та повертає віддалене їм значення. Зверніть увагу, що ці методи змінюють вихідний масив, а не створюють його модифіковану копію.
Методи unshift() та shift()
Методи unshift() і shift() поводяться майже так, як push() і pop(), за винятком того, що вони вставляють і видаляють елементи на початку масиву, а не в кінці. Метод unshift() зміщує існуючі елементи у бік великих індексів для звільнення місця, додає елемент або елементи на початок масиву і повертає нову довжину масиву. Метод shift() видаляє та повертає перший елемент масиву, зміщуючи всі наступні елементи на одну позицію вниз, щоб зайняти місце, що звільнилося на початку масиву.
The push() method adds one or more elements to the end of array and returns the new length of array.
Source для цього інтерактивного прикладу є встановленим в GitHub репозиторії. Якщо ви думаєте про те, щоб розширити проекти, повторити clone https://github.com/mdn/interactive-examples and send us a pull request.
Syntax
arr .push(element1 [, ...[, elementN ]])Parameters
element N The element(s) to add to the end of the array.Return value
Examples
Adding elements to an array
Наступні коди створюють sports array containing two elements, then appends two elements to it. Total variable contains the new length of array.
Let sports = ["soccer", "baseball"] let total = sports.push("football", "swimming") console.log(sports) // ["soccer", "baseball", "football", "swimming "] console.log(total) // 4
Merging two arrays
Цей приклад використовує apply() для запуску всіх елементів від другої array.
Do not use this method if the second array (moreVegs in the example) is very large, because the maximum number of parameters that one function can take is limited in practice. See apply() for more details.
Let vegetables = ["parsnip", "potato"] let moreVegs = ["celery", "beetroot"] // Merge the second array in the first one // Equivalent to vegetables.push("celery", "beetroot") Array.prototype.push.apply(vegetables, moreVegs) console.log(vegetables) // ["parsnip", "potato", "celery", "beetroot"]
Using an object in an array-like fashion
Як mentioned above, push is intentionally generic, і ми можемо скористатися тим, що до нашого обряду. Array.prototype.push може працювати на будь-який об'єкт just fine, as this example shows.
Помітно, що ми не можемо створити array to store a collection of objects. Just works, thanks to the way JavaScript allows us to establish the execution context however we please.
Let obj = ( length: 0, addElem: function addElem(elem) ( // obj.length is automatically incremented // every time an element is added. .push.call(this, elem) ) ) // Let"s add some empty objects just to illustrate obj.addElem(()) obj.addElem(()) console.log(obj.length) // → 2
Зрозуміло, що всі об'єкти не є array, метод стрілки успішно зростає obj "з часткою власності, як тільки ми будемо ділитися з сучасним array.
Specifications
| Specification | Status | Comment |
|---|---|---|
| ECMAScript 3rd Edition (ECMA-262) | Standard | Initial definition. Implemented in JavaScript 1.2. |
| ECMAScript 5.1 (ECMA-262) |
Standard | |
| ECMAScript 2015 (6th Edition, ECMA-262) Визначення "Array.prototype.push" в конкретній. |
Standard | |
| ECMAScript Latest Draft (ECMA-262) Визначення "Array.prototype.push" в конкретній. |
Draft |
Browser compatibility
Компактність таблиці в цій сторінці генерується з структурованих даних. Якщо ви знайдете, щоб дізнатися про ваші дані, клацніть на https://github.com/mdn/browser-compat-data and send us a pull request.
Update compatibility data on GitHub
| Desktop | Mobile | Server | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | Android webview | Chrome для Android | Firefox for Android | Opera for Android | Safari on iOS | Samsung Internet | Node.js | |
| push | Chrome Full support 1 | Edge Full support 12 | Firefox Full support 1 | IE Full support 5.5 | Opera Full support Yes | Safari Full support 1 | WebView Android Full support Yes | Chrome Android Full support 18 | Firefox Android Full support 4 | Opera Android Full support Yes | Safari iOS Full support 1 | Samsung Internet Android Full support Yes | nodejs Full support Yes |
У цій статті ми розглянемо стандартні JavaScript масиви із числовими індексами. Масиви оголошуються за допомогою квадратних дужок:
var fruits = ["Apple", "Orange", "Donkey"]
Щоб вийняти елемент, помістіть його у квадратні дужки. Перший індекс 0:
var fruits = ["Apple", "Orange", "Donkey"] alert(fruits) alert(fruits) alert(fruits)
Ми також можемо отримати довжину масиву JavaScript :
var fruits = ["Apple", "Orange", "Donkey"] alert(fruits.length)
Упс! Ми створили масив із двома фруктами та ослом. Тепер нам треба видалити віслюка.
Методи pop та push
Метод pop у JavaScript видаляє елемент масиву та повертає його.
У наступному прикладі показано, як «Осел» витягується з масиву:
var fruits = ["Apple", "Orange", "Donkey"] alert("Я видаляю "+fruits.pop()) // Тепер у нас тільки ["Apple","Orange"] alert("Тепер розмір масиву : "+fruits.length) // осел видалений
Зауважте, що pop змінює сам масив.
Аналог pop - це метод push, який додає елемент масив. Наприклад, ми забули додати персик:
var fruits = ["Apple", "Orange"] fruits.push("Peach"); // тепер ми маємо ["Apple", "Orange", "Peach"] alert("Останній елемент:"+fruits)
- Створіть масив styles з елементами Jazz”, “Blues”;
- Додати значення « Rock’n’Roll«;
- Замініть друге значення з кінця значенням « Classic“. У вас має вийти масив: “ Jazz”, ”Classic”, ”Rock’n’Roll”. Код має працювати для будь-якої довжини масиву;
- Вийміть останнє значення з масиву та виведіть його через alert.
Рішення
// 1 var styles = ["Jazz", "Bluez"] // 2 styles.push("Rock"n"Roll") // або: styles = "Rock"n"Roll" // 3 styles = "Classic // 4 alert(styles.pop())
Методи shift/unshift
Методи shift/unshift працюють з кінцем масиву, але ви також можете використовувати shift , щоб зрушити елементи вгору ( перше значення масиву видаляється зі зсувом елементів). Метод unshift дозволяє JavaScript додати елемент в масив з кінця:
var fruits = ["Apple", "Orange"] var apple = fruits.shift() // тепер у нас залишився тільки ["Orange"] fruits.unshift("Lemon") // тепер ми маємо ["Lemon", "Orange"] alert(fruits.length) // 2
І shift , і unshift можуть працювати з кількома елементами одночасно:
var fruits = ["Apple"] fruits.push("Orange","Peach") fruits.unshift("Pineapple","Lemon") // тепер масив виглядає так: ["Pineapple", "Lemon", "Apple ", "Orange", "Peach"]
Завдання для самостійного виконання
Напишіть код, щоб вивести через alert випадкове значення масиву arr :
var arr = ["Plum", "Orange", "Donkey", "Carrot", "JavaScript"]
Примітка: Код для отримання випадкового числа від мінімального до максимального значення (включно) наступний:
var rand = min + Math.floor(Math.random()*(max+1-min))
Рішення
Нам потрібно отримати випадкове число від 0 до arr.length-1 (включно):
var arr = ["Plum","Orange","Donkey","Carrot","JavaScript"] var rand = Math.floor(Math.random()*arr.length) alert(arr)
Перебір масиву
JavaScript перебір масиву здійснюється за допомогою циклу for :
var fruits = ["Pineapple", "Lemon", "Apple", "Orange", "Peach"] for(var i=0; i Створіть функцію find(arr,value) , яка знаходить значення в заданому масиві і повертає індекс або -1 , якщо значення не знайдено. Наприклад: arr = [ "test", 2, 1.5, false ] find(arr, "test") // 0 find(arr, 2) // 1 find(arr, 1.5) // 2 find(arr, 0) // -1 Можливе рішення може виглядати так: function find(array, value) ( for(var i=0; i Але це не так, тому що == не визначає різницю між 0 і false . Коректніше при роботі з масивами JavaScript використовувати === . Крім того, новий стандарт ES5 містить функцію Array#indexOf . З її допомогою ми можемо визначити функцію так: function find(array, value) ( if (array.indexOf) return array.indexOf(value) for(var i=0; i Ще розумніше було б визначити find через умову, щоб перевірити, чи існує метод indexOf. Створіть функцію filterNumeric(arr), яка приймає масив і повертає новий масив, що містить лише числові значення з arr. Приклад того, як це має працювати: arr = ["a", 1, "b", 2]; arr = filterNumeric(arr); // тепер arr = Рішення полягає в тому, щоб перебрати масив і додати значення новий масив, якщо вони є числовими. Іноді потрібен швидкий спосіб перетворення JavaScript масиву в рядок. Саме для цього призначений метод join. Він об'єднує масив у рядок, використовуючи заданий роздільник: var fruits = ["Lemon", "Apple", "Orange", "Peach"]; var str = fruits.join(", "); alert(str); Зворотне перетворення легко виконується за допомогою split : var fruits = "Apple, Orange, Peach"; var arr = fruits.split(","); // arr містить тепер ["Apple", "Orange", "Peach"] alert(arr); Об'єкт включає властивість className , яка містить імена класів, розділені пробілами: Напишіть функцію addClass(obj, cls) , яка додає клас cls , але якщо він не існує: ddClass(obj, "new") // obj.className="open menu new" addClass(obj, "open") // без змін (class already exists) addClass(obj, "me") // obj.className= "open menu new me" alert(obj.className) // Потрібно розділити className та цикл на частини. Якщо клас не знайдено, він додається. Цикл трохи оптимізований для збільшення продуктивності: function addClass(elem, cls) ( for(var c = elem.className.split(" "), i=c.length-1; i>=0; i--) ( if (c[i] == cls ) return ) elem.className += " "+cls ) var obj = ( className: "open menu" ) addClass(obj, "new") addClass(obj, "open") alert(obj.className) // open menu new У наведеному вище прикладі змінна c визначається на початку циклу, і для її останнього індексу визначається значення i . Сам цикл обробляється у зворотному напрямку, закінчуючись умовою i>=0. Тому що i>=0 перевірити швидше, ніж i. Що у JavaScript прискорює пошук у масиві. За допомогою властивості length можна обрізати масив таким чином: Ви задаєте довжину і браузер обрізає масив. Насправді JavaScript Array - це Object, доповнений автоматичною установкою довжини і спеціальними методами. Це відрізняється від концепції в інших мовах, де масиви є безперервним сегментом пам'яті. Це також відрізняється від черги чи стеку на основі пов'язаних списків. Ключі – це числа, але вони можуть мати будь-які імена: arr = arr = 5 arr.prop = 10 // не робіть так У JavaScript масиви є хеш-таблиці з їх перевагами в плані продуктивності, але і з певними недоліками. Наприклад, push/pop працюють лише з крайніми елементами масиву, тому вони неймовірно швидкі. push працює тільки з кінцем: var arr = ["My", "array"] arr.push("something") alert(arr) // рядок "array" Методи shift/unshift повільні, тому що потрібно змінити нумерацію всього масиву. Метод splice також може призвести до зміни нумерації: Який результат? Чому? arr = ["a", "b"] arr.push(function() ( alert(this) )) arr() // ? Оскільки масиви є об'єктами, arr ..фактично є викликом методу об'єкта, таким як obj method: arr() // те саме що arr() // синтаксично це неправильно, але концептуально те саме: arr.2() // переписане в тому ж стилі, що і obj.method() this = arr в такому випадку передається функції, тому виводиться вміст arr. arr = ["a", "b"] arr.push(function() ( alert(this) )) arr() // "a","b",функція Властивість length дозволяє отримати не розмір масиву JavaScript , а останній індекс + 1 . Це важливо, якщо йдеться про розріджені масиви, з «проміжками» в індексах. У наступному прикладі ми додамо два елементи в порожні fruits, але значення length залишиться 100: var fruits = // порожній масив fruits = "Peach" fruits = "Apple" alert(fruits.length) // 100 (але елементів у масиві всього 2) Якщо ви спробуєте вивести розріджений масив, браузер видасть значення пропущених індексів як порожні елементи: var fruits = // порожній масив fruits = "Peach" fruits = "Apple" alert(fruits) // ,Peach,Apple (або щось подібне до цього) Але масив – це об'єкт із двома ключами. Відсутні значення не займають місця. Розріджені масиви поводяться химерно, коли до них застосовуються методи масиву. Вони не мають уявлення про те, що індекси пропущені: var fruits = fruits = "Peach" fruits = "Apple" alert(fruits.pop()) // виштовхуємо "Apple" (на індекс 9) alert(fruits.pop()) // виштовхуємо не заданий елемент (на індекс 8 ) Намагайтеся уникати розріджених масивів. У всякому разі, їх методи не працюватимуть нормально. Натомість використовуйте Object . Як ми знаємо, масиви - це об'єкти, тому ми могли б використовувати delete, щоб видалити значення: var arr = ["Go", "to", "home"] delete arr // тепер arr = ["Go", undefined, "home"] alert(arr) // не встановлено Ви бачите, що значення видаляється, але не так, як ми хотіли б, тому що масив містить незаданий елемент. Оператор delete видаляє пару ключ-значення, і це все. Звичайно, так як масив - це тільки хеш, позиція віддаленого елемента стає undefined. Найчастіше нам потрібно видалити елемент, не залишаючи дір між індексами. Існує ще один метод, який допоможе нам у цьому. Метод splice може видаляти елементи та замінювати їх у JavaScript багатовимірних масивах. Його синтаксис: arr.splice(index, deleteCount[, elem1, ..., elemN]) Видаляє елемент deleteCount , починаючи з index , а потім вставляє його місце elem1, …, elemN . Давайте розглянемо кілька прикладів: var arr = ["Go", "to", "home"] arr.splice(1, 1) // видалити 1 елемент, починаючи з індексу 1 alert(arr.join(",")) // ["Go ", "home"] (1 елемент видалено) Таким чином, ви можете використовувати splice, щоб видалити один елемент з масиву. Номери елементів масиву зсуваються, щоб заповнити пробіл: var arr = ["Go", "to", "home"] arr.splice(0, 1) // видаляємо 1 елемент, починаючи з індексу 0 alert(arr) // "to" став першим елементом У наступному прикладі показано, як замінювати елементи: Метод splice повертає масив віддалених елементів: var arr = ["Go", "to", "home", "now"]; // видаляємо 2 перші елементи var removed = arr.splice(0, 2) alert(removed) // "Go", "to"<-- массив удаленных элементов
splice может вставлять элементы, задайте 0 для deleteCount.
var arr = ["Go", "to", "home"];
// со второй позиции
// удаляем 0
// и вставляем "my", "sweet"
arr.splice(2, 0, "my", "sweet")
alert(arr) // "Go", "to", "my", "sweet", "home" Цей метод також може використовувати негативний індекс, який відраховується з кінця масиву: var arr = // для елемента -1 (передостаннього) // видаляємо 0 елементів, // і вставляємо 3 і 4 arr.splice(-1, 0, 3, 4) alert(arr) // 1,2,3, 4,5 Об'єкт містить властивість className, в якому містяться імена класів, розділені пробілами: var obj = (className: "open menu") Напишіть функцію removeClass(obj, cls) , яка видаляє клас cls якщо він заданий: removeClass(obj, "open") // obj.className="menu" removeClass(obj, "blabla") // без змін (класу для видалення не існує) Потрібно розділити className на частини та перебрати ці частини через цикл. Якщо знайдено збіг, воно видаляється з JavaScript масиву об'єктів, а потім додається назад до кінця. Трохи оптимізуємо це: function removeClass(elem, cls) ( for(var c = elem.className.split(" "), i=c.length-1; i>=0; i--) ( if (c[i] == cls ) c.splice(i,1) ) elem.className = c.join(" ") ) var obj = ( className: "open menu" ) removeClass(obj, "open") removeClass(obj, "blabla") alert (obj.className) // menu У наведеному вище прикладі змінна c задана на початку циклу, і для i заданий останній індекс. Сам цикл виконується у зворотному напрямку, закінчуючись умовою i>=0. Це зроблено тому, що i>=0 перевіряється швидше, ніж i. Що прискорює пошук якості c . Можна витягти частину масиву за допомогою методу slice(begin[, end]): var arr = ["Why", "learn", "JavaScript"]; var arr2 = arr.slice(0,2) // приймає 2 елементи, починаючи з 0 alert(arr2.join(", ")) // "Why, learn" Зверніть увагу, що цей метод не змінює JavaScript кількість елементів в масиві, а копіює його частину. Можна опустити другий аргумент, щоб отримати всі елементи, починаючи з певного індексу: var arr = ["Why", "learn", "JavaScript"]; var arr2 = arr.slice(1) // приймає всі елементи, починаючи з 1 alert(arr2.join(", ")) // "learn, JavaScript" Метод підтримує негативні індекси, як і String#slice . Ще один корисний метод – reverse. Припустимо, я хочу отримати останню частину домену, наприклад, “ com” від “ my.site.com”. Ось як це можна зробити: var domain = "my.site.com" var last = domain.split(".").reverse() alert(last) Зверніть увагу, що JavaScript масиви підтримують складний синтаксис (reverse()) для виклику методу, а потім вилучення елемента з отриманого масиву. Ви можете створювати довші дзвінки, наприклад, reverse() 0] arr.sort() alert(arr) // 1, 15, 2 Запустіть наведений вище код. Ви отримаєте порядок 1, 15, 2. Це тому, що метод перетворює все на рядок і використовує за замовчуванням лексикографічний порядок.Завдання для самостійного виконання
Рішення
Завдання для самостійного виконання
Рішення
join та split
Завдання для самостійного виконання
Рішення
Використання length для обрізки масиву
Array є об'єктом, що з цього випливає
Нечислові ключі масиву
Таким чином, shift/unshift працюють повільніше, ніж push/pop. Чим більше масив, тим більше часу займає JavaScript сортування масиву.Завдання для самостійного виконання
Рішення
Розріджені масиви, опис length
Видалення з масиву
Метод splice
Завдання для самостійного виконання
Рішення
Метод slice
Метод reverse