web-dev-qa-db-fra.com

Ajout d'un prototype au littéral d'objet JavaScript

STORE = {
   item : function() {
  }
};
STORE.item.prototype.add = function() { alert('test 123'); };
STORE.item.add();

J'ai essayé de comprendre ce qui ne va pas avec cela depuis un bon moment. Pourquoi ça ne marche pas? Cependant, cela fonctionne lorsque j'utilise ce qui suit:

STORE.item.prototype.add();
javascriptprototypeobject-literal
54
John

L'objet prototype est destiné à être utilisé sur les fonctions constructeurs , essentiellement des fonctions qui seront appelées à l'aide de new opérateur pour créer de nouvelles instances d'objets.

Les fonctions en JavaScript sont des objets de première classe , ce qui signifie que vous pouvez leur ajouter des membres et les traiter comme des objets ordinaires:

var STORE = {
   item : function() {
  }
};

STORE.item.add = function() { alert('test 123'); };
STORE.item.add();

Une utilisation typique de l'objet prototype, comme je l'ai dit précédemment, consiste à instancier un objet en appelant une fonction constructeur avec le nouvel opérateur, par exemple:

function SomeObject() {} // a constructor function
SomeObject.prototype.someMethod = function () {};

var obj = new SomeObject();

Toutes les instances de SomeObject hériteront des membres de SomeObject.prototype, car ces membres seront accessibles via la chaîne de prototypes.

Chaque fonction en JavaScript a un objet prototype car il n'y a aucun moyen de savoir quelles fonctions sont destinées à être utilisées comme constructeurs.

80
CMS

Après de nombreuses années, lorsque JavaScript (ES2015 arrive), nous avons enfin Object.setPrototypeOf () méthode

const STORE = {
  item: function() {}
};


Object.setPrototypeOf(STORE.item, {
  add: function() {
    alert('test 123');
  }
})


STORE.item.add();
13
Krzysztof Safjanowski

À ce jour, cela est possible en utilisant le __proto__ propriété. Juste au cas où quelqu'un ici vérifierait actuellement et probablement à l'avenir.

const dog = {
    name: 'canine',
    bark: function() {
        console.log('woof woof!')
    }
}

const pug = {}
pug.__proto__ = dog;

pug.bark();

Cependant, la manière recommandée d'ajouter un prototype dans ce cas est d'utiliser Object.create . Ainsi, le code ci-dessus sera traduit en:

const pug = Object.create(dog)

pug.bark();

Ou vous pouvez également utiliser Object.setPrototypeOf comme mentionné dans l'une des réponses.

J'espère que cela pourra aider.

2
JohnnyQ

Vous pouvez utiliser les raviveurs JSON pour transformer votre JSON en objets de classe au moment de l'analyse. Le projet EcmaScript 5 a adopté le schéma de réactivation JSON2 décrit à http://JSON.org/js.html

var myObject = JSON.parse(myJSONtext, reviver);

Le paramètre reviver facultatif est une fonction qui sera appelée pour chaque clé et valeur à chaque niveau du résultat final. Chaque valeur sera remplacée par le résultat de la fonction reviver. Cela peut être utilisé pour reformer des objets génériques en instances de pseudoclasses, ou pour transformer des chaînes de date en objets Date.

myData = JSON.parse(text, function (key, value) {
    var type;
    if (value && typeof value === 'object') {
        type = value.type;
        if (typeof type === 'string' && typeof window[type] === 'function') {
            return new (window[type])(value);
        }
    }
    return value;
});
2
Mike Samuel
STORE = {
   item : function() {
  }
};

cette commande créerait un objet STORE. vous pouvez vérifier par typeof STORE;. Il devrait retourner "objet". Et si vous tapez STORE.item;, Il renvoie "fonction ..".

Puisqu'il s'agit d'un objet ordinaire, donc si vous voulez changer la fonction d'un élément, vous pouvez simplement accéder à ses propriétés/méthode avec cette commande.

STORE.item = function() { alert('test 123'); };

Essayez STORE.item;, Il devrait toujours renvoyer 'fonction ..'.

Essayez STORE.item(); puis l'alerte sera affichée.

0
Yugo Gautomo