26 Июня 2018 JavaScript Перевод

Умеет ли он мутировать?

img

Список из 30 методов для работы с массивами в JavaScript с пометкой, мутируют ли они существующий массив или возвращают новый

.concat() – не мутирует

Описание

Метод concat() используется для объединения двух или более массивов. Этот метод не изменяет существующие массивы, вместо этого возвращается новый массив

Array.prototype.concat ( [ item1 [ , item2 [ , … ] ] ] )

Пример

var array1 = ['a', 'b', 'c'];
var array2 = ['d', 'e', 'f'];
console.log(array1.concat(array2));
// вывод в консоль: Array ["a", "b", "c", "d", "e", "f"]

.copyWithin() - мутирует

Описание

Метод copyWithin() копирует часть массива в другое место в том же массиве и возвращает его без изменения размера.

arr.copyWithin(target)
arr.copyWithin(target, start)
arr.copyWithin(target, start, end)

Пример

var array1 = [1, 2, 3, 4, 5];

// копировать в позицию 0 элемент между позициями 3 и 4 
console.log(array1.copyWithin(0, 3, 4));
// вывод в консоль: Array [4, 2, 3, 4, 5]

// копировать в позицию 1 элементы после 3 позиции
console.log(array1.copyWithin(1, 3));
// вывод в консоль: Array [4, 4, 5, 4, 5]

.entries() – не мутирует

Описание

Метод entries() возвращает новый объект Array Iterator, содержащий пары ключ/значение для каждого индекса в массиве.

a.entries()

Пример

var array1 = ['a', 'b', 'c'];
var iterator1 = array1.entries();
console.log(iterator1.next().value);
// вывод в консоль: Array [0, "a"]
console.log(iterator1.next().value);
// вывод в консоль: Array [1, "b"]

.every() – не мутирует

Описание

Метод every() проверяет, прошли ли все элементы массива условию, заданному в передаваемой функции.

Array.prototype.every ( callbackfn [ , thisArg ] )

Пример

function isBelowThreshold(currentValue) {
 return currentValue < 40;
}
var array1 = [1, 30, 39, 29, 10, 13];
console.log(array1.every(isBelowThreshold));
// вывод в консоль: true

.fill() - мутирует

Описание

Метод fill() заполняет все элементы массива от начального индекса до конечного со статическим значением.

arr.fill(value)
arr.fill(value, start)
arr.fill(value, start, end)

Пример

var array1 = [1, 2, 3, 4]

// заполняет 0 начиная с позиции 2 до 4 позиции
console.log(array1.fill(0, 2, 4));
// вывод в консоль: [1, 2, 0, 0]

// заполняет 5 с позиции 1
console.log(array1.fill(5, 1));
// вывод в консоль: [1, 5, 5, 5]

console.log(array1.fill(6));
// вывод в консоль: [6, 6, 6, 6]

.filter() - не мутирует

Описание

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

Array.prototype.filter ( callbackfn [ , thisArg ] )

Пример

var words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];
const result = words.filter(word => word.length > 6);
console.log(result);
// вывод в консоль: Array ["exuberant", "destruction", "present"]

.find() - не мутирует

Описание

Метод find() возвращает значение первого элемента в массиве, который удовлетворяет условия функции. В противном случае возвращается undefined.

arr.find(callback[, thisArg])

Пример

var array1 = [5, 12, 8, 130, 44];
var found = array1.find(function(element) {
 return element > 10;
});
console.log(found);
// вывод в консоль: 12

.findIndex() - не мутирует

Описание

Метод findIndex() возвращает индекс первого элемента в массиве, который удовлетворяет условию функции. В противном случае возвращается -1.

arr.findIndex(callback[, thisArg])

Пример

var array1 = [5, 12, 8, 130, 44];
function findFirstLargeNumber(element) {
 return element > 13;
}
console.log(array1.findIndex(findFirstLargeNumber));
// вывод в консоль: 3

.forEach() - не мутирует

Описание

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

Array.prototype.forEach ( callbackfn [ , thisArg ] )

Пример

var array1 = ['a', 'b', 'c'];
array1.forEach(function(element) {
 console.log(element);
});
// вывод в консоль: "a"
// вывод в консоль: "b"
// вывод в консоль: "c"

.includes() - не мутирует

Описание

Метод includes() определяет, содержит ли массив некоторый элемент, возвращая true или false соответственно.

arr.includes(searchElement)
arr.includes(searchElement, fromIndex)

Пример

var array1 = [1, 2, 3];
console.log(array1.includes(2));
// вывод в консоль: true
var pets = ['cat', 'dog', 'bat'];
console.log(pets.includes('cat'));
// вывод в консоль: true
console.log(pets.includes('at'));
// вывод в консоль: false

.indexOf() - не мутирует

Описание

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

Array.prototype.indexOf ( searchElement [ , fromIndex ] )

Пример

var beasts = ['ant', 'bison', 'camel', 'duck', 'bison'];
console.log(beasts.indexOf('bison'));
// вывод в консоль: 1

// начало с индекса 2
console.log(beasts.indexOf('bison', 2));
// вывод в консоль: 4
 
console.log(beasts.indexOf('giraffe'));
// вывод в консоль: -1

.join() - не мутирует

Описание

Метод join() объединяет все элементы массива в строку.

Array.prototype.join (separator)

Пример

var elements = ['Fire', 'Wind', 'Rain'];
 
console.log(elements.join());
// вывод в консоль: Fire,Wind,Rain
 
console.log(elements.join(''));
// вывод в консоль: FireWindRain
 
console.log(elements.join('-'));
// вывод в консоль: Fire-Wind-Rain

.keys() - не мутирует

Описание

Метод keys() возвращает новый итератор массива (Array Iterator), содержащий ключи каждого индекса в массиве.

arr.keys()

Пример

var array1 = ['a', 'b', 'c'];
var iterator = array1.keys(); 
 
for (let key of iterator) {
 console.log(key); // вывод в консоль: 0 1 2
}

.lastIndexOf() - не мутирует

Описание

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

Array.prototype.lastIndexOf ( searchElement [ , fromIndex ] )

Пример

var animals = ['Dodo', 'Tiger', 'Penguin', 'Dodo'];
 
console.log(animals.lastIndexOf('Dodo'));
// вывод в консоль: 3
 
console.log(animals.lastIndexOf('Tiger'));
// вывод в консоль: 1

.map() - не мутирует

Описание

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

Array.prototype.map ( callbackfn [ , thisArg ] )

Пример

var array1 = [1, 4, 9, 16];
 
// передача функции в  map
const map1 = array1.map(x => x * 2);
 
console.log(map1);
// вывод в консоль: Array [2, 8, 18, 32]

.pop() - мутирует

Описание

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

Array.prototype.pop()

Пример

var plants = ['broccoli', 'cauliflower', 'cabbage', 'kale', 'tomato'];
 
console.log(plants.pop());
// вывод в консоль: "tomato"
 
console.log(plants);
// вывод в консоль: Array ["broccoli", "cauliflower", "cabbage", "kale"]
 
plants.pop();
 
console.log(plants);
// вывод в консоль: Array ["broccoli", "cauliflower", "cabbage"]

.push() - мутирует

Описание

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

Array.prototype.push ( [ item1 [ , item2 [ , … ] ] ] )

Пример

var animals = ['pigs', 'goats', 'sheep'];
 
console.log(animals.push('cows'));
// вывод в консоль: 4
 
console.log(animals);
// вывод в консоль: Array ["pigs", "goats", "sheep", "cows"]
 
animals.push('chickens');
 
console.log(animals);
// вывод в консоль: Array ["pigs", "goats", "sheep", "cows", "chickens"] 

.reduce - не мутирует

Описание

Метод reduce() применяет функцию к аккумулятору и каждому значению массива (слева - направо), сводя его к одному значению.

Array.prototype.reduce ( callbackfn [ , initialValue ] )

Пример

const array1 = [1, 2, 3, 4];
const reducer = (accumulator, currentValue) => accumulator + currentValue;
 
// 1 + 2 + 3 + 4
console.log(array1.reduce(reducer));
// вывод в консоль: 10
 
// 5 + 1 + 2 + 3 + 4
console.log(array1.reduce(reducer, 5));
// вывод в консоль: 15

.reduceRight() - не мутирует

Описание

Метод reduceRight() применяет функцию к аккумулятору и каждому значению массива (справа - налево), сводя его к одному значению.

Array.prototype.reduceRight ( callbackfn [ , initialValue ] )

Пример

const array1 = [[0, 1], [2, 3], [4, 5]].reduceRight(
 (previousValue, currentValue) => previousValue.concat(currentValue)
);
 
console.log(array1);
// вывод в консоль: Array [4, 5, 2, 3, 0, 1]

.reverse() - мутирует

Описание

Метод reverse() переворачивает массив. Первый элемент массива становится последним, а последний элемент массива становится первым.

Array.prototype.reverse()

Пример

var array1 = ['one', 'two', 'three'];
var reversed = array1.reverse(); 
 
console.log(array1);
// вывод в консоль: Array ['three', 'two', 'one']
 
console.log(reversed);
// вывод в консоль: Array ['three', 'two', 'one']

.shift() - мутирует

Описание

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

Array.prototype.shift()

Пример

var array1 = [1, 2, 3];
 
var firstElement = array1.shift();
 
console.log(array1);
// вывод в консоль: Array [2, 3]
 
console.log(firstElement);
// вывод в консоль: 1

.slice() - не мутирует

Описание

Метод slice() возвращает копию части массива в новый массив, выбранный от начала до конца (конец не включен). Исходный массив не будет изменен.

Array.prototype.slice (start, end)

Пример

var animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];
 
console.log(animals.slice(2));
// вывод в консоль: Array ["camel", "duck", "elephant"]
 
console.log(animals.slice(2, 4));
// вывод в консоль: Array ["camel", "duck"]

console.log(animals.slice(1, 5));
// вывод в консоль: Array ["bison", "camel", "duck", "elephant"]

.some() - не мутирует

Описание

Метод some() проверяет, прошел ли какой-либо элемент в массиве условие заданной функции.

Array.prototype.some ( callbackfn [ , thisArg ] )

Пример

var array = [1, 2, 3, 4, 5];
 
var even = function(element) {
 // проверяет, является ли элемент чётным
 return element % 2 === 0;
};
 
console.log(array.some(even));
// вывод в консоль: true

.sort() - мутирует

Описание

Метод sort() сортирует элементы массива и возвращает отсортированный массив. Сортировка не обязательно устойчива. Порядок сортировки по умолчанию соответствует порядку кодовых точек Unicode.

Array.prototype.sort (comparefn)

Пример

var months = ['March', 'Jan', 'Feb', 'Dec'];
months.sort();
console.log(months);
// вывод в консоль: Array ["Dec", "Feb", "Jan", "March"]
 
var array1 = [1, 30, 4, 21];
array1.sort();
console.log(array1);
// вывод в консоль: Array [1, 21, 30, 4]

.splice() - мутирует

Описание

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

Array.prototype.splice (start, deleteCount [ , item1 [ , item2 [ , … ] ] ] )

Пример

var months = ['Jan', 'March', 'April', 'June'];
months.splice(1, 0, 'Feb');
// вставить в позицию по индексу 1
console.log(months);
// вывод в консоль: Array ['Jan', 'Feb', 'March', 'April', 'June']
 
months.splice(4, 1, 'May');
// заменить  один элемент на 4 позиции
console.log(months);
// вывод в консоль: Array ['Jan', 'Feb', 'March', 'April', 'May']

.toLocaleString() - не мутирует

Описание

Метод toLocaleString() возвращает строковое представление массива. Элементы преобразуются в строки с использованием своих методов toLocaleString, и эти строки разделяются локале-зависимой строкой (например, запятой ",").

Array.prototype.toLocaleString ( )

Пример

var array1 = [1, 'a', new Date('21 Dec 1997 14:12:00 UTC')];
var localeString = array1.toLocaleString('en', {timeZone: "UTC"});
 
console.log(localeString);
// вывод в консоль: "1,a,12/21/1997, 2:12:00 PM",
// В этом примере «en» - локаль, а часовой пояс UTC - ваши результаты могут варьироваться

.toSource() - не мутирует

Описание

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

arr.toSource()

Пример

Not available

.toString() - не мутирует

Описание

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

Array.prototype.toString()

Пример

var array1 = [1, 2, 'a', '1a'];
 
console.log(array1.toString());
// вывод в консоль: "1,2,a,1a"

.unshift() - мутирует

Описание

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

Array.prototype.unshift ( [ item1 [ , item2 [ , … ] ] ] )

Пример

var array1 = [1, 2, 3];
 
console.log(array1.unshift(4, 5));
// вывод в консоль: 5
 
console.log(array1);
// вывод в консоль: Array [4, 5, 1, 2, 3]

.values() - не мутирует

Описание

Метод values() возвращает новый объект Array Iterator, который содержит значения для каждого индекса в массиве.

arr.values()

Пример

const array1 = ['a', 'b', 'c'];
const iterator = array1.values();
 
for (const value of iterator) {
 console.log(value); // вывод в консоль: "a" "b" "c"
}

Оригинал: Does it mutate 😱