Supprimer un élément d'un tableau JavaScript par son index

Publié le 07/03/2020 • Actualisé le 07/03/2020

C'est le genre de chose qu'il est très facile à faire en PHP. On peut utiliser unset($arr[$idx]); (et les clés sont préservées). Mais en JavaScript, la fonction splice() est assez étrange puisqu'elle permet de supprimer des éléments mais aussi d'en ajouter en même temps ! Faites très attention en l'utilisant. Veuillez noter que le tableau est muté et les clés sont réordonnées. J'ai fait les même exemples avec Lodash, le code est plus direct et compréhensible.

---

import pullAt from 'lodash/pullAt'
import dropRight from 'lodash/dropRight'

/**
 * J'utilise un module JavaScript afin d'isoler chaque snippet dans un fichier.
 * C'est en fait un mixin Vue.js. Utilisez le code appelé par la fonction mounted()
 * ou snippetXX().
 *
 * I only import only the two Lodash function I use in this snippet. If you want
 * to have all the functions call the standart import: import _ from 'lodash'
 */
export default {
  methods: {
    snippet81 () {
      // Open your JavaScript console in order to check the execution of this code.
      'use strict'
      console.log('—— Vanilla JS —————————————————————————————————————————————————')
      const arr1 = [1, 2, 3, 4, 5]
      console.log(arr1)

      // Delete the 1st element, it's index is 0
      arr1.splice(0, 1) // 1st argument: 0 means index 0, second argument: 1 means delete 1 element only
      console.log('Remove item at index 0')
      console.log(arr1)

      // Now delete the last element
      arr1.splice(-1, 1) // -1 means index of the last item, and 1 means delete 1 element only
      console.log('Remove last item')
      console.log(arr1)

      // Same examples with Lodash
      console.log('—— Lodash —————————————————————————————————————————————————————')
      let arr2 = [1, 2, 3, 4, 5]
      console.log(arr2)
      console.log('Remove item at index 0')
      pullAt(arr2, 0)
      console.log(arr2)

      arr2 = dropRight(arr2)
      console.log('Remove last item')
      console.log(arr2)

      // That's it! 😁
    }
  },
  mounted () {
    if (this.isArticle(81)) {
      this.snippet81()
    }
  }
}

 Plus sur Stackoverflow   Lire la doc  Plus sur le web  Snippet aléatoire

  Travaillez avec moi !

---