Je sais que ce n'est PAS un JSON valide, mais lorsque je le déclare comme variable directement dans mon code, je peux l'utiliser comme objet.

<script>
//  this will result in object
    var mydata = {
        users: [{
            person: {
                firstName: "Garry",
                lastName: "Finch"
            },
            jobTitle: "Front End Technical Lead",
            twitter: "gazraa"
        }, {
            person: {
                firstName: "Hans",
                lastName: "Wurst"
            },
            jobTitle: "Photographer",
            twitter: "photobasics"
        }, {
            person: {
                firstName: "Paul",
                lastName: "Stark"
            },
            jobTitle: "LEGO Geek",
            twitter: "minifigures"
        }]
    };

    console.log('mydata: ' + mydata);
    console.log(mydata);
</script>

console.log result

Maintenant je voudrais stocker les mêmes informations dans un fichier "table.data.js". le fichier ressemble alors à: (l'intérieur de BEGIN et END)

//BEGIN
{
    users: [{
        person: {
            firstName: "Garry",
            lastName: "Finch"
        },
        jobTitle: "Front End Technical Lead",
        twitter: "gazraa"
    }, {
        person: {
            firstName: "Hans",
            lastName: "Wurst"
        },
        jobTitle: "Photographer",
        twitter: "photobasics"
    }, {
        person: {
            firstName: "Paul",
            lastName: "Stark"
        },
        jobTitle: "LEGO Geek",
        twitter: "minifigures"
    }]
}
//END

J'ai essayé différentes façons de lire ce fichier

$.ajax({
    contentType: "application/json; charset=utf-8",
    url: "Content/modules/Controls/table/table.data.js",
    data: "{}",
    dataType: "json",
    success: function(data) {
        var json = data;
        console.log(json);
    }
});

Puis essayé avec $ .get et $ .getScript dans tous les cas le résultat ne serait pas le même objet

//var jqxhr = $.get("Content/modules/Controls/table/table.data.js", function () {
var jqxhr = $.getScript("Content/modules/Controls/table/table.data.js", function (data, textStatus, jqxhr) {
        console.log("success");
    }).done(function (data) {
        console.log(data);
        testdata = JSON.stringify(data);
        console.log(testdata);
  }).fail(function () {
      console.log("error");
  }).always(function () {
      console.log("finished");
  });

Le résultat ne serait plus jamais le même objet. Je ne peux enregistrer les données que sous forme de texte "simple" dans la console. Je suppose que c'est un petit pas pour certains connaisseurs, mais en fait pour moi un livre avec sept sceaux.

MODIFIER: Merci pour toutes les réponses. En résumé, cela signifie qu'il n'est PAS possible de charger les données externes, de les stocker dans une variable comme "mes données" et de travailler de la même manière que de les déclarer directement dans le code? Je changerai alors les données en JSON valide.

Ensuite, je donnerais à @Quentin la médaille pour la réponse précise la plus courte. Mais merci à tous pour vos éclaircissements.

0
MattOpen 17 avril 2018 à 12:04

3 réponses

Meilleure réponse

Votre fichier n'est pas JSON valide (car vous ne citez pas les noms de vos propriétés).

Votre fichier n'est pas du JavaScript valide (car vous ne pouvez pas avoir un objet littéral flottant au milieu de nulle part, vous avez besoin (par exemple) d'une affectation à sa gauche).

Vous devez modifier le fichier afin qu'il soit valide JSON ou JavaScript valide (de préférence l'ancien).

1
Quentin 17 avril 2018 à 09:08

Essayez de mettre toutes les clés dans le fichier js entre guillemets doubles, par exemple "users": [{ "person": { etc.

Même s'il ressemble à du javascript, JSON est un format de données et en tant que tel a ses propres règles.

0
Peter B 17 avril 2018 à 09:11

JSON est une représentation sérialisée des données hiérarchiques. Cela signifie que c'est essentiellement un moyen de stocker une structure hiérarchique (comme un objet) sous forme de chaîne qui peut être sérialisée (et envoyée sur le réseau, par exemple).

Si vous stockez le fichier en tant qu'objet JS comme dans la structure que vous avez montrée dans la question, vous devrez appeler ce fichier comme un autre script qui définit ces données en tant que global ou expose une fonction que vous pouvez invoquer pour renvoyer le Les données. Vous pouvez ensuite utiliser ces données dans vos autres fichiers qui ont accès à la même étendue.

<script src='./path/to/data.js'></script>
<script>
    console.log(data);
</script>

Et dans votre fichier data.js:

data =     {
    users: [{
        person: {
            firstName: "Garry",
            lastName: "Finch"
        },
        jobTitle: "Front End Technical Lead",
        twitter: "gazraa"
    }, {
        person: {
            firstName: "Hans",
            lastName: "Wurst"
        },
        jobTitle: "Photographer",
        twitter: "photobasics"
    }, {
        person: {
            firstName: "Paul",
            lastName: "Stark"
        },
        jobTitle: "LEGO Geek",
        twitter: "minifigures"
    }]
};

Si vous souhaitez utiliser un fichier JSON, votre fichier doit ressembler à ceci:

{
    "users": [
    {
        "person": {
        "firstName": "Garry",
        "lastName": "Finch"
        },
        "jobTitle": "Front End Technical Lead",
        "twitter": "gazraa"
    },
    {
        "person": {
        "firstName": "Hans",
        "lastName": "Wurst"
        },
        "jobTitle": "Photographer",
        "twitter": "photobasics"
    },
    {
        "person": {
        "firstName": "Paul",
        "lastName": "Stark"
        },
        "jobTitle": "LEGO Geek",
        "twitter": "minifigures"
    }
    ]
}

La principale différence étant que les clés d'objet sont entre guillemets. Pour obtenir cette représentation, vous pouvez appeler JSON.stringify(data) (où les données sont un objet JS) dans votre console qui renverra une chaîne JSON.

Si votre fichier est comme ça, vous pouvez utiliser AJAX comme indiqué dans votre question et récupérer les données de cette manière. Basé sur la bibliothèque AJAX que vous utilisez, il peut même faire automatiquement JSON.parse pour vous en fonction de la valeur de type de contenu de l'en-tête de réponse. (Je pense que jQuery le fait pour vous)

1
Chirag Ravindra 17 avril 2018 à 09:18