4

I'm actually new to JavaScript. So here's my question.

From what I learned. I can create a public function (getHello) inside a self invoke function (Example1) & call the created public function from another self invoke function (Example2) like shown below:-

// first self-invoke function
const Example1 = (() => {
    // daclare var to hold Hello World
    let hello = 'Hello World'

    return {
        // create public function to passed 'Hello World'
        getHello: () => {    
            return hello
        }
    }
})();

// second self-invoke function - receive 1 argument (Example1 function)
const Example2 = ((e1) => {
    // declare new var
    let newHello = e1.getHello()
    console.log(newHello) // will Output: Hello World

})(Example1);

I have tried the above code and it works wonder. Never knew that JavaScript could be so much fun! This means that I can basically share any private 'data' inside Example1 to any other self-invoke functions as long as I create a public function to enable the data sharing.

Anyway, with that in mind. I thought why not I create a dedicated self-invoking function to handle any data fetch from an API. So to do that I need to put async at the self invoke function in order to use await for fetching json data (as shown below)

// first async self-invoke function
const Example1 = (async() => {
    // get data from API fetch
    let res = await fetch(API_URL)
    let json = await res.json()
    let hello = json

    return {
        // create public function to passed 'Hello World'
        getHello: () => {    
            return hello
        }
    }
})();

// second self-invoke function - receive 1 argument (Example1 function)
const Example2 = ((e1) => {
    // declare new var
    let newHello = e1.getHello() // error occurs here
    console.log(newHello)

})(Example1);

But unfortunately, by doing so. It gave me this error saying "e1.getHello is not a function".

I have tried searching the answer or any explanation on google. But I can't seem to find any relevant topic discussing regarding what i just illustrate here.

So the questions would be;-

1) Can an async self-invoke function returns a public function at all? or I shouldn't or not recommended to do this at all?

2) If can/cannot, then why?

Any help would be appreciated!

lala
  • 1,309
  • 9
  • 21

1 Answers1

3

async function returns Promise object. In the given example, Example1 will be a Promise object, not pure object.

So if you want to use it, you have to use then or await to get the value in the promise.

This will work as expected:

const Example1 = (async() => {
    let res = await fetch(API_URL)
    let json = await res.json()
    let hello = json

    return {
        getHello: () => {    
            return hello
        }
    }
})();

const Example2 = (async (e1) => {
    el = await e1; // **** THIS IS KEY POINT ****
    let newHello = e1.getHello()
    console.log(newHello)
})(Example1);
Yonggoo Noh
  • 1,811
  • 3
  • 22
  • 37
  • so since `async` function returns `Promise` as you've mentioned above. That means if `Example2` wants to returns a public function, then any self-invoke function that going to use the public function must use `then` or `await` in order to make use of the value right? And that also means the invoke function will have to use `async` also. Am I right ? – lala Mar 03 '20 at 03:50
  • To be clear, what do you mean by "public function"? it just means not private function? – Yonggoo Noh Mar 03 '20 at 03:55
  • The one declared in `return` object in `Example1` function, `getHello` function is a public function right? Since other function can access them. – lala Mar 03 '20 at 04:54
  • Hmm. AFAIK, JS developers don't call it "public function". `Example1` is just assigned an object `{getHello: ... }` by invoking the first async function and that object has a function `getHello`. Anyway, back to your question. If `Example2` also wants to return an object from the `Example1` information, yes, you have to use `then` or `await` **because `Example1` is a Promise object**. You have to use `then` or `await` to get an information from resolved Promise. Try it in console! – Yonggoo Noh Mar 03 '20 at 05:33
  • Thanks for the help. Especially your explanation on Promises and stuff. Easy to understand. Really appreciated it! – lala Mar 03 '20 at 06:47