web-dev-qa-db-fra.com

Quelle est la différence entre JSON et Object Literal Notation?

Quelqu'un peut-il me dire quelle est la principale différence entre un objet JavaScript défini à l'aide de notation littérale d'objet et objet JSON?

Selon un livre JavaScript, il est indiqué qu'il s'agit d'un objet défini à l'aide de notation d'objet:

var anObject = {
    property1 : true,
    showMessage : function (msg) { alert(msg) }
};

Pourquoi n'est-ce pas un objet JSON dans ce cas? Juste parce qu'il n'est pas défini en utilisant des guillemets?

206
pencilCake

Permet de clarifier d’abord ce que [~ # ~] json [~ # ~] est réellement. JSON est un format d'échange de données textual, indépendant de la langue, un peu comme XML, CSV ou YAML.

Les données peuvent être stockées de différentes manières, mais si elles doivent être stockées dans un fichier texte et lisibles par un ordinateur, elles doivent suivre une structure. JSON est l'un des nombreux formats qui définissent une telle structure.

De tels formats sont généralement indépendants du langage, ce qui signifie qu'ils peuvent être traités par Java, Python, JavaScript, PHP, etc.

En revanche, JavaScript est un langage de programmation. Bien sûr, JavaScript fournit également un moyen de définir/décrire des données, mais la syntaxe est très spécifique à JavaScript.

En guise d'exemple, Python utilise le concept tuples, la syntaxe est (x, y). JavaScript n'a pas quelque chose comme ça.


Regardons les différences syntaxiques entre les littéraux d'objet JSON et JavaScript.

JSON a les contraintes syntaxiques suivantes:

  • Object keys doit être une chaîne de caractères (c'est-à-dire une séquence de caractères entourée de guillemets doubles ").
  • Les valeurs peuvent être:
    • un string
    • un numéro
    • un objet (JSON)
    • un tableau
    • true
    • false
    • null
  • Dupliquer les clés ({"foo":"bar","foo":"baz"}) produire des résultats non définis et spécifiques à la mise en œuvre; la spécification JSON ne définit pas spécifiquement leur sémantique

En JavaScript, les littéraux d'objet peuvent avoir

  • Les littéraux de chaîne, les nombres numériques ou les noms d'identifiant en tant que clés (depuis ES6, les clés peuvent maintenant aussi être calculées, ce qui introduit encore une autre syntaxe).
  • Les valeurs peuvent être toute expression JavaScript valide, y compris les définitions de fonction et undefined.
  • Les clés en double produisent des résultats définis et spécifiés (en mode lâche, cette dernière définition remplace la première; en mode strict, c'est une erreur).

Sachant cela, il suffit de regarder la syntaxe, votre exemple n’est pas JSON pour deux raisons:

  1. Vos clés ne sont pas des chaînes (littéraux). Ils sont noms d'identifiant.
  2. Vous ne pouvez pas attribuer une fonction en tant que valeur à un "objet JSON" (car JSON ne définit aucune syntaxe pour les fonctions).

Mais surtout, pour répéter mon explication depuis le début: Vous êtes dans un contexte JavaScript. Vous définissez un objet JavaScript. Le cas échéant, un "objet JSON" ne peut être contenu que dans une chaîne:

 var obj = {foo: 42}; // creates a JavaScript object (this is *not* JSON)
 var json = '{"foo": 452}'; // creates a string containing JSON

Autrement dit, si vous écrivez du code source JavaScript et que vous ne traitez pas avec un chaîne, vous ne traitez pas avec JSON. Vous avez peut-être reçu les données au format JSON (par exemple, via ajax ou en lisant un fichier), mais une fois que vous ou une bibliothèque que vous utilisez l'avez analysée, ce n'est plus du JSON.


Uniquement parce que les littéraux d'objet et JSON ont l'air similaires, cela ne signifie pas que vous pouvez les nommer de manière interchangeable. Voir aussi - n "objet JSON" n'existe pas .

237
Felix Kling

JSON a une syntaxe beaucoup plus limitée, notamment:

  • Les valeurs clés doivent être citées
  • Les chaînes doivent être citées avec " et pas '
  • Vous avez une plage de valeurs plus limitée (par exemple, aucune fonction autorisée)
40
Quentin

Il n’existe vraiment pas d’objet JSON.

La spécification JSON est une syntaxe permettant de coder des données sous forme de chaîne. Ce que les gens appellent un "objet JSON" (en javascript) n'est en réalité qu'un objet javascript ordinaire qui a (probablement) été désérialisé d'une chaîne JSON valide et qui peut être facilement rediffusé en tant que chaîne JSON valide. Cela signifie généralement qu'il ne contient que des données (et non des fonctions). Cela signifie également qu'il n'y a pas de date, car JSON n'a pas de type de date (probablement la chose la plus douloureuse à propos de JSON;)

De plus, quand on parle d'un "objet JSON", on entend presque toujours des données comportant des "accolades" au plus haut niveau. Cela correspond bien à un objet javascript. Cependant, la spécification JSON ne nécessite pas la présence d'un seul objet "accolades" au niveau supérieur d'une chaîne JSON. JSON est parfaitement valide d'avoir une liste au plus haut niveau, voire une seule valeur. Ainsi, alors que chaque "objet JSON" correspond à un JSON valide, toutes les chaînes JSON valides ne correspondent pas à ce que nous appellerions un "objet JSON"! (parce que la chaîne pourrait représenter une liste ou une valeur atomique)

14
Nick Perkins

Selon JSON en JavaScript ,

JSON est un sous-ensemble de la notation littérale d'objet de JavaScript.

En d'autres termes, un JSON valide est également une notation littérale d'objet JavaScript valide, mais pas nécessairement l'inverse.

En plus de la lecture de documentation , comme @Filix King l'a suggéré, je suggère également de jouer avec le validateur JSON en ligne JSONLint . C'est ainsi que j'ai appris que les clés des objets JSON doivent être des chaînes.

9
ma11hew28

???? JSON : l'alternative sans gras au XML

JSON a été largement adopté par les personnes qui ont constaté qu’il était beaucoup plus facile de produire des applications et des services distribués. Le type de média Internet officiel pour JSON est application/jsonRFC 4627. Les noms de fichiers JSON utilisent l'extension .json.


► La notation d'objet JavaScript ( JSON ) est un format d'échange de données léger, basé sur le texte et indépendant de la langue. JSON a été utilisé pour échanger des données entre des applications écrites dans n’importe quel langage de programmation.

L'objet JSON est un objet unique contenant deux fonctions, analyse et stringify, utilisées pour analyser et construire des textes JSON.

  • JSON.stringify génère une chaîne conforme à la grammaire JSON suivante.
  • JSON.parse accepte une chaîne conforme à la grammaire JSON.

La méthode parseJSON sera incluse dans Fourth Edition of ECMAScript . En attendant, une implémentation de JavaScript est disponible sur json.org.

var objLiteral = {foo: 42}; // JavaScript Object
console.log('Object Literal : ', objLiteral ); // Object {foo: 42}foo: 42__proto__: Object

// This is a JSON String, like what you'd get back from an AJAX request.
var jsonString = '{"foo": 452}';
console.log('JOSN String : ', jsonString ); // {"foo": 452}

// This is how you deserialize that JSON String into an Object.
var serverResposnceObject = JSON.parse( jsonString );
console.log('Converting Ajax response to JavaScript Object : ', serverResposnceObject); // Object {foo: 42}foo: 42 __proto__: Object

// And this is how you serialize an Object into a JSON String.
var serverRequestJSON = JSON.stringify( objLiteral );
console.log('Reqesting server with JSON Data : ', serverRequestJSON); // '{"foo": 452}'

JSON est un sous-ensemble de JavaScript. Javascript est dérivé de la norme ECMAScript Programming Language.


► ECMAScript

ECMAScript est devenu l’un des langages de programmation généraux les plus utilisés au monde. Mieux connu comme langage intégré dans les navigateurs Web, il a également été largement adopté pour les applications serveur et embarquées. ECMAScript est basé sur plusieurs technologies d'origine, le le plus connu est JavaScript (Netscape Communications)) et JScript (Microsoft Corporation).). Avant 1994, l'ECMA était connue sous le nom de "European Computer Manufacturers Association". Après 1994, date à laquelle l'organisation est devenue mondiale, la "marque" "Ecma" a été conservée pour des raisons historiques.

ECMAScript est le langage, alors que JavaScript, JScript et même ActionScript sont appelés "Dialects" _ .

Les dialectes ont été dérivés de la même langue. Ils sont assez semblables les uns aux autres car ils ont été dérivés du même langage mais ils ont subi quelques modifications. Un dialecte est une variation de la langue elle-même. Il est dérivé d'une langue unique.

  • Langage SQL - Dialect Hibernate MySQL, Oracle Dialect, .. qui ont des modifications ou des fonctionnalités ajoutées.

Informations sur le navigateur et l'ordinateur de vos utilisateurs.

navigator.appName // "Netscape"

ECMAScript est le langage de script qui constitue la base de JavaScript. JavaScriptlanguage resources .

ECMA-262Links
Initial Edition, June 1997PDF.
2nd Edition, August 1998PDF.
3rd Edition, December 1999PDF.
5th Edition, December 2009PDF.
5.1 Edition, June 2011HTML.
6th Edition, June 2015HTML.
7ᵗʰ Edition, June 2016HTML.
8th edition, June 2017HTML.
9th Edition, 2018HTML.

NOTE "4ème édition de ECMAScript not publié car le travail était incomplet .


JSON définit un petit ensemble de règles de formatage pour la représentation portable de données structurées.

  1. ► Les valeurs de clé doivent être indiquées, seules les chaînes sont autorisées pour les clés. Si vous utilisez autre chose que String, il sera converti en chaîne. Mais il n'est pas recommandé d'utiliser des clés autres que celles de String. Vérifiez un exemple comme celui-ci - { 'key':'val' } plus de RFC 4627 - jsonformatter

    var storage = {
      0 : null,
      1 : "Hello"
    };
    console.log( storage[1] ); // Hello
    console.log( JSON.stringify( storage ) ); // {"0":null,"1":"Hello","2":"world!"}
    
    var objLiteral = {'key1':'val1'};
        var arr = [10, 20], arr2 = [ 'Yash', 'Sam' ];
        var obj = { k: 'v' }, obj2 = { k2: 'v2' };
        var fun = function keyFun() {} ;
    
    objLiteral[ arr ] = 'ArrayVal';     objLiteral[ arr2 ] = 'OverridenArrayVal';
    objLiteral[ obj ] = 'ObjectVal';    objLiteral[ obj2 ] = 'OverridenObjectVal';
    objLiteral[ fun ] = 'FunctionVal';
    
    console.log( objLiteral );
    // Object {key1: "val1", 10,20: "ArrayVal", Yash,Sam: "OverridenArrayVal", [object Object]: "OverridenObjectVal", function keyFun() {}: "FunctionVal"}
    console.log( JSON.stringify( objLiteral ) );
    // {"key1":"val1","10,20":"ArrayVal","Yash,Sam":"OverridenArrayVal","[object Object]":"OverridenObjectVal","function keyFun() {}":"FunctionVal"}
    console.log( JSON.parse( JSON.stringify( objLiteral ) ) );
    // Object {key1: "val1", 10,20: "ArrayVal", Yash,Sam: "OverridenArrayVal", [object Object]: "OverridenObjectVal", function keyFun() {}: "FunctionVal"}
    
    console.log('Accessing Array  Val : ', objLiteral[ [10,20] ] );
    console.log('Accessing Object Val : ', objLiteral[ '[object Object]' ] );
    console.log('Accessing Function Val : ', objLiteral[ 'function keyFun() {}' ] );
    
  2. ► Les chaînes JSON doivent être entourées de "et non". Une chaîne ressemble beaucoup à un C ou Java. ) Les chaînes doivent être entourées de guillemets.

    • Les littéraux sont des valeurs fixes, et non des variables, que vous fournissez littéralement dans votre script.
    • Une chaîne est une séquence de zéro ou plusieurs caractères entourés de guillemets avec une barre oblique inversée, la même notation que celle utilisée dans la plupart des langages de programmation.
      • ???? - Les symboles spéciaux sont autorisés dans String mais leur utilisation n’est pas recommandée.
      • \ "- Des caractères spéciaux peuvent être échappés. Mais il n’est pas recommandé d’échapper (') Citations uniques. En mode strict, le résultat est une erreur - SyntaxError: Unexpected token ' in JSON

    Vérifiez avec ce code { "Hai\" \n Team ????":5, "Bye \'": 7 } sur les éditions JSON en ligne. ModesnotStrict,Strinct.

    var jsonString = "{'foo': 452}"; // {'foo': 452}
    var jsonStr = '{"foo": 452}'; // {"foo": 452}
    
    JSON.parse( jsonString ); // Unexpected token ' in JSON at position 1(…)
    JSON.parse( jsonStr ); // Object {foo: 452}
    
    objLiteral['key'] = 'val'; // Object {foo: 42, key: "val"}
    objLiteral.key2 = 'val';
    
    // objLiteral.key\n3 - SyntaxError: Invalid or unexpected token
    objLiteral['key\n3'] = 'val'; // Object {"foo": "42", key: "val", key2: "val", "key↵3": "val"}
    
    JSON.stringify( objLiteral ); // {"foo":"42","key":"val","key2":"val","key\n3":"val"}
    

Object Accesseurs de propriétés permet d'accéder aux propriétés d'un objet en utilisant la notation par points ou la notation par crochets.

  1. ► Vous avez une plage de valeurs plus limitée (par exemple, aucune fonction autorisée). Une valeur peut être une chaîne entre guillemets, nombre, booléen, null, objet ou tableau. Ces structures peuvent être imbriquées.

    var objLiteral = {};
    objLiteral.funKey = function sayHello() {
        console.log('Object Key with function as value - Its outcome message.');
    };
    
    objLiteral['Key'] = 'Val';
    
    console.log('Object Literal Fun : ', objLiteral );
    // Object Literal Fun :  Object {Key: "Val"}Key: "Val"funKey: sayHello()__proto__: Object
    console.log( JSON.stringify( objLiteral ) ); // {"Key":"Val"}
    

enter image description here


JavaScript est l'implémentation la plus répandue de la norme ECMAScript. Les fonctionnalités principales de Javascript sont basées sur la norme ECMAScript, mais Javascript comporte également d'autres fonctionnalités supplémentaires qui ne figurent pas dans les spécifications/normes ECMA. Chaque navigateur dispose d'un interprète JavaScript.

JavaScript est un langage typé dynamiquement. Cela signifie que vous n'avez pas à spécifier le type de données d'une variable lorsque vous la déclarez et que les types de données sont convertis automatiquement selon les besoins lors de l'exécution du script.

Literals :

'37' - 7    // 30
'37' + 7    // "377"
+'37' + 7   // 44
+'37'       // 37
'37'        // "37"

parseInt('37');     // 37
parseInt('3.7');    // 3

parseFloat(3.7);    // 3.7

// An alternative method of retrieving a number from a string is with the + (unary plus) operator:
+'3.7'              // 3.7

Object literalsRFC 7159

Une structure d'objet est représentée par une paire d'accolades entourant zéro ou plusieurs paires nom/valeur (ou membres). Un nom est une chaîne. Un seul deux-points vient après chaque nom, séparant le nom de la valeur. Une seule virgule sépare une valeur du nom suivant. Les noms contenus dans un objet DEVRAIENT être uniques.

ECMAScript prend en charge l'héritage basé sur un prototype. Chaque constructeur a un prototype associé et chaque objet créé par ce constructeur a une référence implicite au prototype (appelée prototype de l’objet) associée à son constructeur. De plus, un prototype peut avoir une référence implicite non nulle à son prototype, etc. c'est ce qu'on appelle la chaîne de prototypes.

Dans un langage orienté objet basé sur une classe, en général, l'état est porté par des instances, les méthodes sont portées par des classes et l'héritage est uniquement de structure et de comportement. Dans ECMAScript, l'état et les méthodes sont véhiculés par des objets, et la structure, le comportement et l'état sont tous hérités.

Un prototype est un objet utilisé pour implémenter l'héritage de structure, d'état et de comportement dans ECMAScript. Lorsqu'un constructeur crée un objet, celui-ci fait référence implicitement au prototype associé au constructeur afin de résoudre les références de propriété. Le prototype associé au constructeur peut être référencé par l’expression de programme constructor.prototype et les propriétés ajoutées au prototype d’un objet sont partagées, par héritage, par tous les objets partageant le prototype.

3
Yash

Pour ceux qui pensent encore que les RFC sont plus importants que les blogs et les idées fausses basées sur les opinions, essayons de répondre en clarifiant certains points. Je ne vais pas répéter toutes les différences correctes déjà mentionnées dans les réponses précédentes, je ne fais qu'essayer d'ajouter une valeur en résumant une partie cruciale

Extraits de https://tools.ietf.org/html/rfc7159

  1. JavaScript Object Notation (JSON) est un format de texte pour la sérialisation de données structurées. Il est dérivé de l'objet de JavaScript, tel que défini dans la troisième édition du standard de langage de programmation ECMAScript [ECMA-262].
  2. JSON peut représenter quatre types primitifs (chaînes, nombres, booléens et null) et deux types structurés ( objets et tableaux).
  3. Un objet est une collection non ordonnée de zéro ou plusieurs paires nom/valeur, où un nom est une chaîne et une valeur est une chaîne, un nombre, un booléen, null, objet ou tableau.
  4. begin-object = ws% x7B ws; {accolade gauche
  5. objet final = ws% x7D ws; } accolade droite
  6. Une valeur JSON DOIT être un objet , un tableau, un nombre ou une chaîne, ou l'un des trois noms littéraux suivants: false null true
  7. Une structure d'objet est représentée par une paire d'accolades
  8. Les noms contenus dans un objet DEVRAIENT être uniques. object = begin-object [membre * (membre séparateur de valeurs) ] objet final
  9. Un objet dont les noms sont tous uniques est interopérable en ce sens que toutes les implémentations logicielles recevant cet objet conviendra des mappages nom-valeur. Lorsque les noms contenus dans un objet ne sont pas uniques, le comportement du logiciel recevant un tel objet est imprévisible.
  10. Exemples (à partir de la page 12 du RFC)

    Ceci est un objet JSON:

          {
            "Image": {
                "Width":  800,
                "Height": 600,
                "Title":  "View from 15th Floor",
                "Thumbnail": {
                    "Url":    "http://www.example.com/image/481989943",
                    "Height": 125,
                    "Width":  100
                },
                "Animated" : false,
                "IDs": [116, 943, 234, 38793]
              }
          }
    

    Son membre Image est un objet dont le membre Thumbnail est un objet et dont Le membre ID est un tableau de nombres.

Il n’existe vraiment pas d’objet JSON.

vraiment?

2
Daniele D.

Autant que je sache, la différence principale est la flexibilité.

JSON est une sorte de wrapper sur "JavaScript Object Notation" qui oblige les utilisateurs à obéir à des règles plus strictes pour la définition des objets. Et cela se produit en limitant les possibilités de déclaration d'objet fournies par la fonctionnalité JavaScript Object Notation.

En conséquence, nous avons des objets plus simples et plus normalisés qui conviennent mieux à l'échange de données entre plates-formes.

Donc, fondamentalement, newObject dans mon exemple ci-dessus est un objet défini à l'aide de la notation JavaScript Objeect; mais ce n'est pas un objet JSON 'valide' car il ne respecte pas les règles requises par les normes JSON.

Ce lien est également très utile: http://msdn.Microsoft.com/en-us/library/bb299886.aspx

1
pencilCake

Javascript Objectal littal vs JSON:

  • La syntaxe littérale d'objet est un moyen très pratique de créer des objets javascript.
  • Le langage JSON, qui signifie "notation d'objet Javascript", a sa syntaxe dérivée de la syntaxe littérale d'objet javascript. Il est utilisé comme format de transfert de données textuelles indépendant du langage de programmation.

Exemple:

Notation d'objet JS, utilisée dans JS pour créer facilement des objets dans le code:

const JS_Object = {
  1: 2,  // the key here is the number 1, the value is the number 2
  a: 'b', // the key is the string a, the value is the string b
  func: function () { console.log('hi') }
  // the key is func, the value is the function
}

Exemple de JSON:

{"widget": {
    "debug": "on",
    "window": {
        "title": "Sample Konfabulator Widget",
        "name": "main_window",
        "width": 500,
        "height": 500
    },
    "image": { 
        "src": "Images/Sun.png",
        "name": "Sun1",
        "hOffset": 250,
        "vOffset": 250,
        "alignment": "center"
    },
    "text": {
        "data": "Click Here",
        "size": 36,
        "style": "bold",
        "name": "text1",
        "hOffset": 250,
        "vOffset": 100,
        "alignment": "center",
        "onMouseUp": "Sun1.opacity = (Sun1.opacity / 100) * 90;"
    }
}}

Principales différences:

  • Toutes les clés d'objet dans JSON doivent être des chaînes. En Javascript, les objets peuvent être des chaînes ou des chiffres

  • Toutes les chaînes de caractères JSON doivent être entre guillemets doubles. Alors qu'en Javascript, les guillemets simples et les guillemets doubles sont autorisés. Même sans guillemets dans la notation de l'objet Javascript, les clés d'objet sont implicitement converties en chaînes.

  • En JSON, une fonction ne peut pas être définie en tant que valeur d'un objet (étant donné que cela est spécifique à Javascript). En Javascript, c'est complètement légal.

construction en Javascript JSON objet:

Les objets JSON peuvent être facilement convertis en Javascript et inversement à l'aide de l'objet intégré JSON proposé par Javascript lors de son exécution. Par exemple:

const Object = {
  property1: true,
  property2: false,
}; // creating object with JS object literal syntax

const JSON_object = JSON.stringify(Object);  // stringify JS object to a JSON string

console.log(JSON_object); // note that the (string) keys are in double quotes

const JS_object = JSON.parse(JSON_object);  // parse JSON string to JS object

console.log(JS_object.property1, JS_object.property2); 
// accessing keys of the newly created object
0

D'abord, vous devez savoir ce qu'est JSON:

C'est un format d'échange de données indépendant de la langue. La syntaxe de JSON a été inspirée par la notation JavaScript Object Literal, mais il existe des différences entre eux.

Par exemple, dans JSON, toutes les clés doivent être entre guillemets, alors que dans les littéraux d'objet, cela n'est pas nécessaire:

// JSON: {"foo": "bar"}

// Littéral d'objet: var o = {foo: "bar"}; Les guillemets sont obligatoires sur JSON car en JavaScript (plus précisément dans ECMAScript 3rd. Edition), l'utilisation de mots réservés en tant que noms de propriété est interdite, par exemple:

var o = {if: "foo"}; // SyntaxError dans ES3 While, l'utilisation d'un littéral de chaîne comme nom de propriété (en indiquant le nom de la propriété) ne pose aucun problème:

var o = {"if": "foo"}; Donc, pour la "compatibilité" (et une évaluation facile peut-être?), Les guillemets sont obligatoires.

Les types de données dans JSON sont également limités aux valeurs suivantes:

string number object array Un littéral sous la forme: true false null La grammaire de Strings change. Ils doivent être délimités par des guillemets doubles, tandis qu'en JavaScript, vous pouvez utiliser des guillemets simples ou doubles de façon interchangeable.

// JSON invalide: {"foo": 'bar'} La grammaire JSON acceptée de Numbers change également. En JavaScript, vous pouvez utiliser des littéraux hexadécimaux, par exemple 0xFF, ou (les tristement célèbres) littéraux octaux, par exemple. 010. En JSON, vous ne pouvez utiliser que des littéraux décimaux.

// JSON invalide: {"foo": 0xFF}

0
Razi Syed 'Abdi'