Это важная часть программирования на любом языке. Есть и другие способы манипулирования массивом, но эти способы я использую чаще всего. Надеюсь, это поможет! Если вам нужна дополнительная помощь, не стесняйтесь, присылайте мне сообщение в Twitter.
нанизывать()
Метод JavaScript toString()
преобразует массив в строку, разделенную запятой.
let colors = ['green', 'yellow', 'blue'];
console.log(colors.toString()); // green,yellow,blue
присоединиться()
Метод JavaScript join()
объединяет все элементы массива в строку.
Он похож на метод toString()
, но здесь вы можете указать разделитель вместо запятой по умолчанию.
let colors = ['green', 'yellow', 'blue'];
console.log(colors.join('-')); // green-yellow-blue
конкат()
Этот метод объединяет два массива вместе или добавляет больше элементов в массив, а затем возвращает новый массив.
let firstNumbers = [1, 2, 3];
let secondNumbers = [4, 5, 6];
let merged = firstNumbers.concat(secondNumbers);
console.log(merged); // [1, 2, 3, 4, 5, 6]
толкать()
Этот метод добавляет элементы в конец массива и изменяет исходный массив.
let browsers = ['chrome', 'firefox', 'edge'];
browsers.push('safari', 'opera mini');
console.log(browsers);
// ["chrome", "firefox", "edge", "safari", "opera mini"]
поп()
Этот метод удаляет последний элемент массива и возвращает его.
let browsers = ['chrome', 'firefox', 'edge'];
browsers.pop(); // "edge"
console.log(browsers); // ["chrome", "firefox"]
сдвиг()
Этот метод удаляет первый элемент массива и возвращает его.
let browsers = ['chrome', 'firefox', 'edge'];
browsers.shift(); // "chrome"
console.log(browsers); // ["firefox", "edge"]
отменить сдвиг ()
Этот метод добавляет элементы в начало массива и изменяет исходный массив.
let browsers = ['chrome', 'firefox', 'edge'];
browsers.unshift('safari');
console.log(browsers); // ["safari", "chrome", "firefox", "edge"]
Вы также можете добавить несколько элементов одновременно
соединение ()
Этотметод изменяет массив, добавляя, удаляя и вставляя элементы.
Синтаксис:
array.splice(index[, deleteCount, element1, ..., elementN])
Index
это отправная точка для удаления элементов в массивеdeleteCount
количество элементов, которые нужно удалить из этого индексаelement1, …, elementN
элемент(ы), которые нужно добавить
Удаление элементов
после запуска splice() он возвращает массив с удаленными элементами и удаляет их из исходного массива.
let colors = ['green', 'yellow', 'blue', 'purple'];
colors.splice(0, 3);
console.log(colors); // ["purple"]
// deletes ["green", "yellow", "blue"]
Примечание. В поле deleteCount не входит последний индекс в диапазоне.
Если второй параметр не объявлен, каждый элемент, начинающийся с заданного индекса, будет удален из массива:
let colors = ['green', 'yellow', 'blue', 'purple'];
colors.splice(3);
console.log(colors); // ["green", "yellow", "blue"]
// deletes ['purple']
В следующем примере мы удалим 3 элемента из массива и заменим их другими элементами:
let schedule = ['I', 'have', 'a', 'meeting', 'tomorrow'];
// removes 4 first elements and replace them with another
schedule.splice(0, 4, 'we', 'are', 'going', 'to', 'swim');
console.log(schedule);
// ["we", "are", "going", "to", "swim", "tomorrow"]
Добавление элементов
Чтобы добавить элементы, нам нужно установить deleteCount
на ноль.
let schedule = ['I', 'have', 'a', 'meeting', 'with'];
// adds 3 new elements to the array
schedule.splice(5, 0, 'some', 'clients', 'tomorrow');
console.log(schedule);
// ["I", "have", "a", "meeting", "with", "some", "clients", "tomorrow"]
ломтик()
Этот метод похож на
splice()
, но сильно отличается. Он возвращает подмассивы вместо подстрок.
Этот метод копирует заданную часть массива и возвращает эту скопированную часть в виде нового массива. Исходный массив не изменяется.
Синтаксис:
array.slice(start, end)
Вот простой пример:
let numbers = [1, 2, 3, 4]
numbers.slice(0, 3)
// returns [1, 2, 3]
console.log(numbers) // returns the original array
Лучший способ использовать slice()
— присвоить его новой переменной.
let message = 'congratulations'
const abbrv = message.slice(0, 7) + 's!';
console.log(abbrv) // returns "congrats!"
расколоть()
Этот метод используется для строк. Он делит строку на подстроки и возвращает их в виде массива.
Вот синтаксис: string.split(separator, limit);
- Здесь
separator
определяет, как разделить строку либо запятой. limit
определяет количество выполняемых шпагатов.
let firstName = 'joseph';
// return the string as an array
firstName.split() // ["joseph"]
другой пример:
let firstName = 'hello, my name is joseph, I am a dev.';
firstName.split(',', 2); // ["hello", " my name is joseph"]
Примечание: если мы объявим пустой массив, например
firstName.split('');
, то каждый элемент в строке будет разделен на подстроки:
let firstName = 'jolaji';
firstName.split('') // ["j", "o", "s", "e", "p", "h"]
индекс чего-либо()
Этот метод ищет элемент в массиве и возвращает индекс, где он был найден, в противном случае он возвращает -1
.
let fruits = ['apple', 'orange', false, 3]
fruits.indexOf('orange'); // returns 1
fruits.indexOf(3); // returns 3
fruits.indexOf(null); // returns -1 (not found)
последнийИндексОф()
Этот метод работает так же, как indexOf(), за исключением того, что он работает справа налево. Возвращает последний индекс, в котором элемент был найден
let fruits = ['apple', 'orange', false, 3, 'apple']
fruits.lastIndexOf('apple'); // returns 4
фильтр()
Этот метод создает новый массив, если элементы массива соответствуют определенному условию.
Синтаксис:
let results = array.filter(function(item, index, array) {
// returns true if the item passes the filter
});
Пример:
Проверяет пользователей из Нигерии
const countryCode = ['+234', '+144', '+233', '+234'];
const nigerian = countryCode.filter( code => code === '+234');
console.log(nigerian); // ["+234", "+234"]
карта()
Этот метод создает новый массив, манипулируя значениями в массиве.
Пример:
Отображает имена пользователей на странице. (Отображение основного списка друзей)
const userNames = ['tina', 'danny', 'mark', 'bolaji'];
const display = userNames.map(item => {
return '<li>' + item + '</li>';
})
const render = '<ul>' + display.join('') + '</ul>';
document.write(render);
другой пример:
// adds dollar sign to numbers
const numbers = [10, 3, 4, 6];
const dollars = numbers.map( number => '$' + number);
console.log(dollars);
// ['$10', '$3', '$4', '$6'];
для каждого()
Этот метод хорош для перебора массива.
Применяет функцию ко всем элементам массива
const colors = ['green', 'yellow', 'blue'];
colors.forEach((item, index) => console.log(index, item));
// returns the index and the every item in the array
// 0 "green"
// 1 "yellow"
// 2 "blue"
итерация может быть выполнена без передачи аргумента индекса
const colors = ['green', 'yellow', 'blue'];
colors.forEach((item) => console.log(item));
// returns every item in the array
// "green"
// "yellow"
// "blue"
каждый()
Этот метод проверяет, соответствуют ли все элементы в массиве указанному условию, и возвращает true
, если они выполнены, иначе false
.
проверить, все ли числа положительные
const numbers = [1, -1, 2, 3];
let allPositive = numbers.every((value) => {
return value >= 0;
})
console.log(allPositive); // would return false
немного()
Этот метод проверяет, соответствует ли элемент (один или несколько) в массиве указанному условию, и возвращает true, если он прошел, иначе false.
проверяет, является ли хотя бы одно число положительным
const numbers = [1, -1, 2, 3];
let atLeastOnePositive = numbers.some((value) => {
return value >= 0;
})
console.log(atLeastOnePositive); // would return true
включает в себя()
Этот метод проверяет, содержит ли массив определенный элемент. Он похож на .some()
, но вместо того, чтобы искать определенное условие для прохождения, он проверяет, содержит ли массив определенный элемент.
let users = ['paddy', 'zaddy', 'faddy', 'baddy'];
users.includes('baddy'); // returns true
Если элемент не найден, возвращается false
Резюме
- toString()преобразует массив в строку, разделенную запятой.
- join() объединяет все элементы массива в строку.
- concat объединяет два массива вместе или добавляет в массив дополнительные элементы, а затем возвращает новый массив.
- push() добавляет элементы в конец массива и меняет исходный массив.
- pop() удаляет последний элемент массива и возвращает его
- shift() удаляет первый элемент массива и возвращает его
- unshift() добавляет элемент(ы) в начало массива и изменяет исходный массив.
- splice() изменяет массив, добавляя, удаляя и вставляя элементы.
- slice() копируетданную часть массива и возвращает эту скопированную часть в виде нового массива. Исходный массив не изменяется.
- split() делит строку на подстроки и возвращает их в виде массива.
- indexOf() ищет элемент в массиве и возвращает индекс, где он был найден, иначе возвращает
-1
- lastIndexOf() ищет элемент справа налево и возвращает последний индекс, в котором элемент был найден.
- filter() создает новый массив, если элементы массива соответствуют определенному условию.
- map() создает новый массив, манипулируя значениями в массиве.
- forEach() перебирает массив и применяет функцию ко всем элементам массива.
- every() проверяет, соответствуют ли все элементы в массиве указанному условию, и возвращает true, если оно выполнено, иначе false.
- some() проверяет, соответствует ли элемент (один или несколько) в массиве указанному условию, и возвращает true, если он прошел, иначе false.
- includes() проверяет, содержит ли массив определенный элемент.