Javascript массив, методы массива

Что такое массив и как он выглядит, мы уже знаем из урока Javascript основные элементы, теперь будем с ним работать.

Создаём массив, который будем использовать во всех последующих примерах.


<script>
var a = ['ноль',' один',' два',' три',' четыре',' пять'];
document.write(a);
</script>

Пробел внутри апостроф отображается пробелом на экране. При написании программ пробел не ставится.

18

В дальнейшем во всех примерах, кроме первого, будут выводиться два значения:

а) то что возвращает оператор;

б) то что принимает изначальный массив.

Для работы с массивами есть несколько методов.

1. Метод length — определяет количество элементов массива.

Массив может быть очень объёмным, и пересчитывать его в ручную — дело очень кропотливое, да и ненужное.

Достаточно вывести на экран имя массива с методом length (длина), и вы узнаете точное количество элементов нём.

Учтите, метод length выведет вам число элементов по счёту, т.е начиная с единицы. Номера элементов начинаются с нуля.


<script>
var a = ['ноль',' один',' два',' три',' четыре',' пять'];
document.write(a.length);
</script>

Этот скрипт выведет цифру 6.

2. Метод push — добавляет элемент в конец массива.

В условии указывается название или число добавляемого элемента.


<script>
var a = ['ноль',' один',' два',' три',' четыре',' пять'];
var b = a.push(' шесть');
document.write(b + '<br>');
document.write(a);
</script>

Возвращает длину нового массива (число).

В конец исходного массива добавляется элемент, т.е. меняет начальные данные.

24

3. Метод pop — удаляет последний элемент массива.

В условии не указывается ничего. Удаление происходит по умолчанию.


<script>
var a = ['ноль',' один',' два',' три',' четыре',' пять'];
var b = a.pop();
document.write(b + '<br>');
document.write(a);
</script>

Возвращает удалённый элемент.

Исходный массив остаётся без последнего элемента.

25

4. Метод unshift — добавляет элемент в начало массива.


<script>
var a = [' ноль',' один',' два',' три',' четыре',' пять'];
var b = a.unshift(' минус');
document.write(b + <'br'>);
document.write(a);
</script>

Возвращает длину массива (число).

В исходный массив добавляет элемент в начало, т.е меняет начальные данные.

26

5. Метод shift — удаляет элемент в начале массива.


<script>
var a = [' ноль',' один',' два',' три',' четыре',' пять'];
var b = a.shift(' минус');
document.write(b + '<br>');
document.write(a);
</script>

Возвращает удалённый элемент.

Исходный массив остаётся без первого элемента.

27

6. Метод concat — объединяет два массива в один.


<script>
var a = ['ноль',' один',' два'];
var b = [' три',' четыре',' пять'];
var c = a.concat(b);
document.write(a + '<br>');
document.write(b + '<br>');
document.write(c);
</script>

Возвращает объединённый массив не меняя исходные.

28

7. Метод sort — сортирует массив. Сортировка происходит следующим образом:

a) строка (слова) выстраиваются по первой букве в слове по алфавиту. Английские по латинскому, русские по кириллическому.

в) цифры выстраиваются по по первому знаку например: цифры 1, 13, 176 построятся друг за другом, а цифры 2, 21, 240 после них и т.д.


<script>
var a = ['ноль',' один',' два',' три',' четыре',' пять'];
var b = a.sort();
document.write(a + '<br>');
document.write(b);
</script>

Возвращает отсортированный массив.

Исходный так же становится отсортированным.

29


<script>
var a = [2,7,17,21,329,1,453,29];
var b = a.sort();
document.write(a + '<br>');
document.write(b);
</script>

30

8. Метод reverse — меняет порядок элементов на противоположный.


<script>
var a = [' ноль',' один',' два',' три',' четыре',' пять'];
var b = a.reverse();
document.write(a + '<br>');
document.write(b);
</script>

Меняет порядок элементов как в возвращённом, так и в исходном массивах.

31

9. Метод join — отвечает за знак между элементами массива. Если в массиве между элементами стоит запятая, то join может поменять её на любой другой, который вы укажете в его аргументе.


<script>
var a = [' ноль',' один',' два',' три',' четыре',' пять'];
var b = a.join('&');
document.write(a + '<br>');
document.write(b);
</script>

Возвращает массив с изменённым знаком.

Исходный массив не меняется.

32

10. Метод slice — вырезает часть массива, при этом исходный массив остаётся целым.

Чтобы вырезать часть массива, в аргументах slice указываются номера элементов, с какого по какой делается выборка.


<script>
var a = [' ноль',' один',' два',' три',' четыре',' пять'];
var b = a.slice(1, 5);
document.write(a + '<br>');
document.write(b);
</script>

Возвращает вырезанную часть, при этом исходник остаётся целым.

33

11. splice — позволяет добавлять в массив любое количество элементов.

Для этого в параметрах метода в начале указываются два значения: первое — индекс элемента после которого будут добавляться элементы, а второе 0, после чего вносятся те элементы которые будут добавляться.


<script>
var a = [' ноль',' один',' два',' три',' четыре',' пять'];
var b = a.splice(6, 0, ' шесть',' семь',' восемь');
document.write(a + '<br>');
document.write(b);
</script>

Возвращает пустой массив, а все изменения вносятся в исходник.

34

12. Метод filter — позволяет отобрать элементы похожие по какому либо признаку.

Параметром в этом методе является функция, которая и производит сравнение.

Например отберём все чётные числа.


<script>
var a = [1, 2, 3, 4, 5, 6, 7, 8];
var b = a.filter(function (item) {
return item % 2 == 0;
});
document.write(a + '<br>');
document.write(b);
</script>

Возвращает четные числа.

Исходник без изменений.

35

12. Метод forEach — параметр функция, которая одинаково воздействует на каждый элемент массива.

Например, расположим каждый элемент с новой строки (столбиком).


<script>
var a = [' ноль',' один',' два',' три',' четыре',' пять'];
a.forEach(function (item) { // item - один пункт
document.write(item + '<br>');
});
</script>

36

13. Метод map — создаёт массив из изменённых элементов исходного.

В параметр принимается функция изменяющая элементы.


<script>
var a = [' ноль',' один',' два',' три',' четыре',' пять'];
var b = a.map(function (item) {
return item + 'OK';
});
document.write(b + '<br>');
document.write(a);
</script>

Возвращает новый массив.

Исходный массив без изменений.

37

14. Метод some — проверяет массив на соответствие всех элементов какому либо требованию.

В случае соответствия выдаёт true (верно).

В случае несоответствия выдаёт false (не верно).

Например, проверим все-ли элементы чётные.


<script>
var a = [2, 4, 6, 8, 10];
var b = a.every(function (item) {
return item % 2 == 0;
});
document.write(b);
</script>

38

Теперь добавим в массив нечетную цифру.


<script>
var a = [2, 4, 5, 6, 8, 10];
var b = a.every(function (item) {
return item % 2 == 0;
});
document.write(b);
</script>

39

С методами массива пока всё.

Javascript стили < < < В раздел > > > Цикл с массивом

Запись опубликована в рубрике Уроки javascript и jQuery. Добавьте в закладки постоянную ссылку.
А так же:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *