длина()

  • Свойство length используется для определения размера этого объекта.
  • Он используется со многими объектами, такими как строка JavaScript, массив JavaScript и т. Д.
let arr = ['Sparrow', 'Ostrich', 'Hawk', 'Parrot', 'Seagull', 'Blackbird', 'Penguin', 'Woodpecker']
console.log(arr.length);
// 8
let arrString = ‘helloWorld’;
console.log(arrString.length)
// 11
  • Каждый объект Array имеет свойство length, значение которого всегда является неотрицательным целым числом меньше 2 ²³ (т. Е. 4294967296).
let arr = new Array(4294967296)
console.log(arr.length);
// RangeError: Invalid array length
let arr1 = new Array(-100)
console.log(arr1.length);
// RangeError: Invalid array length

В приведенном выше коде значение arr равно 2 ²³, поэтому мы получаем ошибку «RangeError: недопустимая длина массива». . Чтобы преодолеть ошибку, мы можем установить длину массива меньше 2²³, и поскольку массив должен быть неотрицательным целым числом, поэтому мы получаем ошибку для arr1

  • Когда мы расширяем массив, изменяя свойство length, количество фактических элементов увеличивается, что приводит к тому, что оставшийся увеличенный элемент становится не повторяющимся пустым слотом.
let arr = [1, 2, 3, 4, 5, 6, 7]
console.log(arr.length); 
// 7
arr.length = 9;
console.log(arr) 
// [1, 2, 3, 4, 5, 6, 7, empty × 2]
arr.forEach((elem => console.log(elem))); 
// 1
// 2
// 3
// 4
// 5
// 6
// 7

карта()

  • Он используется для управления каждым элементом массива в массиве.
  • Объект карты содержит пары ключ-значение и запоминает исходный порядок вставки ключей. ~ MDN
  • Функция map () является неизменной (т. е. неизменной)
  • Неизменяемый относится к объектам, состояние которых нельзя изменить после создания объекта.
let myFirstName = "Elon";
let myFullName = myFirstName.concat("Musk")

В приведенном выше коде myFullName равно Илон Маск, а myFirstName равно Илон, что если строковое значение создан, он никогда не может измениться.

  • Никакие строковые методы не изменяют строку, с которой работают, они просто возвращают новые строки. Фактически, числа, строки и логические значения неизменяемы.
let mul = 5*7
console.log(mul)   //35

В приведенном выше примере вывод равен 35, но исходные значения (например, 5 и 7) не меняются.

Почему неизменяемый код лучше, чем изменяемый код в javascript?

Объект, состояние которого может быть изменено после создания объекта, является изменяемым объектом, тогда как в случае неизменяемого объекта состояние не может быть изменено после создания объекта. .

А теперь давайте рассмотрим пример:

let games = {
  musicalChair :"indoor",
  caromPool :"indoor",
  cricket :"outdoor"
}
// ----- IN CASE OF MUTABLE -----
console.log(games)
// { musicalChair:"indoor", caromPool:"indoor", cricket:"outdoor" }
// updating musical chair as outdoor game
games.musicalChair = "outdoor"
console.log(games)
// { musicalChair:"outdoor", caromPool:"indoor", cricket:"outdoor" }
// ----- IN CASE OF IMMUTABLE -----
const {musicalChair, caromPool, cricket} = games
const updateGames = {
  musicalChair : "outdoor"
}
console.log(updateGames)
// {musicalChair: "outdoor"}

В приведенном выше коде я вместо изменения свойства объекта создал целый новый объект.

Какая польза?

  • Неизменяемость увеличивает предсказуемость
  • Позволяет отслеживать мутации
  • Как избежать эталонного конфликта

push () и pop ()

  • push () помогает добавлять элементы в конец массива и возвращает новую длину массива.
  • pop () удаляет последний элемент массива и возвращает этот элемент.
  • В случае пустого массива или если длина массива равна 0, pop () возвращает undefined.
let birds = ['Sparrow', 'Ostrich', 'Hawk', 'Parrot']
// ----- IN CASE OF push() -----
//adding new element to an array
let updateBirds = birds.push('Blackbird', 'Penguin')
console.log(updateBirds)
// 6
console.log(birds) 
//["Sparrow", "Ostrich", "Hawk", "Parrot", "Blackbird", "Penguin"]
// ----- IN CASE OF pop() -----
console.log(birds.pop());
// Parrot
// in case of an empty array
let birds = []
console.log(birds.pop());
// undefined

удалить () и splice ()

  • delete () используется для удаления свойств объекта.
  • Это не повлияет на длину массива.
let data = ["Sparrow", "cricket", "black", "kolkata"];
// checking the length of data before deleting array element
console.log(data.length);  //4
// deleting the third element i.e; "kolkata"
console.log(delete data[3]); //true
console.log(data);
// [ 'Sparrow', 'cricket', 'black', <1 empty item> ]
// checking the length of data after deleting array element
console.log(data.length); //4

Итак, вывод - даже после удаления элемента длина массива такая же, как и раньше.

Чтобы решить эту проблему, мы можем использовать splice ()

let data = ["Sparrow", "cricket", "black", "kolkata"];

// to delete the element from the mentioned index value i.e; "3" to the number of elements should've deleted i.e; "1"
data.splice(3,1)
console.log(data)
//[ 'Sparrow', 'cricket', 'black' ]
console.log(data.length)
// 3

фильтр()

  • filter () метод создает новый массив со всеми элементами, которые проходят проверку, реализованную предоставленной функцией. ~ MDN
  • Он неизменен и представлен в ES6.
  • Этот метод возвращает массив, содержащий элементы родительского массива, соответствующие заданному тесту.
  • Он имеет единственный параметр, метод обратного вызова, который запускается, когда метод фильтра выполняет итерацию по элементам массива.
let arr = [12, 23, 34, 54, 76, 36, 89]
console.log(arr.filter(elem => elem > 50))
//[ 54, 76, 89 ]
console.log(arr.filter(elem => elem > 90))
// []

В приведенном выше примере я взял тестовую функцию (т.е. «› 50 »), которая возвращает новый массив, содержащий элементы, соответствующие заданному тесту.
Но в случае следующего теста функция (т.е. «› 90 ») возвращает пустой массив из-за отсутствия совпадений.

shift () и unshift ()

  • shift () удаляет элемент из начала массива, возвращает элемент, который был удален, обновляет индексы и свойство length.
  • unshift () добавляет элемент в начало массива. Он изменяет исходный массив и возвращает длину исходного массива после изменения.
let names = ['Bill', 'Gates', 'Warren', 'Buffett']
console.log(names.length)  //4
// ----- IN CASE OF shift() -----
console.log(names.shift());
// Bill
// ----- IN CASE OF unshift() -----
names.unshift('Elon', 'Musk');
console.log(names);
// [ 'Elon', 'Musk', 'Bill', 'Gates', 'Warren', 'Buffett' ]
console.log(names.length)  //6

уменьшать()

  • Метод reduce () выполняет функцию reducer для каждого элемента массива, в результате чего получается одно выходное значение.
  • В нем используются некоторые термины, такие как редуктор и аккумулятор.
  • Редуктор - это действие, которое мы выполним, чтобы получить одно значение.
  • Аккумулятор накапливает значения, возвращаемые обратным вызовом.

Возьмем массив calc и сложим все числа, существующие в массиве:

let calc = [2, -4, 6, 8]
let sum = 0;
// ----- IN SIMPLE ALGO -----
for(let elem of calc) {
  sum += elem
}
console.log(sum);
// 12
// ----- USING reduce() METHOD -----
sum = calc.reduce((accumulator, reducer) => {
  return accumulator + reducer;
}, 0)
console.log(sum);
// 12

Итак, этот вывод заключается в том, что с помощью метода reduce () мы можем уменьшить все элементы массива до одного значения. Где единственным значением может быть число / строка / объект.

reduceRight ()

  • reduceRight () сокращает массив до одного значения.
  • Метод reduceRight () применяет функцию к аккумулятору и каждому значению массива (справа налево), чтобы уменьшить его до одного значения. ~ MDN
  • Этот метод работает так же, как и метод уменьшения, но в противоположном направлении.
let arr = [ [ 3, 2, 6 ], [ 4, 8, 6 ], [ 9, 5 ] ]
let newarr = arr.reduceRight((accumulator, reducer) => accumulator.concat(reducer));
console.log(newarr);
// [ 9, 5, 4, 8, 6, 3, 2, 6 ]

ПРИМЕЧАНИЕ. reduce () vs reduceRight ()

Метод reduce () начинается с первого элемента от слева направо к последнему, тогда как метод reduceRight () начинается с первого элемента. от справа налево к последнему.

let arr = ['1', '4', '6', '2', '9']
let newArr1 = arr.reduce((accumulator, reducer) => accumulator + reducer)
let newArr2 = arr.reduceRight((accumulator, reducer) => accumulator + reducer)
console.log(newArr1);
//14629 (from left to right)
console.log(newArr2);
//92641 (from right to left)