Памятка по методам работы с массивами в JavaScript

Массивы — это специальные объекты, которые представляют собой наборы элементов подобного типа в JavaScript.

Когда дело доходит до массивов JavaScript, есть несколько способов их создания:

// by array literal
var arrayname = [value1,value2.....valueN];  

// by directly creating an instance of an array using the new keyword.
var arrayname = new Array();  

// by using the new keyword and an Array constructor
var emp = new Array("Red", "Green", "Blue");

Методы массива

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

1. конкат()

Функция concat() объединяет два или более массивов и создает новый массив, не изменяя исходный.

const arr1 = [ 2, 4, 6];
const arr2 = [ 8, 10, 12];
const arr3 = [ 14, 16, 18];
console.log(arr1.concat(arr2, arr3));

// Output 
[2, 4, 6, 8, 10, 12, 14, 16, 18]

Вы также можете передать строку в качестве аргумента.

const arr1 = ["Red", "Green", "Blue"];
console.log(arr1.concat("Yellow"));

// Output
[ "Red", "Green", "Blue", "Yellow" ]

2. для каждого()

Метод forEach() помогает перебирать массив в цикле с выполнением предоставленной функции обратного вызова для каждого элемента массива.

var colors = ["Red", "Green", "Blue"];    
colors.forEach(function(color) {  
console.log(color);  
}); 

// Output 
"Red"
"Green"
"Blue"

3. индекс()

Метод indexOf() дает вам индекс первого существования элемента, который вы ищете, или дает вам -1, если элемента нет.

var numbers = [30, 40, 50, 60, 30, 40];

console.log(numbers.indexOf(40)); // 1

console.log(numbers.indexOf(60)); // 3

4. lastIndexOf()

Метод lastIndexOf() дает вам индекс последнего существования искомого элемента или дает вам -1, если элемента нет. Он использует обратный поиск для поиска элементов.

var numbers = [30, 40, 50, 60, 30, 40, 60];

console.log(numbers.lastIndexOf(40)); // 5

console.log(numbers.lastIndexOf(60)); // 6

5. присоединиться ( )

Метод join() объединяет все элементы, каждый из которых разделен заданным разделителем, и возвращает новую строку.

const alphabets = ["A", "B", "C", "D"];
console.log(alphabets.join('  '));

// Output 
"A  B  C  D"

7. поп ( )

Метод pop() удаляет последний элемент массива и возвращает этот элемент.

const alphabets = ["A", "B", "C", "D"];
alphabets.pop( );
console.log(alphabets);

// Output 
[ "A", "B", "C" ]

8. нажать()

Метод push() помогает добавить один или несколько элементов в конец массива и выводит обновленную длину.

let colors = ["Red", "Green", "Blue"];
colors.push("Yellow");
console.log(colors);

// Output 
[ "Red", "Green", "Blue", "Yellow" ]

9. реверс ( )

Метод reverse() переворачивает массив в нужном положении. Элемент с последним индексом будет первым, а элемент с первым индексом будет последним.

const alphabets = ["A", "B", "C", "D"];
console.log(alphabets.reverse( ));

// Output 
[ "D", "C", "B", "A" ]

10. сдвиг()

Метод shift() удаляет первый элемент из массива и возвращает этот элемент.

const alphabets = ["A", "B", "C", "D"];
alphabets.shift( );
console.log(alphabets);

// Output 
[ "B", "C", "D" ]

11. снять сдвиг()

Unshift() добавляет один или несколько элементов в начало массива и возвращает новую длину массива.

let colors = ["Red", "Green", "Blue"];
colors.unshift("Yellow");
console.log(colors);

// Output
[ "Yellow", "Red", "Green", "Blue" ]

12. срез( )

Метод slice() используется для дублирования раздела массива в другой массив.

const colors = ["Red", "Green", "Blue", "Yellow", "Purple"];
const greenBlue = colors.slice(1, 3);
console.log(greenBlue); 

// Output 
[ "Green", "Blue" ]

где (1) — пусковой параметр, а (3) — остановочный параметр.

13. сращивание ( )

Метод splice() позволяет добавлять элементы в массив посередине. Если вы хотите удалить или заменить существующие элементы, вы также можете использовать этот метод.

let numbers = [1, 2, 3, 4];
numbers.splice(2, 0, 5, 6)
console.log(numbers);

// Output
[ 1, 2, 5, 6, 3, 4 ]

14. сортировать( )

Элементы массива можно сортировать как по возрастанию, так и по убыванию, используя метод sort().

const alphabets = ["B", "A", "D", "C"];
console.log(alphabets.sort( ));

// Output
[ "A", "B", "C", "D" ]

15. включает( )

Метод include() проверяет значение. Если он присутствует в массиве, он вернет true; в противном случае он вернет false.

const alphabets = ["A", "B", "C", "D"];

console.log(alphabets.includes("B")); // return true

console.log(alphabets.includes("G")); // return false

16. найти()

ES5 использует методы indexOf() и lastIndexOf() для поиска элементов в массивах. Метод find() появился в ES6. Этот метод выдает первый элемент в качестве вывода в массиве, который соответствует определенным критериям.

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

let numbers = [1, 3, 4, 6, 7];
console.log(numbers.find(e => e % 2 == 0));

// Output 
4

17. карта ( )

Этот метод вызывает заданную функцию для каждого элемента существующего массива и создает новый массив с выходными данными. В следующем примере показано, как изменить массив целых чисел с помощью callback() и встроенной функции Math.

let numbers = [36, 49, 64, 81];
console.log(numbers.map(Math.sqrt));

// Output 
[ 6, 7, 8, 9 ]

18. фильтр ( )

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

const numbers = [55, 14, 29, 16, 75];
let over20 = numbers.filter(function (value) {
    return value > 20;
});
console.log(over20);

// Output
[ 55, 29, 75 ]

19. уменьшить ( )

Метод reduce() позволяет уменьшить массив до одного значения.

const numbers = [5, 4, 9, 6, 2];
let result = numbers.reduce((sum, current) => sum + current, 0);  
console.log(result);

// Output
26

20. toString()

Метод toString() возвращает массив строк, разделенных запятой. Он не изменяет исходный массив.

const colors = ["Red", "Green", "Blue", "Yellow", "Purple"];
console.log(colors.toString( )); 

// Output
"Red, Green, Blue, Yellow, Purple"

21. каждый( )

Метод Every() используется для проверки того, соответствуют ли все элементы массива определенному условию. Если все элементы соответствуют условию, метод возвращает значение true. В противном случае возвращается ложь.

let numbers = [1, 3, 5];
let result = numbers.every(function (e) {
    return e > 0;
});
console.log(result); // return true

22. некоторые( )

Метод some() определяет, удовлетворяет ли хотя бы один элемент массива установленному состоянию. В соответствии с ответом на требование это возвращает true или false.

let marks = [ 6, 5, 7, 9, 10, 16 ];
lessThanSeven = marks.some(function(e) {
    return e < 7;
});
console.log(lessThanSeven); // return true

23. найтииндекс()

Метод findIndex() возвращает индекс записи элемента в массиве.

let numbers = [1, 15, 7, 8, 10, 15];
let index = numbers.findIndex(number => number === 15);
console.log(index); // 1

Узнайте больше о массивах и методах массивов:

Заворачивать

Для этой статьи это все. Спасибо за чтение. Я надеюсь, что это было полезно для вас. Чтобы узнать больше подобных статей, вы можете подписаться на меня в Hashnode Ishrat, а также в Twitter Ishrat.

Приятного обучения!

Первоначально опубликовано на https://ishratumar18.hashnode.dev.