CommonJs 和 Nodejs 中自定義模塊 (3)

1、 什麼是 CommonJs？

　　CommonJS 規範的提出,主要是爲了彌補當前 JavaScript 沒有標準的缺陷。 它的終
極目標就是： 提供一個相似 Python， Ruby 和 Java 語言的標準庫 .
　　CommonJS 就是模塊化的標準， nodejs 就是 CommonJS（模塊化） 的實現。

 

二 Nodejs中的模塊化

1 核心模塊[http模塊, url模塊 , Fs模塊]

2 文件模塊[用戶形式]

 

三 自定義模塊

 

 

第一步:

咱們能夠把公共的功能抽離成一個單獨的js文件做爲一個模塊，默認狀況下面這個模塊
裏面的方法或者屬性，外面是無法訪問的。若是要讓外部能夠訪問模塊裏面的方法或者屬性，
就必須在模塊裏面經過exports或者module.exports暴露屬性或者方法。

第二步

在須要使用這些模塊的文件中，經過require的方式引入這個模塊，這個時候就能夠使用
模塊裏面暴露的屬性和方法

 

3.1 自定義包的演變

`config.js`文件代碼

/*
這個config文件就是config配置文件模塊
 */
var str = ' this is config';

exports.str =str;/* 暴露模塊方法一 */
// module.exports=str;

 

`common01.js`文件代碼

/*
與config文件一塊兒使用
 */
let http = require('http');
let config =require('./config.js'); //輸入模塊的路徑


let app =http.createServer(function (req, res) {
    res.writeHead(200,{"Content-Type":"text/html;charset=utf8"});
    res.write('您好！nodejs');
    console.log(config);
    /*
    未暴露數據，顯示結果：{}
    暴露結果，顯示結果：{ str: ' this is config' }
    */
    res.end();
});
app.listen(8002,"127.0.0.1");

結果顯示

 

 

 

暴露對象

`tools.js`文件代碼

//tools對象
var tools ={
    add:function (x, y) {
        return x+y;
    },
    sayHello:function () {
        return '你好，nodejs!'
    }
};

// 暴露模塊
// exports.tools =tools;
module.exports=tools;

 

`commonjs02.js`文件代碼

/*
與tools文件一塊兒使用
 */
/* 總結exports暴露於module暴露的區別*/
var tools = require('./tools'); /* 省略.js也能夠*/
console.log(tools); //{ tools: { add: [Function: add], sayHello: [Function: sayHello] } }
console.log(tools.add(1,2));

 

總結exports暴露於module暴露的區別

1 使用exports, console.log(tools)結果爲:{ tools: { add: [Function: add], sayHello: [Function: sayHello] } }

2 使用module, console.log(tools)結果爲: { add: [Function: add], sayHello: [Function: sayHello] } 

 

node_modules包的做用

 

 

執行結果

 

 

解說:

     若是當前目錄中找不到指定js文件，會自動去node_modules文件中找

 

同理能夠實現 `/bar/bar.js` 的模塊查找

 

 

四 模塊導入,進階方式,package.json的使用

在須要導入模塊中的位置啓動cmd,執行以下命令,生成package.json文件

npm init --yes

 

 

 

使用方式以下

 

 

模塊導入基本流程:

1 項目根目錄沒有找到nav.js文件;

2 查找node_modules文件夾中查找nav.js文件,未找到

3 查找到nav文件夾,並讀取package.json文件,獲取文件入口nav.js;

4 找到nav.js,成功導入模塊.