javascript-objects élément - Comment supprimer une propriété d'un objet JavaScript?




tableau delete (25)

Dites que je crée un objet comme suit:

var myObject = {
    "ircEvent": "PRIVMSG",
    "method": "newURI",
    "regex": "^http://.*"
};

Quel est le meilleur moyen de supprimer la propriété regex pour obtenir le nouveau myObject comme suit?

var myObject = {
    "ircEvent": "PRIVMSG",
    "method": "newURI"
};

Answers

Vous pouvez simplement supprimer n'importe quelle propriété d'un objet en utilisant le deletemot - clé.

Par exemple:

var obj = {key1:"val1",key2:"val2",key3:"val3"}

Par exemple, pour supprimer une propriété, key1utilisez le deletemot clé suivant:

delete obj.key1

Ou vous pouvez également utiliser une notation de type tableau:

delete obj[key1]

Réf: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… .


Object.assign () & Object.keys () & Array.map ()

const obj = {
    "Filters":[
        {
            "FilterType":"between",
            "Field":"BasicInformationRow.A0",
            "MaxValue":"2017-10-01",
            "MinValue":"2017-09-01",
            "Value":"Filters value"
        }
    ]
};

let new_obj1 = Object.assign({}, obj.Filters[0]);
let new_obj2 = Object.assign({}, obj.Filters[0]);

/*

// old version

let shaped_obj1 = Object.keys(new_obj1).map(
    (key, index) => {
        switch (key) {
            case "MaxValue":
                delete new_obj1["MaxValue"];
                break;
            case "MinValue":
                delete new_obj1["MinValue"];
                break;
        }
        return new_obj1;
    }
)[0];


let shaped_obj2 = Object.keys(new_obj2).map(
    (key, index) => {
        if(key === "Value"){
            delete new_obj2["Value"];
        }
        return new_obj2;
    }
)[0];


*/


// new version!

let shaped_obj1 = Object.keys(new_obj1).forEach(
    (key, index) => {
        switch (key) {
            case "MaxValue":
                delete new_obj1["MaxValue"];
                break;
            case "MinValue":
                delete new_obj1["MinValue"];
                break;
            default:
                break;
        }
    }
);

let shaped_obj2 = Object.keys(new_obj2).forEach(
    (key, index) => {
        if(key === "Value"){
            delete new_obj2["Value"];
        }
    }
);


Comme ça:

delete myObject.regex;
// or,
delete myObject['regex'];
// or,
var prop = "regex";
delete myObject[prop];

Démo

var myObject = {
    "ircEvent": "PRIVMSG",
    "method": "newURI",
    "regex": "^http://.*"
};
delete myObject.regex;

console.log(myObject);

kangax utilisateur de , a écrit un article de blog d'une profondeur incroyable sur la déclaration de delete de son blog, Comprendre la suppression . C'est fortement recommandé.


var myObject = {"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"};
    
delete myObject.regex;

console.log ( myObject.regex); // logs: undefined

Cela fonctionne dans Firefox et Internet Explorer, et je pense que cela fonctionne dans tous les autres.


Très simple:

var myObject = {
    "ircEvent": "PRIVMSG",
    "method": "newURI",
    "regex": "^http://.*"
};

delete myObject.regex;

Mise à jour 2018-07-21: Pendant longtemps, cette réponse me gênait. Je pense donc qu'il est temps que je retouche un peu. Juste un petit commentaire, des éclaircissements et un formatage pour aider à accélérer la lecture des parties inutilement longues et compliquées de cette réponse.

LA VERSION COURTE

La réponse réelle à la question

Comme d’autres l’ont dit, vous pouvez utiliser delete .

obj // {"foo": "bar"}
delete obj["foo"]
obj // {}
obj["foo"] // undefined

Équivalent tableau

Ne delete pas d'un tableau. Utilisez Array.prototype.splice place.

arr // [1,2,3,4,5]
arr.splice(3,1); // 4
arr // [1,2,3,5]

LA VERSION LONGUE

JavaScript est un langage POO, donc tout est un objet, y compris les tableaux . Ainsi, j’estime nécessaire de signaler une mise en garde particulière.

Dans les tableaux, contrairement aux anciens objets ordinaires, l’utilisation de la delete déchets sous la forme de null , ce qui crée un "trou" dans le tableau.

var array = [1, 2, 3, 4];
delete array[2];
/* Expected result --> [1, 2, 4]
 * Actual result   --> [1, 2, null, 4]
 */

Comme vous pouvez le constater, la delete ne fonctionne pas toujours comme prévu. La valeur est écrasée, mais la mémoire n'est pas réaffectée. C'est-à-dire que array[4] n'est pas déplacé vers array[3] . Ce qui est différent de Array.prototype.unshift , qui insère un élément au début du tableau et décale tout vers le haut ( array[0] devient array[1] , etc.)

Honnêtement, mis à part le fait de rendre null plutôt qu'indéfini - ce qui est légitimement étrange - ce comportement ne devrait pas être surprenant, puisque delete est un opérateur unaire, comme typeof , qui se typeof dure dans la langue et n'est pas censé s'en soucier. sur le type d'objet sur lequel il est utilisé, alors que Array est une sous-classe d' Object avec des méthodes spécialement conçues pour travailler avec des tableaux. Il n'y a donc aucune raison valable de delete un cas particulier pour redistribuer le tableau, car cela ralentirait les choses avec un travail inutile. Rétrospectivement, mes attentes étaient irréalistes.

Bien sûr, cela m'a surpris. Parce que j'ai écrit ceci pour justifier ma croisade contre "null garbage":

Ignorant les dangers et les problèmes inhérents à null , ainsi que le gaspillage d’espace, cela peut poser problème si le tableau doit être précis.

Ce qui est une justification terrible pour se débarrasser de la valeur null s-- null n’est dangereux que s’il est utilisé à mauvais escient, et cela n’a rien à voir avec la "précision". La vraie raison pour laquelle vous ne devriez pas delete d'un tableau est parce que laisser des structures de données désordonnées et désordonnées est désordonné et sujet aux bogues.

Ce qui suit est un scénario artificiel qui prend du temps, vous pouvez donc passer directement à la section, La solution , si vous le souhaitez. La seule raison pour laquelle je laisse cette section est parce que je pense que certaines personnes pensent probablement que c'est drôle, et je ne veux pas être "ce type" qui publie une réponse "drôle" et en supprime ensuite tous les "drôle" .

... C'est stupide, je sais.

Le scénario PDP-11 artificiel et long

Par exemple, supposons que vous créez une application Web qui utilise la sérialisation JSON pour stocker un tableau utilisé pour les "onglets" dans une chaîne (dans ce cas, localStorage ). Supposons également que le code utilise les index numériques des membres du tableau pour les "titrer" lors du tracé à l'écran. Pourquoi faites-vous cela plutôt que de simplement stocker le "titre"? Parce que ... raisons .

D'accord, disons simplement que vous essayez d'économiser de la mémoire à la demande de cet utilisateur qui exploite un mini-ordinateur PDP-11 des années 1960 sous UNIX et a écrit sa propre imprimante compatible avec JavaScript, basée sur Elinks navigateur parce que X11 est hors de question .

Scénario de plus en plus stupide en dehors des cas, l’utilisation de delete sur ledit tableau aura pour conséquence une pollution null du tableau, et probablement la création de bugs dans l’application ultérieurement. Et si vous vérifiez la valeur null , il sautera directement les nombres et les onglets seront rendus comme [1] [2] [4] [5] ...

if (array[index] == null)
    continue;
else
    title = (index + 1).toString();
/* 0 -> "1"
 * 1 -> "2"
 * 2 -> (nothing)
 * 3 -> "4"
 */

Oui, ce n'est certainement pas ce que tu voulais.

Vous pouvez maintenant garder un deuxième itérateur, comme j , pour incrémenter uniquement lorsque des valeurs valides sont lues dans le tableau. Mais cela ne résoudrait pas exactement le problème de null , et vous devez quand même faire plaisir à cet utilisateur du PDP-11 de Troll . Hélas, son ordinateur ne dispose pas de suffisamment de mémoire pour contenir le dernier entier (ne lui demandez pas comment il gère un tableau de largeur variable ...) .

Alors, il vous envoie un email en colère:

Hey, your webapp broke my browser! I checked my localStorage database after your stupid code made my browser segfault, and this is what I found:

>"tabs:['Hello World', 'foo bar baz', null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, ... ]"

After clearing my precious data, it segfaulted again, and I did a backtrace, and what do I find? WHAT DO I FIND!? YOU USE TOO MANY VARIABLES!

>var i = index;
>var j = 1;

Grr, I am angry now.
-Troll Davidson

À propos de maintenant, vous êtes à la fin de votre esprit. Ce mec se plaint sans cesse de votre application et vous voulez lui dire de se taire et d'avoir un meilleur ordinateur.

La solution: Array.prototype.splice

Heureusement, les tableaux ont une méthode spécialisée pour supprimer des index et Array.prototype.splice() mémoire: Array.prototype.splice() . Vous pourriez écrire quelque chose comme ceci:

Array.prototype.remove = function(index){
  this.splice(index,1);
}
...
array = [1, 2, 3, 4];
array.remove(2);
// Result -> [1, 2, 4]

Et juste comme ça, vous avez plu à M. PDP-11. Hourra! (Je lui dis toujours quand même ...)

Array.prototype.splice vs Array.prototype.slice

Je pense qu'il est important de souligner la différence entre ces deux fonctions portant le même nom, car elles sont toutes deux très utiles.

Array.prototype.splice (début, n)

.splice() modifie le tableau et renvoie les index supprimés. Le tableau est découpé à partir de l'index, du start et n éléments sont découpés. Si n n'est pas spécifié, l'ensemble du tableau après le start est n = array.length - start tranches ( n = array.length - start ).

let a = [5,4,3,2,1];
let chunk = a.splice(2,2);

// a     [5,4,3,2,1]
// start  0 1 2 - -
// n      - - 1 2 -

chunk; // [3,2]
a;     // [5,4,1]

Array.prototype.slice (début, fin)

.slice() est non destructif et retourne un nouveau tableau contenant les index indiqués du start à la end . Si end n'est pas spécifiée à end , le comportement est identique à celui de .splice() ( end = array.length ). Le comportement est un peu délicat car, pour une raison quelconque, finissez les index de 1 au lieu de 0. Je ne sais pas pourquoi, mais c'est comme ça. De plus, si end <= start , le résultat est un tableau vide.

let a = [5,4,3,2,1];
let chunks = [
    a.slice(2,0),
    a.slice(2,2),
    a.slice(2,3),
    a.slice(2,5) ];

// a             [5,4,3,2,1]
// start          0 1 2 - -
// end, for...    - - - - -
//   chunks[0]  0 - - - - -   
//   chunks[1]    1 2 - - -
//   chunks[2]    1 2 3 - -
//   chunks[3]    1 2 3 4 5

chunks; // [ [], [], [3], [3,2,1] ]
a;      // [5,4,3,2,1]

Ce n'est en fait pas ce qui se passe, mais il est plus facile de penser de cette façon. Selon MDN, voici ce qui se passe réellement:

// a             [5,4,3,2,1]
// start          0 1 2 - - -
// end, for...    - - - - - -
//   chunks[0]    0 - - - - -
//   chunks[1]    0 1 2 - - -
//   chunks[2]    0 1(2)3 - -
//   chunks[3]    0 1(2 3 4)5

L'index spécifié par end est simplement exclu de la tranche. Les index entre parenthèses indiquent ce qui doit être découpé. Quoi qu'il en soit, le comportement n'est pas intuitif et il est voué à son lot d'erreurs différentes. Il peut donc être utile de créer une fonction wrapper pour imiter de plus près le comportement de .splice() :

function ez_slice(array, start = 0, n = null){
    if(!Array.isArray(array) || !is_number(start))
        return null;

    if(is_number(n))
        return array.slice(start, start + n);

    if(n === null)
        return array.slice(start);

    return null;
}

ez_slice([5,4,3,2,1], 2, 1) // [3]
ez_slice([5,4,3,2,1], 2)    // [3,2,1]

/* Fun fact: isNaN is unreliable.
 * [NaN, [], {}, 0, 1, Infinity, undefined, null, "Hi"].filter(isNaN)
 * [NaN, {}, undefined, "Hi"]
 *
 * What we want is...
 *
 * [NaN, [], {}, 0, 1, Infinity, undefined, null, "Hi"].filter(is_nan)
 * [NaN]
 */
function is_nan(num){
    return typeof num === "number"
        && num !== num;
}

function is_number(num){
    return !is_nan(num)
        && typeof num === "number"
        && isFinite(num);
}

Notez que la fonction wrapper est conçue pour être très stricte à propos des types, et retournera null si quelque chose est désactivé. Cela inclut la mise dans une chaîne comme "3" . Il appartient au programmeur de faire preuve de diligence à propos de ses types. Ceci est d'encourager de bonnes pratiques de programmation.

Mise à jour concernant is_array()

C'est à propos de cet extrait (maintenant supprimé):

function is_array(array){
    return array !== null
        && typeof array === "object"
        && typeof array.length !== "undefined"
        && array.__proto__ === Array.prototype;
}

En fait, il existe donc un moyen intégré de déterminer si un tableau est vraiment un tableau: il s'agit de Array.isArray() , introduit dans ECMAScript 5 (décembre 2009). J'ai trouvé ceci en cherchant à voir s'il y avait une question concernant la distinction entre les tableaux et les objets, pour voir s'il existait une solution meilleure que la mienne, ou pour ajouter la mienne s'il n'y en avait pas. Ainsi, si vous utilisez une version de JavaScript antérieure à ECMA 5, vous disposez de votre polyfill. Cependant, je recommande fortement de ne pas utiliser ma fonction is_array() , car continuer à prendre en charge les anciennes versions de JavaScript signifie continuer à prendre en charge les anciens navigateurs qui les implémentent, ce qui signifie encourager l'utilisation de logiciels non sécurisés et exposer les utilisateurs à des programmes malveillants. Alors s'il vous plaît, utilisez Array.isArray() . Utilisez let et const . Utilisez les nouvelles fonctionnalités ajoutées à la langue. N'utilisez pas les préfixes du vendeur. Supprimer cette merde polyfill IE à partir de votre site web. Supprimez cette <!CDATA[[... merde <!CDATA[[... XHTML - aussi - nous sommes passés à HTML5 en 2014. Plus tôt tout le monde supprime la prise en charge de ces anciens navigateurs / ésotériques, plus tôt les éditeurs de navigateurs suivront la norme Web et adopteront les nouvelle technologie, et plus vite nous pourrons passer à un site Web plus sécurisé.


L'affirmation de Dan selon laquelle "supprimer" est très lente et le point de repère qu'il a publié ont été mis en doute. J'ai donc moi-même effectué le test sous Chrome 59. Il semble que la suppression soit environ 30 fois plus lente:

var iterationsTotal = 10000000;  // 10 million
var o;
var t1 = Date.now(),t2;
for (let i=0; i<iterationsTotal; i++) {
   o = {a:1,b:2,c:3,d:4,e:5};
   delete o.a; delete o.b; delete o.c; delete o.d; delete o.e;
}
console.log ((t2=Date.now())-t1);  // 6135
for (let i=0; i<iterationsTotal; i++) {
   o = {a:1,b:2,c:3,d:4,e:5};
   o.a = o.b = o.c = o.d = o.e = undefined;
}
console.log (Date.now()-t2);  // 205

Notez que j'ai volontairement effectué plus d'une opération de «suppression» dans un cycle de boucle afin de minimiser l'effet provoqué par les autres opérations.


Utilisation de ES6:

(Opérateur Destructuring + Spread)

    const myObject = {
      regex: "^http://.*",
      b: 2,
      c: 3
    };
    const { regex, ...noRegex } = myObject;
    console.log(noRegex); // => { b: 2, c: 3 }


const myObject = {
        "ircEvent": "PRIVMSG",
        "method": "newURI",
        "regex": "^http://.*"
    };

const { regex, ...other } = myObject;

console.log(myObject)
console.log(regex)
console.log(other)


Ce message est très ancien et je le trouve très utile. J'ai donc décidé de partager la fonction non définie que j'ai écrite au cas où quelqu'un d'autre verrait ce message et se demanderait pourquoi ce n'est pas aussi simple que dans PHP non défini.

La raison d’écrire cette nouvelle unsetfonction est de conserver l’index de toutes les autres variables dans ce hash_map. Regardez l'exemple suivant et voyez comment l'index de "test2" n'a pas changé après la suppression d'une valeur de hash_map.

function unset(unsetKey, unsetArr, resort){
  var tempArr = unsetArr;
  var unsetArr = {};
  delete tempArr[unsetKey];
  if(resort){
    j = -1;
  }
  for(i in tempArr){
    if(typeof(tempArr[i]) !== 'undefined'){
      if(resort){
        j++;
      }else{
        j = i;
      }
      unsetArr[j] = tempArr[i];
    }
  }
  return unsetArr;
}

var unsetArr = ['test','deletedString','test2'];

console.log(unset('1',unsetArr,true)); // output Object {0: "test", 1: "test2"}
console.log(unset('1',unsetArr,false)); // output Object {0: "test", 2: "test2"}

Utiliser lodash

import omit from 'lodash/omit';

const prevObject = {test: false, test2: true};
// Removes test2 key from previous object
const nextObject = omit(prevObject, 'test2');

Utiliser Ramda

R.omit(['a', 'd'], {a: 1, b: 2, c: 3, d: 4}); //=> {b: 2, c: 3}

Essayez la méthode suivante. Attribuez la Objectvaleur de la propriété à undefined. Puis stringifyl'objet et parse.

 var myObject = {"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"};

myObject.regex = undefined;
myObject = JSON.parse(JSON.stringify(myObject));

console.log(myObject);


ECMAScript 2015 (ou ES6) est venu avec un objet Reflect intégré . Il est possible de supprimer une propriété d'objet en appelant la fonction Reflect.deleteProperty() avec l'objet cible et la clé de propriété comme paramètres:

Reflect.deleteProperty(myJSONObject, 'regex');

ce qui équivaut à:

delete myJSONObject['regex'];

Mais si la propriété de l'objet n'est pas configurable, elle ne peut être supprimée ni avec la fonction deleteProperty ni avec l'opérateur delete:

let obj = Object.freeze({ prop: "value" });
let success = Reflect.deleteProperty(obj, "prop");
console.log(success); // false
console.log(obj.prop); // value

Object.freeze() rend toutes les propriétés de l'objet non configurables (à part d'autres choses). deletePropertyfunction (ainsi que l' developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… ) est renvoyé falselorsque tente de supprimer l'une de ses propriétés. Si la propriété est configurable, elle retourne true, même si la propriété n'existe pas.

La différence entre deleteet deletePropertyest lorsque vous utilisez le mode strict:

"use strict";

let obj = Object.freeze({ prop: "value" });
Reflect.deleteProperty(obj, "prop"); // false
delete obj["prop"];
// TypeError: property "prop" is non-configurable and can't be deleted

Il y a beaucoup de bonnes réponses ici, mais je veux juste dire que lorsque vous utilisez delete pour supprimer une propriété en JavaScript, il est souvent sage de vérifier d'abord si cette propriété existe pour éviter les erreurs.

Par exemple

var obj = {"property":"value", "property2":"value"};

if (obj && obj.hasOwnProperty("property2")) {
  delete obj.property2;
} else {
  //error handling
}

En raison de la nature dynamique de JavaScript, il arrive souvent que vous ne sachiez tout simplement pas si la propriété existe ou non. En vérifiant si obj existe avant le &&, vous vous assurez également de ne pas générer d'erreur en appelant la fonction hasOwnProperty () sur un objet non défini.

Désolé si cela n’a pas été ajouté à votre cas d’utilisation spécifique, mais j’estime qu’il s’agit d’une bonne conception à adapter lors de la gestion des objets et de leurs propriétés.


Une autre alternative consiste à utiliser la bibliothèque Underscore.js .

Notez que _.pick() et _.omit() renvoient tous deux une copie de l'objet et ne modifient pas directement l'objet d'origine. Assigner le résultat à l'objet d'origine devrait faire l'affaire (non montré).

Référence: link _.pick (object, * keys)

Retourne une copie de l'objet filtré pour n'avoir que des valeurs pour les clés de la liste blanche (ou le tableau de clés valides).

var myJSONObject = 
{"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"};

_.pick(myJSONObject, "ircEvent", "method");
=> {"ircEvent": "PRIVMSG", "method": "newURI"};

Référence: link _.omit (object, * keys)

Retourne une copie de l'objet, filtrée pour omettre les clés en liste noire (ou le tableau de clés).

var myJSONObject = 
{"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"};

_.omit(myJSONObject, "regex");
=> {"ircEvent": "PRIVMSG", "method": "newURI"};

Pour les tableaux, _.filter() et _.reject() peuvent être utilisés de la même manière.


Une autre solution, en utilisant Array#reduce.

var myObject = {
  "ircEvent": "PRIVMSG",
  "method": "newURI",
  "regex": "^http://.*"
};

myObject = Object.keys(myObject).reduce(function(obj, key) {
  if (key != "regex") {           //key you want to remove
    obj[key] = myObject[key];
  }
  return obj;
}, {});

console.log(myObject);

Cependant, l'objet d'origine sera muté . Si vous voulez créer un nouvel objet sans la clé spécifiée, affectez simplement la fonction de réduction à une nouvelle variable, par exemple:

(ES6)

const myObject = {
  ircEvent: 'PRIVMSG',
  method: 'newURI',
  regex: '^http://.*',
};

const myNewObject = Object.keys(myObject).reduce((obj, key) => {
  key !== 'regex' ? obj[key] = myObject[key] : null;
  return obj;
}, {});

console.log(myNewObject);


La méthode de suppression est le meilleur moyen de procéder. Selon la description du MDN, l'opérateur de suppression supprime une propriété d'un objet. Donc, vous pouvez simplement écrire:

delete myObject.regex;
// OR
delete myObject['regex'];

L'opérateur delete supprime une propriété donnée d'un objet. En cas de suppression réussie, il retournera vrai, sinon faux sera renvoyé. Cependant, il est important de considérer les scénarios suivants:

  • Si la propriété que vous essayez de supprimer n'existe pas, la suppression n'aura aucun effet et renverra true

  • Si une propriété portant le même nom existe dans la chaîne de prototypes de l'objet, après sa suppression, celui-ci utilisera la propriété de la chaîne de prototypes (en d'autres termes, la suppression n'a d'effet que sur ses propres propriétés).

  • Toute propriété déclarée avec var ne peut pas être supprimée de la portée globale ou de la portée d'une fonction.

  • En tant que tel, delete ne peut supprimer aucune fonction de la portée globale (qu'elle fasse partie d'une définition de fonction ou d'une fonction (expression).

  • Les fonctions faisant partie d'un objet (en dehors de la
    portée globale) peuvent être supprimées avec delete.

  • Toute propriété déclarée avec let ou const ne peut pas être supprimée de la portée dans laquelle elles ont été définies. Les propriétés non configurables ne peuvent pas être supprimées. Cela inclut les propriétés des objets intégrés tels que Math, Array, Object et les propriétés créées de manière non configurable avec des méthodes telles que Object.defineProperty ().

L'extrait suivant donne un autre exemple simple:

var Employee = {
      age: 28,
      name: 'abc',
      designation: 'developer'
    }
    
    console.log(delete Employee.name);   // returns true
    console.log(delete Employee.age);    // returns true
    
    // When trying to delete a property that does 
    // not exist, true is returned 
    console.log(delete Employee.salary); // returns true

Pour plus d'informations et voir plus d'exemples, visitez le lien ci-dessous:

developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…



Bonjour vous pouvez essayer cette simple une sorte

var obj = [];

obj.key1 = {name: "John", room: 1234};
obj.key2 = {name: "Jim", room: 1234};

delete(obj.key1);

Supposons que vous ayez un objet qui ressemble à ceci:

var Hogwarts = {
    staff : [
        'Argus Filch',
        'Filius Flitwick',
        'Gilderoy Lockhart',
        'Minerva McGonagall',
        'Poppy Pomfrey',
        ...
    ],
    students : [
        'Hannah Abbott',
        'Katie Bell',
        'Susan Bones',
        'Terry Boot',
        'Lavender Brown',
        ...
    ]
};

Suppression d'une propriété d'objet

Si vous voulez utiliser tout le stafftableau, la bonne façon de le faire serait de faire ceci:

delete Hogwarts.staff;

Alternativement, vous pouvez aussi faire ceci:

delete Hogwarts['staff'];

De même, supprimer le tableau entier des étudiants se ferait en appelant delete Hogwarts.students;ou endelete Hogwarts['students']; .

Suppression d'un index de tableau

Désormais, si vous souhaitez supprimer un seul membre du personnel ou un étudiant, la procédure est un peu différente, car les deux propriétés sont des tableaux eux-mêmes.

Si vous connaissez l'index de votre membre du personnel, vous pouvez simplement faire ceci:

Hogwarts.staff.splice(3, 1);

Si vous ne connaissez pas l'index, vous devrez également effectuer une recherche dans l'index:

Hogwarts.staff.splice(Hogwarts.staff.indexOf('Minerva McGonnagall') - 1, 1);

Remarque

Bien que vous puissiez techniquement utiliser deleteun tableau, son utilisation entraînerait des résultats incorrects lors de l'appel Hogwarts.staff.lengthultérieur, par exemple . En d'autres termes, deletesupprimerait l'élément, mais ne mettrait pas à jour la valeur de la lengthpropriété. Utiliser deletegâcherait également votre indexation.

Ainsi, lors de la suppression de valeurs d'un objet, commencez toujours par déterminer s'il s'agit de propriétés d'objet ou de valeurs de tableau, puis choisissez la stratégie appropriée en fonction de celle-ci.

Si vous voulez expérimenter cela, vous pouvez utiliser ce violon comme point de départ.


Le terme que vous avez utilisé dans le titre de votre question Remove a property from a JavaScript object peut être interprété de différentes manières. L’une consiste à l’enlever pour l’ensemble de la mémoire et la liste des clés d’objet ou l’autre à l’effacer. Comme il a été mentionné dans d'autres réponses, le mot clé delete est la partie principale. Disons que vous avez votre objet comme:

myJSONObject = {"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"};

Si tu fais:

console.log(Object.keys(myJSONObject));

le résultat serait:

["ircEvent", "method", "regex"]

Vous pouvez supprimer cette clé spécifique de vos clés d’objet comme suit:

delete myJSONObject["regex"];

Ensuite, la clé de vos objets utilisant Object.keys(myJSONObject) serait:

["ircEvent", "method"]

Mais le fait est que si vous vous souciez de la mémoire et que vous voulez que tout l'objet soit supprimé de la mémoire, il est recommandé de le définir sur null avant de supprimer la clé:

myJSONObject["regex"] = null;
delete myJSONObject["regex"];

L'autre point important ici est de faire attention à vos autres références au même objet. Par exemple, si vous créez une variable comme:

var regex = myJSONObject["regex"];

Ou ajoutez-le comme un nouveau pointeur sur un autre objet tel que:

var myOtherObject = {};
myOtherObject["regex"] = myJSONObject["regex"];

Ensuite, même si vous le supprimez de votre objet myJSONObject , cet objet spécifique ne sera pas supprimé de la mémoire, car la variable regex et myOtherObject["regex"] ont toujours leurs valeurs. Alors, comment pourrions-nous supprimer l’objet de la mémoire à coup sûr?

La solution serait de supprimer toutes les références que vous avez dans votre code, de pointer sur cet objet même et de ne pas utiliser les instructions var pour créer de nouvelles références à cet objet . Ce dernier point concernant les instructions var est l’un des problèmes les plus cruciaux auquel nous sommes généralement confrontés, car l’utilisation des instructions var empêcherait la création de l’objet créé.

Cela signifie que dans ce cas, vous ne pourrez pas supprimer cet objet car vous avez créé la variable regex via une instruction var , et si vous le faites:

delete regex; //False

Le résultat serait false , ce qui signifie que votre instruction delete n'a pas été exécutée comme prévu. Mais si vous n'aviez pas créé cette variable auparavant et que vous myOtherObject["regex"] que ma dernière référence existante, myOtherObject["regex"] , vous auriez pu le faire simplement en l'enlevant comme myOtherObject["regex"] :

myOtherObject["regex"] = null;
delete myOtherObject["regex"];

En d'autres termes, un objet JavaScript est tué dès qu'il ne reste aucune référence dans votre code pointé sur cet objet.

Mise à jour: Merci à @AgentME:

Définir une propriété sur null avant de la supprimer n'apporte rien (sauf si l'objet a été scellé par Object.seal et que la suppression échoue. Ce n'est généralement pas le cas, à moins que vous n'essayiez spécifiquement).

Pour obtenir plus d'informations sur Object.seal: Object.seal()


Essaye ça

delete myObject['key'];

En utilisant ramda#dissoc vous obtiendrez un nouvel objet sans l'attribut suivant regex:

const newObject = R.dissoc('regex', myObject);
// newObject !== myObject

Vous pouvez également utiliser d'autres fonctions pour obtenir le même effet - omettre, choisir, ...


Mozilla a des détails complets sur la façon de le faire dans un navigateur où il n'est pas supporté, si cela aide:

if (!Object.keys) {
  Object.keys = (function () {
    var hasOwnProperty = Object.prototype.hasOwnProperty,
        hasDontEnumBug = !({toString: null}).propertyIsEnumerable('toString'),
        dontEnums = [
          'toString',
          'toLocaleString',
          'valueOf',
          'hasOwnProperty',
          'isPrototypeOf',
          'propertyIsEnumerable',
          'constructor'
        ],
        dontEnumsLength = dontEnums.length;

    return function (obj) {
      if (typeof obj !== 'object' && typeof obj !== 'function' || obj === null) throw new TypeError('Object.keys called on non-object');

      var result = [];

      for (var prop in obj) {
        if (hasOwnProperty.call(obj, prop)) result.push(prop);
      }

      if (hasDontEnumBug) {
        for (var i=0; i < dontEnumsLength; i++) {
          if (hasOwnProperty.call(obj, dontEnums[i])) result.push(dontEnums[i]);
        }
      }
      return result;
    };
  })();
}

Vous pouvez l'inclure comme vous le souhaitez, mais peut-être dans une sorte de fichier extensions.js en haut de votre pile de scripts.







javascript javascript-objects object-properties