javascript - 如何在 JavaScript 中解构 json 数据

Question

给出这个json数据，如何修改为使用对象解构来获取参数对象的dob属性，理解有困难

{  
   "results":[  
      {  
         "gender":"female",
         "name":{  
            "title":"ms",
            "first":"emily",
            "last":"simmons"
         },
         "location":{  
            "street":"1514 preston rd",
            "city":"mackay",
            "state":"victoria",
            "postcode":3943,
            "coordinates":{  
               "latitude":"-82.6428",
               "longitude":"99.3586"
            },
            "timezone":{  
               "offset":"-5:00",
               "description":"Eastern Time (US & Canada), Bogota, Lima"
            }
         },
         "email":"emily.simmons@example.com",
         "login":{  
            "uuid":"4db43a8c-f811-4f66-9063-8de9af1b7ff4",
            "username":"brownlion857",
            "password":"girls",
            "salt":"Fff9zzxa",
            "md5":"4eb010fc1f3e9f72b6298b75cec001a1",
            "sha1":"086f0a1c0db596967033a77df62e21e6d407f647",
            "sha256":"d7f99aae053957d788fe17a80922877d04a491bd7ea00d7b6b41c94329468e12"
         },
         "dob":{  
            "date":"1992-10-20T03:47:03Z",
            "age":26
         },
         "registered":{  
            "date":"2012-02-25T19:05:12Z",
            "age":7
         },
         "phone":"09-1749-9293",
         "cell":"0490-139-057",
         "id":{  
            "name":"TFN",
            "value":"338334455"
         },
         "picture":{  
            "large":"https://randomuser.me/api/portraits/women/64.jpg",
            "medium":"https://randomuser.me/api/portraits/med/women/64.jpg",
            "thumbnail":"https://randomuser.me/api/portraits/thumb/women/64.jpg"
         },
         "nat":"AU"
      }
   ],
   "info":{  

   }
}

我做了这样的事情:

const displayBirthdate = ( {results: [{dob: {date, age } }]}) => 
{
}

有没有一种方法可以让我更简单地获取函数的 dob 参数？

Answer 1

您可以使用 Destructuring assignment 声明您的变量:

const json = {"results": [{"gender": "female","name": {"title": "ms","first": "emily","last": "simmons"},"location": {"street": "1514 preston rd","city": "mackay","state": "victoria","postcode": 3943,"coordinates": {  "latitude": "-82.6428",  "longitude": "99.3586"},"timezone": {  "offset": "-5:00",  "description": "Eastern Time (US & Canada), Bogota, Lima"}},"email": "emily.simmons@example.com","login": {"uuid": "4db43a8c-f811-4f66-9063-8de9af1b7ff4","username": "brownlion857","password": "girls","salt": "Fff9zzxa","md5": "4eb010fc1f3e9f72b6298b75cec001a1","sha1": "086f0a1c0db596967033a77df62e21e6d407f647","sha256": "d7f99aae053957d788fe17a80922877d04a491bd7ea00d7b6b41c94329468e12"},"dob": {"date": "1992-10-20T03:47:03Z","age": 26},"registered": {"date": "2012-02-25T19:05:12Z","age": 7},"phone": "09-1749-9293","cell": "0490-139-057","id": {"name": "TFN","value": "338334455"},"picture": {"large": "https://randomuser.me/api/portraits/women/64.jpg","medium": "https://randomuser.me/api/portraits/med/women/64.jpg","thumbnail": "https://randomuser.me/api/portraits/thumb/women/64.jpg"},"nat": "AU"}],"info": {}};
const {results: [{dob: {date, age}}]} = json;

console.log('date:', date);
console.log('age:', age);

根据评论:

• 我如何使它成为函数参数，例如 dob？

const json = {"results": [{"gender": "female","name": {"title": "ms","first": "emily","last": "simmons"},"location": {"street": "1514 preston rd","city": "mackay","state": "victoria","postcode": 3943,"coordinates": {  "latitude": "-82.6428",  "longitude": "99.3586"},"timezone": {  "offset": "-5:00",  "description": "Eastern Time (US & Canada), Bogota, Lima"}},"email": "emily.simmons@example.com","login": {"uuid": "4db43a8c-f811-4f66-9063-8de9af1b7ff4","username": "brownlion857","password": "girls","salt": "Fff9zzxa","md5": "4eb010fc1f3e9f72b6298b75cec001a1","sha1": "086f0a1c0db596967033a77df62e21e6d407f647","sha256": "d7f99aae053957d788fe17a80922877d04a491bd7ea00d7b6b41c94329468e12"},"dob": {"date": "1992-10-20T03:47:03Z","age": 26},"registered": {"date": "2012-02-25T19:05:12Z","age": 7},"phone": "09-1749-9293","cell": "0490-139-057","id": {"name": "TFN","value": "338334455"},"picture": {"large": "https://randomuser.me/api/portraits/women/64.jpg","medium": "https://randomuser.me/api/portraits/med/women/64.jpg","thumbnail": "https://randomuser.me/api/portraits/thumb/women/64.jpg"},"nat": "AU"}],"info": {}};
const getDate = dob => ({date, age} = dob);

console.log('displayBirthdate:', getDate(json.results[0].dob));