Array methods

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

pop()	push()	splice()
shift()	unshift()	slice()
concat()	join()	includes()

---

💼 Тесты

---

📝 pop ()

⏬		⤵️

Этот метод удаляет последний элемент массива и возвращает удаленный элемент

У метода нет параметров ( аргументов )

☕

var myArray = [ "Гвоздь", "Собака", "Процессор", "Диск", "Программа" ]
var elem = myArray.pop ()

После выполнения этого кода в массиве myArray останутся:

[ "Гвоздь", "Собака", "Процессор", "Диск" ]

а значение переменной elem будет "Программа"

---

📝 push ()

⤴️		⤵️

Этот метод добавляет новый элемент в конец массива

Аргументом, который получает метод при вызове, является добавляемый элемент

Метод возвращает новую длину массива

☕

var myArray = [ "Гвоздь", "Велосипед", "Процессор", "Диск" ]
var _length = myArray.push (  "Программа" )

После выполнения этого кода в массиве myArray будут элементы:

[ "Гвоздь", "Велосипед", "Процессор", "Диск", "Программа" ]

а значение переменной _length будет 5

---

📝 shift ()

⤴️		⤵️

Этот метод удаляет первый элемент из массива

Возвращаемое значение - удаленный элемент

Например, в результате выполнения следующего кода:

☕

var arrayOfNames = [ "Мария", "Дмитрий", "Николай", "Сергей" ]
console.log ( arrayOfNames.shift () )

в консоли будет: Мария

а массив arrayOfNames будет содержать значения:

[ "Дмитрий", "Николай", "Сергей" ]

---

📝 unshift ()

⤴️		⤵️

Метод добавляет новый элемент в начало массива

Возвращаемое значение - новая длина массива ( число )

☕

var drinks = [ "кофе", "чай", "сок", "вода", "молоко" ]
var len = drinks.unshift ( "пиво" )

В результате массив drinks будет содержать элементы:

[ "пиво", "кофе", "чай", "сок", "вода", "молоко" ]

а переменная len примет значение 6

---

📝 splice ()

⤴️		⤵️

Первый аргумент ( число ) определяет положение ( индекс ), куда будут вставлены новые элементы

Второй аргумент ( число ) определяет, сколько элементов ( начиная с позиции вставки ) должно быть удалено из массива

Третий ( четвертый, пятый ... ) аргументы - это элементы, которые нужно вставить в массив

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

☕ 1️⃣

С помощью метода splice () можно заменить элементы в массиве:

var myArray = [ 1, 2, 3, 4, 5 ] 
console.log ( myArray.splice ( 2, 1, "*" ) )

В результате массив myArray будет:

[ 1, 2, "*", 4, 5 ]

а в консоль будет выведено:

[ 3 ]

( массив элементов, которые были заменены на "*" )

---

☕ 2️⃣

var myArray = [ 1, 2, 3, 4, 5 ] 
console.log ( myArray.splice ( 2, 2, "*", "#", "$", "%" ) )

В результате массив myArray будет:

[ 1, 2, "*", "#", "$", "%", 5 ]

а в консоль будет выведено:

[ 3, 4 ]

( элементы, которые были заменены элементами "*", "#", "$", "%" )

---

☕ 3️⃣

var myArray = [ 1, 2, 3, 4, 5 ] 
console.log ( myArray.splice ( 2, 2, [ 7, 8, 9 ] ) )

В результате массив myArray будет состоять из четырех элементов:

[ 1, 2, Array(3), 5 ]

а в консоль будет выведено:

[ 3, 4 ]

( элементы, которые были заменены массивом [ 7, 8, 9 ] )

---

☕ 4️⃣

var myArray = [ 1, 2, 3, 4, 5 ] 
console.log ( myArray.splice ( 2, 0, "Новый элемент" ) )

В результате массив myArray будет состоять из четырех элементов:

[ 1, 2, "Новый элемент", 3, 4, 5 ]

а в консоль будет выведен пустой массив:

[]

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

---

📝 slice ()

⤴️		⤵️

Метод создает новый массив, содержащий фрагмент исходного массива

При этом исходный массив не изменяется

Возвращаемое значение - новый массив, являющийся фрагментом исходного массива

Аргументы:

• Первый ( число ) - индекс элемента исходного массива, с которого начинается фрагмент
• Второй ( число ) - индекс элемента исходного массива, до которого продолжается фрагмент

☕ 1️⃣

var drinks = [ "кофе", "чай", "сок", "вода", "молоко" ]
var newDrinks = drinks.slice ( 1, 2 )

//  Значение newDrinks:  [ "чай" ]

☕ 2️⃣

var drinks = [ "кофе", "чай", "сок", "вода", "молоко" ]
var newDrinks = drinks.slice ( 1, 4 )

//  Значение newDrinks:  [ "чай", "сок", "вода" ]

☕ 3️⃣

var drinks = [ "кофе", "чай", "сок", "вода", "молоко" ]
var newDrinks = drinks.slice ( 2 )

Значение newDrinks:

[ "сок", "вода", "молоко" ]

( если опустить второй аргумент, то фрагмент будет взят до конца исходного массива )

---

📝 concat ()

⤴️		⤵️

Метод объединяет два или более массива в один массив

Возвращаемое значение - новый массив

⚠️ Исходные массивы не изменятся

☕

var ukrainianCities = [ "Киев", "Львов", "Харьков", "Одесса" ]
var europeanCities = [ "Монреаль", "Копенгаген", "Вена", "Лондон" ]
var newArray = ukrainianCities.concat ( europeanCities )

Результатом будет новый массив newArray:

[ "Киев", "Львов", "Харьков", "Одесса", "Монреаль", "Копенгаген", "Вена", "Лондон" ]

---

📝 join ()

⤴️		⤵️

Объединяет все элементы массива в строку ( "string" )

Аргумент - символ-разделитель

☕

var drinks = [ "кофе", "чай", "сок", "вода", "молоко" ]
var drinkStr = drinks.join ( " | " )

Значение drinkStr:

"кофе | чай | сок | вода | молоко"

---

📝 includes()

ES8 (2017 )

⤴️		⤵️

Метод includes() возвращает true, когда значение, переданное аргументом, содержится в массиве, или false в противном случае

☕ 1️⃣

var users = [ "Ivan", "Georg", "Stephan" ]

users.includes ( "Stephan" )  // true
users.includes ( "Mary" )     // false

☕ 2️⃣

Если элементами массива являются объекты, то метод не будет работать

⚠️ поскольку массивы и объекты передаются по ссылке, а не по значению

var users = [
    {
        name: "Ivan",
        email: "ivan78@gmail.com"
    },
    {
        name: "Georg",
        email: "georg.klep@gmail.com"
    },
    {
        name: "Stephan",
        email: "stephan.borg@gmail.com"
    }
]

users.includes ( {
    name: "Stephan",
    email: "stephan.borg@gmail.com"
})

//  false

☕ 3️⃣

var points = [
    [ 100, 20 ],
    [ 200, 150 ],
    [ 120, 50 ]
]

points.includes ( [ 100, 20 ] )   // false

---

⤴️		⏫

---

💼 Тесты