Введите ваш адрес почты


sdcvoy.ru
Понравился сайт? Поделись с друзьями!
Главная » Javascript » Massivy-v-js-metody

Массивы в JS: методы.

Массивы: методыВ этом уроке вы отдельно познакомитесь с некоторыми методами работы с массивами в JavaScript. И первый методом, с которым вы познакомитесь будет метод join.

Метод join()

Этот метод склеивает превращает массив в строку, а в скобках указывается разделитель:

var arr=['3434', 2323, 'имя'];
alert(arr.join('||')); // выведет строку 3434||2323||имя

Интересным способом можно создать повторение строки, для этого нам понадобиться конструкция new Array + join:

var arr=new Array(3);
alert( arr.join("ха ") ); // ха ха

В этом примере мы создали массив с длиной length=3, то есть в нашем массиве 3 элемента с неприсвоенным значением undefined, с помощью метода join мы раздели их в вставили между ними слово «ха».

Метод split()

Это обратный метод, является полной противоположностью предыдущего метода. С его помощью вы можете превратить строку в массив. Метод split кроме разделителя имеет ещё один параметр благодаря которому мы можем уменьшить создаваемый массив:

var names = 'грузовик, поезд, самолёт, Маша';

var arr = names.split(', ', 3);
alert(arr); // выведет грузовик, поезд, самолёт
alert(arr.length); // выведет 3

На практике в большинстве случаев второй параметр не используют.

Удаление значения элемента

Удалить значение элемента можно двумя способами с помощью свойства delete, либо присваивание значения undefined:

var arr = [ 'login', 'pass', 'email' ];
arr[0]=undefined;
delete arr[2];

for (var i=0; i<arr.length; i++) {
alert(typeof arr[i]);
};

Метод .splice()

Метод .splice() является универсальным методом, он многое умеет делать, а именно: удалять, заменять, вставлять элементы. Имеет следующий синтаксис:

.splice( index[, deleteCount, elem1, ..., elemN] );

Где:

Осталось увидеть этот метод в действии, рассмотрим небольшой пример:

var arr = ["HTML", "язык", "гипертекста"];
arr.splice(2, 0, "разметки" );
alert(arr); // выведет HTML,язык,разметки,гипертекста
alert(arr.splice(2,1)); // возвратит значение "разметки" и вернёт массив в первоначальный вид 
alert(arr); // выведет HTML,язык,гипертекста 

Как вы наверное заметили, можно вообще не удалять элементы из массива, достаточно просто указать второй параметр равный нулю. В этом методе в значении index могут быть и отрицательные значения. В таком случае отчёт элементов будет начинаться с конца:

var arr = ["HTML", "язык", "гипертекста"];

var str=alert(arr.splice(-3, 1 ).join('').split('')); // выведет H,T,M,L

alert( arr ); // выведет язык,гипертекста

Что же произошло во второй строчке? С помощью .splice(-3, 1 ) я возвратил значение массива «HTML», затем с помощью метода .join() преобразовали массив в строку и в конце
разбили эту строчку по буквам. По сути мы создали ещё один массив str. Вопрос к вам как можно вывести строчку «гипертекст» (ссылка на этот пример будет в конце статьи).

Метод .slice()

С помощью метода slice вы можете скопировать участок массива, не включая последний элемент. Синтаксис у данного метода имеет следующий вид:

массив.slice(начало, конец);

Сам массив останется неизменным. Предлагаю взглянуть на пример и тогда всё станет понятно:

var arr1=["user", "root", "admin","superUser"];
var arr2=arr1.slice(2);
var arr3=arr1.slice(0,2);
alert (arr2); // выведет admin,superUser
alert (arr3); // выведет user,root

Из примера видно, что если не указывать второй параметр, то участок берётся до конца массива. Можно также использовать и отрицательные значения:

var arr2 = arr1.slice(-3); // копировать участок массива от 3-го элемента с конца и дальше

Метод сортировки .sort()

Само название метода говорит само за себя, с помощью него мы можем сортировать массив на месте:

var arr=["user", "root", "admin","superUser"];
arr.sort();
alert(arr); // выведет admin,root,superUser,user

Здесь вроде бы всё просто, я отсортировал название элементов по алфавиту, но с числами дела обстоят несколько сложнее:

var arr=[2,47,3,8];
arr.sort();
alert(arr); // выведет 2,3,47,8 

Правда странно? Хотя здесь нет ничего странного, ведь метод .sort() преобразует числа в строки, а как вы знаете из сравнения строк «8» больше «43». Так как же быть? Всё просто, надо сделать функцию сравнения двух соседних чисел и вызвать её с помощью метода sort:

function sortNumeric(a, b) {
  return a - b;
} 

var arr=[2,47,3,8];
arr.sort(sortNumeric);
alert(arr); // выведет 2,3,8,47 

Метод .reverse()

Метод .reverse() меняет порядок сортировки элементов в массиве на обратный:

var arr=['один', 'два', 'три', 'четыре', 'пять'];
arr.reverse();
alert(arr); // выведет пять,четыре,три,два,один 

Метод concat()

С помощью метода concat() создаётся новый массив, в который могут быть добавлены новые элементы из concat():

var arr=[1,435,56576,3443];
alert( arr.concat(23,343,"newWord") ); // 1,435,56576,3443,23,343,newWord

Методы indexOf()/lastIndexOf()

Эти методы по синтаксису полностью аналогичны методам indexOf()/lastIndexOf() для строк:

var arr=["user", "root", "admin","superUser"];
alert( arr.indexOf('user') ); // 0
alert( arr.indexOf(undefined) ); // -1

Метод Object.keys()

Это последний метод, который мы с вами рассмотрим. Он позволяет представить свойства объекта в виде массива:

var user = {
  login: "admin",
  password: "pass"
}

var arrKeys = Object.keys(user); // создаём массив из ключей объекта

alert( arrKeys ); // login,password

Если кто прочитал до конца, как я и обещал вот ссылка на ответ задачи: https://jsfiddle.net/nightgremlin/4bmgvpdn/.



наверх