-1

So this is probably a dumb question, but I am new to JavaScript and didn't manage to find an answer anywhere else.

I am trying to get the title and artist from a spotify url. I do this by using 2 api's: Isomorphic Unfetch and spotify-url-info.

This is my code:

getPreview(url).then(data => console.log(data))

and when i run that code it displays this:

{
  date: '1961-10-20T00:00:00.000Z',   
  title: "Can't Help Falling in Love",
  type: 'track',
  track: "Can't Help Falling in Love",
  description: undefined,
  artist: 'Elvis Presley',
  image: 'https://i.scdn.co/image/ab67616d0000b273f96cefb0197694ad440c3314',
  audio: 'https://p.scdn.co/mp3-preview/5b97db904e564c1b7d140ef45cb83b1da4233d17',
  link: 'https://open.spotify.com/track/44AyOl4qVkzS48vBsbNXaC',
  embed: 'https://embed.spotify.com/?uri=spotify:track:44AyOl4qVkzS48vBsbNXaC'
}

But now my question is, how do I extract the title and artist to a seperate variable so I could use the data?

isherwood
  • 58,414
  • 16
  • 114
  • 157
vixitu
  • 11
  • 3
  • [You can use the data _without_ doing that](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#objects_and_properties). – isherwood Sep 22 '22 at 21:09
  • 1
    I think your question is mainly about the fact that the result is asynchronous? You could declare the function/method calling `getPreview` as async and then use await and manipulate the rest in a synchronous way. `async function test() {const data = await getPreview(url);const title = data.title; /* do other things in a synchronous way */}` – user3252327 Sep 22 '22 at 21:14
  • I'm almost positive that @user3252327 is right about what the actual is. The OP should add an edit showing how exactly they are trying to access the data and what error they are getting as part of an [mcve]. Until then we are just guessing. – zero298 Sep 22 '22 at 21:21
  • @isherwood Why did you reopen this? The comments on the answer below show that this is another duplicate of how to access values outside of a promise chain. The OP still hasn't edited their question to show how they are actually trying to access data. – zero298 Sep 23 '22 at 15:16
  • The two comments above raised doubt. I'd rather give the benefit of that doubt since I had unilaterally closed it. – isherwood Sep 23 '22 at 16:06

1 Answers1

2

you could do

const {title, artist} = data

that would get you two different variables. one containing the artist and the other one containing the title, as long as their keys match the data object;

or you could do

const music = {title: data.title, artist: data.artist}

that will create a new object with the title, and track. like so:

{
  title: "can't help falling in love",
  artist: "Elvis Presley"
}

but you can absolutely use their data without destructuring, like I did before, you can use data.artist and so on. for example:

console.log(data.artist) //"Elvis Presley"
Vowye
  • 46
  • 6
  • Thanks for answering. Could you please show me how exactly I should apply this. Because I am kinda confused where I should put this. If i try replacing the console.log(data) with const music = {title: data.title, artist: data.artist} it would give me an error. – vixitu Sep 22 '22 at 21:37
  • what error? could you be more specific? – Vowye Sep 22 '22 at 21:44
  • If I have `getPreview(url).then({const: music = {title: data.title, artist: data.artist}}) console.log(music)` as an example it would show this: `ReferenceError: data is not defined at Object.execute (E:\DiscordMusicBot\commands\play.js:97:58) at processTicksAndRejections (node:internal/process/task_queues:96:5) at async Client. (E:\DiscordMusicBot\index.js:62:9) ` – vixitu Sep 22 '22 at 21:54
  • you should do: `getPreview(url).then(data => { const music = {title: data.title, artist: data.artist} console.log(music) });` – Vowye Sep 22 '22 at 21:58
  • How can I access the title and artist from outside getPreview() constructor? Because I need those to put them in another constructor and if I try to just do something like `music.title` it says that music is not defined. – vixitu Sep 22 '22 at 22:05
  • That seems to work but if i try to access it it returns undefined – vixitu Sep 22 '22 at 22:14
  • https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise – Vowye Sep 22 '22 at 22:17