Practice Code
JavaScript Example (Program)
Learn Details

Rename export data (import with as, * as keyword)


इस chapter में हमलोग इन point को cover karenge


1. import with as keyword :

इसमें import किये गए डाटा like (variable , object ) name को rename करने के लिए use किया जाता है।

Syntax :

import{export_var_name as new_var_name} from “Source url export value”


HTML (index.html)



<html>
    <head>
        <title>Module, Import and Export</title>
        <script type="module" src="mymodule.js"></script>
    </head>
    <body>
        

    </body>
</html>
 


JavaScript File 1: mymodule.js (for import or reviced data)


<script>     
import{name as nm, myfunc1 as fn}from "./script.js";
console.log(nm);
fn()

</script>
 



JavaScript File 2 : script.js (for Export or send Data)


<script>     
export{name, myfunc1}
let name = "Teach Coders";
function myfunc1(){
    console.log("this is a funtion");
}
</script>

2. import with *as keyword :

इसका use import किये गए multiple data like (variable , object ) name को single variable name के साथ store करता है।

Note : single variable name के साथ multiple data store होने के बजह से वह (single variable name ) object बन जाता है। और सभी data object के porperty के रूप में store होता है

Syntax :

import{export_var_name *as new_var_name} from “Source of path export value”

For Access

ew_var_name.property_name

HTML (index.html)



<html>
    <head>
        <title>Module, Import and Export</title>
        <script type="module" src="mymodule.js"></script>
    </head>
    <body>
        

    </body>
</html>
 


JavaScript File 1: mymodule.js (for import or reviced data)


<script>     
import * as tutorial from "./script.js";
console.log(tutorial.name);
tutorial.myfunc1()

</script>
 



JavaScript File 2 : script.js (for Export or send Data)


<script>     
export{name, myfunc1}
let name = "Teach Coders";
function myfunc1(){
    console.log("this is a funtion");
}
</script>

3. export a JavaScript file to another file :

इसमें किसी JavaScript file के data को दूसरे file में export किया जाता है और दूसरा file भी इसे direct import नहीं करके import करने वाले तीसरे file को export करता है और वहॉ पर file के data को import करके use किया जाता है

Syntax :

export{your_variable_name} from "file url";

HTML (index.html)



<html>
    <head>
        <title>Module, Import and Export</title>
        <script type="module" src="mymodule.js"></script>
    </head>
    <body>
        

    </body>
</html>

JavaScript File 1: mymodule.js (for import or reviced data)



<script>     
import * as tutorial from "./script.js";
console.log(tutorial.name);
tutorial.myfunc1()

</script>

JavaScript File 2 : script.js
(recived data from script.js and after send data to mymodule.js )



<script>     
export{name, myfunc1} from "./script2.js";
</script>

JavaScript File 3 : script2.js
(send Data to script.js)



<script>     
export{name, myfunc1}
let name = "Teach Coders";
function myfunc1(){
    console.log("this is a funtion");
}
</script>

4. Set default function


HTML (index.html)



<html>
    <head>
        <title>Module, Import and Export</title>
        <script type="module" src="mymodule.js"></script>
    </head>
    <body>
        

    </body>
</html>
 


JavaScript File 1: mymodule.js (for import or reviced data)


<script>     
import {default as ram} from "./script.js";
ram()
</script>
 



JavaScript File 2 : script.js (for Export or send Data)


<script>     
export default function(){
    console.log("This is Default function")
}
</script>