How to I extract the contents of a variable and place them into a constant? Node.js

Question

Im trying to extract the contents of variable topPost and place it into const options under url. I cant seem to get it to work. Im using the snoowrap/Reddit API and image-downloader.

var subReddit = r.getSubreddit('dankmemes');
var topPost = subReddit.getTop({time: 'hour' , limit: 1,}).map(post => post.url).then(console.log);
var postTitle = subReddit.getTop({time: 'hour' , limit: 1 }).map(post => post.title).then(console.log);

const options = {
  url: topPost,
  dest: './dank_memes/photo.jpg'
}

async function downloadIMG() {
  try {
    const { filename, image } = await download.image(options)
    console.log(filename) // => /path/to/dest/image.jpg
  } catch (e) {
    console.error(e)
  }
}

the recommended formatting for the image downloader is as follows:

const options = {
  url: 'http://someurl.com/image.jpg',
  dest: '/path/to/dest'
}

async function downloadIMG() {
  try {
    const { filename, image } = await download.image(options)
    console.log(filename) // => /path/to/dest/image.jpg
  } catch (e) {
    console.error(e)
  }
}

downloadIMG()

so it looks like i have to have my url formatted in between ' ' but i have no idea how to get the url from var topPost and place it in between those quotes.

any ideas would be greatly appreciated. Thanks!

Answer 1

topPost is a Promise, not the final value.

Promises existence is to work with asynchronous data easily. Asynchronous data is data that returns at a point in the future, not instantly, and that's why they have a then method. When a Promise resolves to a value, the then callback is called.

In this case, the library will connect to Reddit and download data from it, which is not something that can done instantly, so the code will continue running and later will call the then callback, when the data has finished downloading. So:

var subReddit = r.getSubreddit('dankmemes');
// First we get the top posts, and register a "then" callback to receive all these posts
subReddit.getTop({time: 'hour' , limit: 1,}).map(post => post.url).then((topPost) => {
    // When we got the top posts, we connect again to Reddit to get the top posts title.
    subReddit.getTop({time: 'hour' , limit: 1 }).map(post => post.title).then((postTitle) => {
        // Here you have both topPost and postTitle (which will be both arrays. You must access the first element)
        console.log("This console.log will be called last");
    });
});
// The script will continue running at this point, but the script is still connecting to Reddit and downloading the data
console.log("This console.log will be called first");

With this code you have a problem. You first connect to Reddit to get the top post URL, and then you connect to Reddit again to get the post Title. Is like pressing F5 in between. Simply think that if a new post is added between those queries, you will get the wrong title (and also you are consuming double bandwidth consumption, which is not optimal too). The correct way of doing this is to get both the title and the url on the same query. How to do so?, like this:

var subReddit = r.getSubreddit('dankmemes');
// We get the top posts, and map BOTH the url and title
subReddit.getTop({time: 'hour' , limit: 1,}).map(post => {
    return {
        url: post.url,
        title: post.title
    };
}).then((topPostUrlAndTitle) => {
    // Here you have topPostUrlAndTitle[0].url and topPostUrlAndTitle[0].title
    // Note how topPostUrlAndTitle is an array, as you are actually asking for "all top posts" although you are limiting to only one.
});

BUT this is also weird to do. Why don't you just get the post data directly? Like so:

var subReddit = r.getSubreddit('dankmemes');
// We get the top posts
subReddit.getTop({time: 'hour' , limit: 1,}).then((posts) => {
    // Here you have posts[0].url and posts[0].title
});

There's a way to get rid of JavaScript callback hell with async/await, but I'm not going to enter into matter because for a newbie is a bit difficult to explain why is not synchronous code although it seems to look like so.