IT/JavaScript

모듈

iamhyeon 2024. 9. 7. 19:39

● ES5

 

ex 1)

MyModule1.js ▼

function helloWorld() {
	console.log("Hello World");
}

module.exports = helloWolrd;

JS ▽  

const my = require( './MyModule1' );
my();

출력결과 ▽

Hello World

 

≫ ≫ ≫

module.exports = ~~~;

require();

( 파일 확장자 생략 가능 )

( 동일경로여도 './' 생략불가 )

 

 

ex 2)

MyModule2.js ▼

module.exports.name = '노드';
module.exports.property = { id: 'node.js', type: 'javascript' };
module.exports.say = function () {
    console.log('Hello World');
};

//  exports 속성으로 객체 추가
module.exports.home = {
    postcode: '1234',
    address: '서울시 강남구',
    getAddress: function () {
        console.log(this.postcode + ' ' + this.address);
    }
};

JS  

const my = require( './MyModule2' );

console.log(my.name);
console.log(my.property.id);
console.log(my.property.type);
my.say();

console.log(my.home.postcode);
console.log(my.home.address);
my.home.getAddress();

출력결과 ▽

노드
node.js
javascript
Hello World
1234
서울시 강남구
1234 서울시 강남구

 

≫ ≫ ≫

exports의 하위 속성으로 변수, JSON, 함수, 객체 추가

module.exports.~~~ = ~~~;

require();

( 파일 확장자 생략 가능 )

( 동일경로여도 './' 생략불가 )

 

 

ex 3)

MyModule3.js ▼

/*  Class 모듈화 하기 */

class MyClass {
    #age;
    #name;

    constructor() {
        console.log( '-- MyClass의 객체가 생성되었습니다 --' );
        this.#age = 20;
        this.#name = '노드';
    }

    say() {
        console.log( `이름: ${this.#name}` );
        console.log( `나이: ${this.#age}` );
    }
}

module.exports = MyClass;

//  클래스 자체를 모듈에 추가

 

MyModule4.js ▼

/* 객체를 모듈화 하기   - 가장 일반적인 방법! */

class HelloWorld {
    
    constructor() {
        console.log('-- HelloWorld의 객체가 생성되었습니다 --');
    }

    say() {
        console.log('Hello World');
    }
}

module.exports = new HelloWorld();
//  클래스에 대한 객체를 모듈에 추가

JS  

//  1) 클래스 형태의 모듈 참조
const my3 = require('./MyModule3');

const module_obj = new my3();
module_obj.say();


//  2) 객체 형태의 모듈 참조
const my4 = require('./MyModule4');
my4.say();

 

출력결과 ▽

-- MyClass의 객체가 생성되었습니다 --
이름: 노드
나이: 20
-- HelloWorld의 객체가 생성되었습니다 --
Hello World

 

 

'IT > JavaScript' 카테고리의 다른 글

문자열에 천 단위 구분 기호(,)를 추가하는 방법  (1) 2024.09.11
confirm 메서드  (0) 2024.09.08
AJAX  (1) 2024.09.05
BOM DOM  (0) 2024.09.03
JavaScript + HTML,CSS  (0) 2024.09.01