IT-блог о веб-технологиях, серверах, протоколах, базах данных, СУБД, SQL, компьютерных сетях, языках программирования и создание сайтов.

Здравствуйте, уважаемые посетители моего скромного блога для начинающих вебразработчиков и web мастеров ZametkiNaPolyah.ru. Продолжаю рубрику Веб-программирование и ее раздел Уроки JavaScript для начинающих. В данной рубрике были публикации: Инструкции JavaScript, Функции JavaScript, переменный JavaScript и типизация JavaScript переменных, синтаксис JavaScript, значение null и значение undefined JavaScript, значения true и false в JavaScript, выражения и операторы JavaScript, операторы void, delete, new и typeof, преобразование число в строку и строку в число, символы и строки JavaScript, числа JavaScript, типы данных JavaScript, способы вставки JavaScript в HTML и Условия JavaScript. Инструкция if JavaScript и конструкция else JavaScript, массивы JavaScript и функция Array () JavaScript.

Чтение элементов массива JavaScript, запись элементов массива JavaScript. Как добавить элемент в массив JavaScript. Как удалить элемент из массива JavaScript. Длина массива JavaScript. Свойство массива lenght JavaScript.

Как вы помните, в прошлой публикации рубрики Уроки JavaScript для начинающих я начал тему массивов JavaScript, сегодня я ее продолжаю. И сегодня мы поговорим про работу с массивами JavaScript. В этой публикации мы разберемся с тем, как происходит чтение массивов JavaScript, как происходит запись в массив JavaScript и какие средства у нас есть для этого. Мы разберемся с длиной массива JavaScript и со свойством lenght JavaScript, которое устанавливает длину массива JavaScript. Так же вы узнаете о том, как добавить элемент в массив JavaScript и как удалить элемент из массива JavaScript.

//
//

Краткая теория по массивам JavaScript

В прошлой публикации, посвященной массивам JavaScript, я уже писал про то, что JavaScript массив – это упорядоченная коллекция значений, массивы JavaScript могут хранить различные типы данных JavaScript, то есть каждый элемент одного и того же JavaScript массива может хранить значения различных типов данных. Кстати, сами JavaScript массивы – это тип данных. Каждый элемент JavaScript массива пронумерован, то есть это говорит нам о том, что JavaScript массивы упорядочены, к каждому элементу JavaScript массива можно обратиться по этому номеру или иначе индексу элемента массива JavaScript.

Каждый элемент массива JavaScript может хранить в себе любой другой JavaScript объект или массив JavaScript – это позволяет создавать сложные структуры данных и массивы массивов JavaScript. Следует напомнить, что JavaScript массивы динамические, то есть, при инициализации JavaScript массивов не надо указывать их размерность. Сами JavaScript массивы могут уменьшаться или увеличиваться в размерах по мере надобности. У JavaScript массивов есть еще одна особенность – они могут быть разреженными, это говорит нам о том, что JavaScript массив не обязательно должен содержать в себе элементы с непрерывной последовательностью индексов. Длину любого JavaScript массива можно узнать при помощи свойства length, которое предопределено для каждого массива JavaScript.

Но не стоит забывать, что JavaScript массив – это прежде всего объект с расширенной функциональностью, чтобы убедиться в том, что JavaScript массив это объект можно воспользоваться JavaScript оператором typeof, который позволяет определить тип данных. Самый простой способ создания JavaScript массивов – воспользоваться литералами JavaScript массивов:

[php]

var mas1 = [];

var mas2 = [1,2,3,4];

var mas3 = [1,[true,false,2],”a”];

[/php]

В данном примере мы создали пустой JavaScript массив, массив, хранящий в себе только числа JavaScript и массив массивов JavaScript. Не забывайте о том, что JavaScript массивы могут хранить в себе не только постоянные значения, но и JavaScript переменные. Индексация JavaScript массивов начинается с нуля, поэтому длина JavaScript массива на единицу больше, чем номер последнего элемента массива JavaScript. JavaScript массивы можно создавать при помощи функции конструктора Array () JavaScript:

[php]

var mas = new Array ();

[/php]

В данном случае мы создали пустой JavaScript массив. Но функции конструкции Array () JavaScript можно передать несколько аргументов – значения, которые будут храниться в JavaScript массиве, они разделяются между собой запятой. Функция конструктор Array () JavaScript позволяет явно задать длину JavaScript массива, для этого ей достаточно передать одно число, которое и будет определять длину JavaScript массива:

[php]

var mas = new Array (15);

[/php]

В этом случае мы создали JavaScript массив, в котором хранится 15 элементов, но каждый элемент массива JavaScript будет иметь значение undefined JavaScript.

Чтение элементов массива JavaScript, запись элементов массива JavaScript

//
//
Ну что же, я вкратце напомнил о том, что такое JavaScript массивы. Давайте теперь поработаем с массивами JavaScript. Рассмотри то, как происходит чтение элементов массива JavaScript и запись элементов массива JavaScript. Когда я писал про JavaScript операторы, я описывал оператор [], который дает доступ к любому элементу JavaScript массива. Синтаксис для доступа к элементам JavaScript массива очень прост: слева от квадратных скобок указывается ссылка на JavaScript массив (имя JavaScript массива), а внутри квадратных скобок может находиться любое JavaScript выражение, но тут есть одно ограничение: результатом этого JavaScript выражения должно быть целое неотрицательное число.

При помощи данного JavaScript оператора можно осуществлять как запись элементов массива JavaScript, так и чтение элементов массива JavaScript. Таким образом, мы можем создать JavaScript массив и наполнить его, затем прочитать элемент массива JavaScript, а затем добавить элемент JavaScript массива в созданный массив:

[php]

var mas = [“Строка”];// создать JavaScript массив с именем mas и присвоить первому элементу JavaScript массива значение “Строка”

var str = mas[0];// прочитать значение, которое храниться в элементе JavaScript  массива с индексом 0

mas[1] = “Строка 2”; // добавить новый элемент в JavaScript массив

[/php]

Можно заранее про инициализировать JavaScript переменную и пользоваться ей при создание JavaScript массива и дальнейшей работе с JavaScript массивом:

[php]

var j = 0;

a[j] = 55; // присвоить житому элементу JavaScript массива значение 55

a[j+1] = true; присвоить j+1 элементу JavaScript массива значение true

[/php]

Но в то же время JavaScript оператор [] может быть использован для доступа к объектам JavaScript (в этом случае мы встречаемся с таким понятием, как ассоциативные массивы JavaScript). Точнее к свойствам JavaScript объекта. В том случае, если мы используем квадратные скобки для доступа к свойствам объектов JavaScript, интерпретатор преобразует числа JavaScript в JavaScript строки, например, если мы хотим получить доступ к свойству с именем “1” и пишем [1], то интерпретатор преобразует число 1 в строку “1”. Поэтому главной отличительной особенностью JavaScript массивов является то, что они индексируются целыми неотрицательными числами, то есть нам заранее известно значение свойства length JavaScript массива.

Поскольку JavaScript массив – это разновидность JavaScript объектов, то справедливо следующее: JavaScript массивы можно индексировать отрицательными и дробными числами, но тогда данные числа будут преобразовываться в строки JavaScript и они будут использоваться для доступа к свойствам объекта JavaScript. Так же не произойдет никакой ошибки, если вы попытаетесь обратиться к несуществующему элементу JavaScript массива, если вы попытаетесь это сделать, то получите значение undefined.

Наверное, это все что нужно знать про чтение элементов массивов JavaScript и запись элементов массивов JavaScript. Давайте теперь поговорим про длину массива JavaScript, а так же про то, как добавить новый элемент в массив JavaScript и как удалить элемент из массива JavaScript.

Как добавить элемент в массив JavaScript. Как удалить элемент из массива JavaScript. Длина массива JavaScript.

//
//
Я уже говорил о том, что JavaScript массивы имеют динамические размеры, то есть не нужно заранее указывать длину массива JavaScript. А так же я говорил о том, что все массивы JavaScript, не важно, каким образом вы их создали при помощи функции Array () JavaScript или при помощи литералов, все массивы JavaScript имеют свойство length, свойство length JavaScript массива определяет его длину, то есть количество элементов массива JavaScript. Но я уже говорил, что свойство length массива JavaScript всегда на единицу больше, чем номер последнего элемента массива.

Стоит учитывать тот факт, что свойство length массива JavaScript, помимо того что определяет длину массива JavaScript, оно еще и динамически обновляется вместе с массивом JavaScript, то есть если вы удалили элемент массива JavaScript или добавили новый элемент массива JavaScript, то есть изменили длину массива, то свойство length обновится автоматически. Свойство length для массива JavaScript (длину массива JavaScript) можно определить заранее:

[php]

mas.length = 155;

[/php]

Таким образом мы создали JavaScript массив с длиной 155 элементов, но элементов в таком массиве нет, но длина такого JavaScript массива равна 155, поэтому здесь будет некорректно говорить о том, что номер последнего элемента массива равен 154. Что же, наверное, это все, что я хотел рассказать про длину массива JavaScript и свойство length JavaScript массива. Давайте теперь рассмотрим как добавлять элементы в массив JavaScript и как удалять элементы из массива JavaScript.

Начнем с добавления новых элементов в массив JavaScript. Я уже показывал самый просто способ того, как добавить элемент в массив JavaScript, смотрите выше. Но на этом добавление элементов в массив JavaScript не заканчивается, можно добавить несколько элементов в конец массива JavaScript, для этих целей у нас есть функция push () JavaScript. Функция push () JavaScript является встроенной функцией и предназначена для добавления элементов в конец массива JavaScript. При помощи функции push () можно добавить один элемент в конец массива JavaScript, а можно добавить несколько элементов в конец массива, давайте создадим пустой массив JavaScript и посмотрим:

[php]

mas  = [];

mas.push (‘элемент с индексом 0’);

mas.push (‘добавить элемент массива с индексом 1’, ‘добавить элемент массива с индексом 2’);

[/php]

Помимо того, что мы можем добавлять элементы в конец массива JavaScript, мы можем добавлять элементы в начало массива JavaScript, для добавления элементов в начало массива JavaScript есть функция unshift () JavaScript, функция unshift () JavaScript позволяет добавлять элементы в начало массива. При этом все элементы массива, которые уже в нем хранятся сдвигаются вправо, то есть их индексы увеличиваются. С добавление элементов в массив JavaScript мы разобрались, теперь можно переходить к рассмотрению того, как удалить элемент из массива JavaScript.

Чтобы удалить элемент из массива JavaScript можно воспользоваться самым простым способом и присвоить ненужному элементу массива значение undefined, но это будет не совсем удаление элемента из массива, точнее это вовсе не удаление элемента из массива. То есть, если мы воспользуемся оператором delete JavaScript, то мы не удалим элемент из массива JavaScript, так длина массива JavaScript останется прежней (свойство length массива JavaScript).

К счастью у JavaScript массивов есть метод, который позволяет удалять элементы массивов. Но пока не об этом. Давайте для начала рассмотрим более подробно свойство length JavaScript. Допустим у нас есть массив:

[php]

mas =[1,2,3,4,5,6,7];

[/php]

Длина этого массива равна 7, номер последнего элемента массива равен 6, то есть если мы обратимся к свойству length, то получим число 7. Но у нас есть возможность изменить свойство length для каждого конкретного массива, как в большую, так и в меньшую сторону, если мы изменим свойство length JavaScript для нашего массива, скажем на 5, то тем самым мы удалим два последних элемента массива JavaScript:

[php]

mas =[1,2,3,4,5,6,7];

mas.length; //получаем значение 7, наш массив будет содержать все 7 элементов

mas.length = 5;// удаляем два последних элемента, наш массив теперь содержит [1,2,3,4,5]

[/php]

А теперь, собственно, о методе массивов JavaScript, который позволяет удалять элементы из массивов. JavaScript массивы имеют функцию pop () JavaScript, функция pop () JavaScript позволяет удалять элементы из массива JavaScript (функция pop () обратна по своему действию функции push ()). Функция pop () удаляет из массива элемент и при этом возвращает значение, которое хранилось в удаленном элементе массива, как вы поняли функция pop () удаляет элементы массива JavaScript с конца, но в JavaScript помимо функции unshift (), есть функция shift (), которая позволяет удалить элементы массива с начала, действие ее противоположно функции unshift ().

Но помимо функций pop (), push (), unshift (), shift (), которые позволяют удалять и добавлять элементы из массива и в массив, есть еще универсальная функция splice () JavaScript, которая работает по диапазону массива, но об этой функции мы поговорим в одной из следующих публикация, в которой будет описана работа с массивами JavaScript. На этом всё, спасибо за внимание, надеюсь, что был хоть чем-то полезен и до скорых встреч на страницах блога для начинающих вебразработчиков и вебмастеров ZametkiNaPolyah.ru. Не забываем комментировать и делиться с друзьями;)