Node-v download and application, ES6 module import and export

Module export ：export { }

The way of named guidance
Be sure to export in curly brackets

let obj = {
    name: " Zhang San "
}
//  Named Export 
//  Be sure to export in curly brackets 
export { obj }

Module import ： import {  } from " "

 <script type="module">
        //  Named import 
        //  Be sure to export in curly brackets 
        import { obj } from "./1.js"
        console.log(obj);
    </script>

  If two Js The file has the same name , You can choose to use when importing as Change the variable name , Use the new variable name when calling

 import { obj, fn as fn2, str1 } from "./1.js"

let obj = {
    name: " Zhang San "
}
function fn(a, b) {
    let s = a + b;
    alert(s)
}
let str1 = " I am a word "
export { obj, fn, str1 }

 //  If two Js The file has the same name , You can choose to use when importing as Change the variable name 
        import { obj, fn as fn2, str1 } from "./1.js"
        console.log(obj);   // {name: ' Zhang San '}
        console.log(str1);  //  I am a word 
        function fn() {
            alert(1)
        }
        fn2(1, 2)    // 3

  When many variables are exported , have access to *as To receive

import *as all from "./1.js"

//  When many variables are exported , have access to *as To receive 
        import *as all from "./1.js"
        console.log(all);       
       //Module {Symbol(Symbol.toStringTag): 'Module'}
         fn: （…）
         obj: （…）
         str1: （…）
        console.log(all.obj);  // {name: ' Zhang San '}
        all.fn(" Sun Li ", " Not Sun Li ")

 // * It can also be exported separately , The name when exporting should be consistent with that when importing 
        // import { str1 } from "./1.js"
        // console.log(str1);  // I am a word 

It is also used when exporting as Change the variable name

Separate export ：

 Separate export 
export let obj = {
    name: " Zhang San "
}
export function fn(a, b) {
    let s = a + b;
    alert(s)
}
export let str1 = " I am a word "

//  Separate import 
        import { str1, fn, obj } from "./1.js"
        console.log(str1); // {name: " Zhang San "}
        console.log(obj); //  I am a word 
        fn(" Sun Li ", " Not Sun Li ") // Sun Li   Not Sun Li 

  Anonymous export ： Export an object anonymously

export default { }

//  Export an object anonymously 
export default {
    obj: {
        name: " Zhang San "
    },
    str: " I am a word ",
    strFn: function (a, b) {
        alert(a + b)
    }
}

  Anonymous export You don't need curly braces , The name can be named arbitrarily

<script type="module">
        //  Anonymous export   You don't need curly braces , The name can be named arbitrarily 
        import abc from "./2.js"
        console.log(abc.obj);  // {name: ' Zhang San '}
        console.log(abc.str);   //  I am a word 
        abc.strFn(" Hello ", " China ") // Hello China 
    </script>

Write separately

//  Write separately  js part 
let obj = {
    name: " Zhang San "
}
let str = " I am a word ";
let strFn = function (a, b) {
    alert(a + b)
}
export default {
    obj: obj,
    str: str,
    strFn: strFn
}

// html part 
<script type="module">
        //  Anonymous export   You don't need curly braces , The name can be named arbitrarily 
        import abc from "./2.js"
        console.log(abc.obj);  // {name: ' Zhang San '}
        console.log(abc.str);   //  I am a word 
        abc.strFn(" Hello ", " China ") // Hello China 



    </script>

//  Write separately  js part 
let obj = {
    name: " Zhang San "
}
let str = " I am a word ";
let strFn = function (a, b) {
    alert(a + b)
}
//  stay es6 in  key  and value  It's the same situation , You can omit to write value
export default {
    obj,
    str,
    strFn
}

// html part 
<script type="module">
        //  Anonymous export   You don't need curly braces , The name can be named arbitrarily 
        import abc from "./2.js"
        console.log(abc.obj);  // {name: ' Zhang San '}
        console.log(abc.str);   //  I am a word 
        abc.strFn(" Hello ", " China ") // Hello China 



    </script>

node-v

Initialize a npm project ：

npm init

Quickly initialize a npm project ：

All content is default , The order is as follows ：

npm init -y

  Download the latest jquery Packet dependency , You can also use bootstrap,vue

npm install jquery

  Use jquery