Passing data between ES6 classes?

Question

So I'm creating a node/express app for fun, and I made an ES6 class that calls the Twitter API and gets data back. Let's call this 'TwitterClient.es6'. In my 'server.es6' I'm serving up the routes (though I'll eventually change how this is done too), and I want to pass the data returned from my TwitterClient to my server. Without a database (yet), can this be done? I was thinking of using getters and setters but I'm slightly off and it's tripping me up. Right now the data is coming back undefined with my getter function and I'm not sure why. Not to mention Node is a pain to debug. I'm so used to React being able to pass props and state that I almost forgot how to do this in regular old JS! Any help would be amazing.

server.es6

import express from 'express';
import { DB_DEV } from 'database_config';
import bodyParser from 'body-parser';
import util from 'util';
import TwitterClient from 'twitter_client';
import http from 'http';
import debug from 'debug';

const server = express();

server.get('/', function (req, res) {
    var twitter_client = new TwitterClient();
    var data = twitter_client.getData();
    res.send(data);
});

server.listen(3000, function () {
    console.log('Example app listening at ' + 3000);
});

export default server;

TwitterClient.es6

import Twitter from 'twitter';

class TwitterClient {

    constructor() {
        this.fetchTweets();
    }

    fetchTweets() {
        console.log('fetch');
        var self = this;

        var twitter = new Twitter({
            consumer_key: 'xxx',
            consumer_secret: 'xxx',
            access_token_key: 'xxx',
            access_token_secret: 'xxx'
        });

        var params = {
            screen_name: 'jimmyfallon',
            count: 1
        };

        twitter.get('statuses/user_timeline', params, function(error, tweets,   response) {
            if (error) self.handleFetchError(error);
            self.handleFetchSuccess(tweets);
        });

    }

    handleFetchSuccess(tweets) {
        this.set(tweets);
    }

    handleFetchError(error) {
        console.log(error);
    }

    set(data) {
        console.log('I was set!');
        this.tweets = data;
    }

    getData() {
        console.log('I was got!');
        return this.tweets;
    }

    render() {
        console.log('render me timbers!');
        this.getMe();
    }

}

export default TwitterClient;

score 1 · Accepted Answer · edited May 23 '17 at 12:29

You are calling getData() before twitter.get(..) is done. This has nothing to do with classes and everything to do with the asynchronous nature of JavaScript.

I would let the class method return a promise. For example:

class TwitterClient {

    constructor() {
        this._tweets = this.fetchTweets();
    }

    fetchTweets() {
        console.log('fetch');
        var self = this;

        var twitter = new Twitter({
            consumer_key: 'xxx',
            consumer_secret: 'xxx',
            access_token_key: 'xxx',
            access_token_secret: 'xxx'
        });

        var params = {
            screen_name: 'jimmyfallon',
            count: 1
        };

        return new Promise(function(resolve, reject) {
            twitter.get('statuses/user_timeline', params, function(error, tweets, response) {
                if (error) reject(error);
                resolve(tweets);
            });
        });

    }

    getData() {
        return this._tweets;
    }

}

export default TwitterClient;

and

server.get('/', function (req, res) {
    var twitter_client = new TwitterClient();
    twitter_client.getData().then(
        function(data) {
            res.send(data);
        },
        function(error) {
            // ...
        }
    );
});

See these questions for more information:

This is exactly 100% what I needed. I definitely need to become more familiar with Promises and I learned a lot from this. Thank you so much! Glad to know I wasn't way too off track, but this definitely added a new tool to my toolbox. — eightonrose, Sep 19 '15 at 04:17

Passing data between ES6 classes?

1 Answers1