Array methods

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

↪️ pop()	↪️ push()	↪️ shift()	↪️ unshift()
↪️ splice()	↪️ 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

⤴️		⏫

---

💼 Тесты