How to call a function with same name on another file

Question

Im writting a OS in html, and my OS can support apps by specifying the main script, now i have two apps, one executing file1, and another, file2. And I have three files:

file1.js

function main() {
    //this is a code
    . . .
}

file2.js

function main() {
    //this is another code
    . . .
}

And i want to call just one of theirs function, the file1's function:

System.js

var System = {
/*
 *Used Mode:
 *
 *  var app = System.openApp(package);
 */
openApp:function(package) {

    //starts the app:
    var path = "/@APP:/" + package + "/app.xml";

    console.log("Opening " + package + "...");
    var xhttp = new XMLHttpRequest();
    xhttp.open("GET", path, true);
    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            console.log("The app \"" + xhttp.responseXML.getElementsByTagName("Manifest")[0].getElementsByTagName("AppName")[0].childNodes[0].nodeValue + "\" was successfully loaded!");
            if (xhttp.responseXML.getElementsByTagName("Manifest")[0].getElementsByTagName("AppMode")[0].childNodes[0].nodeValue = "prompted") {
                this.openMainAct();
            } 
        }
    };
    xhttp.onerror = function() {
        console.error("The app \"" + package + "\" was not found\n  ERROR_CODE:" + xhttp.readyState);
    };
    xhttp.send();

    //subfunctions:
    /*
     *Used Mode:
     *
     *  app.setIcon("path/to/file.png");
     */
    this.setIcon = function(icon) {
        // @TODO: Making Icons, just ignore;
    };
    /*
     *@DEPRECATED: Use the method "openAct"
     *
     *Used Mode:
     *  var MyAct = app.openMainAct();
     */
    this.openMainAct = function() {
        var a = document.createElement("script");
        a.src = this.getAppMainSource;
        document.body[0].appendChild(a);
                    //And HERE opens the main function!
    };

    //vars:
    this.getManifest = xhttp.responseXML.getElementsByTagName("Manifest")[0];
    this.getPackage = package;
    this.getAppFolder = "/@APP:/" + package;
    this.getAppMode = this.getManifest.getElementsByTagName("AppMode")[0];
    this.getName = xhttp.responseXML.getElementsByTagName("Manifest")[0].getElementsByTagName("AppName")[0];
    this.getJSource = this.getAppFolder + "/" + this.getManifest.getElentsByTagName("JSDir")[0];
    this.getJSDir = this.getManifest.getElementsByTagName("JSDir")[0];
    this.getVersion = this.getManifest.getElementsByTagName("Version")[0];
    this.getAppMainSource = this.getJSource + "/" + this.getManifest.getElementsByTagName("AppMain")[0] + ".js";
    this.getAppMain = this.getManifest.getElementsByTagName("AppMain")[0];
    this.getPermissionGroup = this.getManifest.getElementsByTagName("AppPerm")[0];
    this.getPermission = this.getPermissionGroup.getElementsByTagName("AddPerm");
}
};

But the main.js calls all functions!

As see below, we need to call a function to start a app:

var app = System.openApp("a.b.c");

And one folder with same name must exists!

This is my manifest:

<?xml version="1.0" encoding="utf-8" ?>
<Manifest>
<JSDir>JS</JSDir>
<Version>0.0.1</Version>
<AppName>Documentação de API do EDOS</AppName>
<AppMode>windowed</AppMode>
<AppMain>MainAct</AppMain>
<AppPerm>
    <AddPerm>edos.permission.WRITE_APP</AddPerm>
    <AddPerm>edos.permission.READ_APP</AddPerm>
</AppPerm>
</Manifest>

Sorry if i give too much info... PS: I dont want APIs!!

Answer 1

Export your functions at the bottom of your files. And import your functions at the top of your files.

When you import a function, that function will be available in that files scope and accessible under the name you choose when you import it.

If you export the function as named

export main;

You can import it with an alias.

import { main as mainOne } from "./file1.js"
import { main as mainTwo } from "./file2.js"

// Call functions
mainOne();
mainTwo();

Or if you export it as default (you can only have one default export per file)

export default main

Then you can import it as whatever

import NewName from "./file1.js"

For more information and examples check the documentation for export here and for import here .