DBILITY

javascript es6 import/export for variable,function,class 본문

front-end & ui/javascript

javascript es6 import/export for variable,function,class

DBILITY 2021. 12. 22. 10:06
반응형

es6부터 변수,함수,클래스를 모듈화했을때 import/export라는 문법을 쓸 수 있나?

대략 다음과 같다.

//lib.js
var x = 10;
var y = 20;
var z = 30;

export function fn() {
    console.log('export function');
}

export class Class {
    constructor(name) {
        this.name = name;
        this.age = '김수한무 거북이와 두루비 삼천갑자 동박삭 치치카포 사리사리센타 워리워리 세브리깡 무두셀라 구름이 허리케인에 담벼락 담벼락에 서생원 서생원에 고양이 고양이엔 바둑이 바둑이는 돌돌이';
    }

    sayWelcome() {
        console.log(`어서와~ ${this.name}님`);
    }

    get getAge(){
        return this.age;
    }
}

export {y, z};
export default x;



//import할 곳에선 type을 module로
<script type="module">
    import x, {y as b1, z} from "/lib.js";

    console.log(x, b1, z);
</script>

<script type="module">
    import x, * as v from "/library.js";

    console.log(x, v.y, v.z);
    v.fn();
    var c = new v.Class('삼식이');
    c.sayWelcome();
    console.log(c.getAge);
</script>

결과

 

반응형
Comments