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 не будет опубликован. Обязательные поля помечены *