如何将 JSON 数组转换为 javascript 对象数组？

Question

For example, this is the JSON array:

    [
     {
       "name":"Jennifer Bellingham",
       "shortname":"Jenni"
     },
     {
       "name":"Jonathan G. Ferrar II",
       "shortname":"Jonathan_Ferrar"
     }
    ]

And this is the format I want it to be converted (an array of javascript object) :

    [
     {
       name : "Jennifer Bellingham",
       shortname : "Jenni"
     },
     {
        name : "Jonathan G. Ferrar II",
        shortname : "Jonathan_Ferrar"
     }
    ]

I used JSON.parse() but I get this error:

SyntaxError: Unexpected token u in JSON at position 0

This is my code:

I have an angularjs app:

var app = angular.module('app', ['ngRoute','appControllers',
'ui.carousel']);

And this is my controller: (I'm trying to use angularjs ui carousel)

app.controller('uiCarousel', function($scope,$http) {
   $http.get('data/test.json').then(function(response){
        $scope.mySlides  = response.data;
        console.log("My Slides :", $scope.mySlides ); //I'm getting the result here
    });

    //But here I can't do the parsing right, 
    this.slides = JSON.parse($scope.mySlides);

});

this.slides in the code above expects this formatting :

       [
         {
           name : "Jennifer Bellingham",
           shortname : "Jenni"
         },
         {
            name : "Jonathan G. Ferrar II",
            shortname : "Jonathan_Ferrar"
         }
        ]

Answer 1

Thanks for submitting your first question.

It is a little unclear as to what code snippet actually gives the error you reference - if you could include that snippet, it might help us to understand your problem.

It might be that you're inputting an object into JSON.parse instead of a string.

The below code works for me - I've used backticks ` to create a string literal, contains the json string I wish to parse.

const jsonString = `
    [
     {
       "name":"Jennifer Bellingham",
       "shortname":"Jenni"
     },
     {
       "name":"Jonathan G. Ferrar II",
       "shortname":"Jonathan_Ferrar"
     }
    ]
`;

const arrayOfObjects = JSON.parse(jsonString);

console.log(arrayOfObjects); // Returns the array of objects you reference

Answer 2

Umm... JSON and javascript objects are kinda the same (latter can contain more things like functions, getters, setters, etc...)

I guess you are getting confused by the object literal writting style. {"key": "value"} and {key: "value"} is same.

So... response.data is actually a javascript object (which is equivalent to the JSON data)

Basically there's no need to parse anything...

 let a = [ { "name": "Jennifer Bellingham", "shortname": "Jenni" }, { "name": "Jonathan G. Ferrar II", "shortname": "Jonathan_Ferrar" } ]; let b = [ { name: "Jennifer Bellingham", shortname: "Jenni" }, { name : "Jonathan G. Ferrar II", shortname : "Jonathan_Ferrar" } ]; console.log(angular.equals(a,b));

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

And that's the reason why you getting an error because you are trying to parse an already parsed JSON string.

For example look at this link: https://en.wikipedia.org/api/rest_v1/page/summary/JavaScript the response body of the api is JSON so fetching this is like fetching a .json file

Then response.data will be a javascript object... hence I can directly access response.data.extract

 angular.module("myApp", []) .controller("myCtrl", function($scope, $http) { $http .get("https://en.wikipedia.org/api/rest_v1/page/summary/JavaScript") .then(function(response) { $scope.extract = response.data.extract; }) });

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="myApp" ng-controller="myCtrl">{{extract || "loading"}}</div>