Ever wondered/faced situation where you need to extract JSON data from API response directly through console in browser!

Sometimes we need to extract the response/or part of it coming from API so that we can test with it for correct sets of output, before writing final code for it. Here are the steps for same.

1. After calling API(ignore the calling methods) and storing the response in variable “response”, we can see the output in console in below image.

response in browser’s console
response in browser’s console

2. Suppose we want to extract all data in key “listing” in a separate variable, so that as per need we can test it for extracting correct set of data out of it or for whatever purpose you need it.

3. Do right click on “listing” key, and select “Store object as global variable”.

4. This will create a copy in new variable “temp1”.

5. Now run below command, which copies in clipboard and then you can paste it anywhere like below its pasted in VS Code.

copy(temp1)

6. Now, we can convert the JSON data in object using below code and use it however you want.

JSON.parse(JSON.stringify(extractedObject))

I was facing issues on running map, filter, etc array operations on the key “listing” from response because I couldn’t extract it, so this is one of the way I got.

Hope its helpful !

Javascript | React Developer