由於 node.js 是 javascript 作為開發的語言，開發的過程遵照程式碼規範撰寫讓整個程式風格達到一致。不過當然許多的 js 寫法都會有不同的風格存在，若您找不到要照什麼規則編寫程式，那麼可以參考這篇簡易的風格指南作為開發上的基本基礎。

本章節將介紹 node.js 幾個常用的撰寫手法來做介紹：

• 字串引號
• 區塊括號
• 變數宣告
• 變數命名
• 函數命名
• 物件與陣列
• 相等的運算符號
• 條件判斷
• 嵌套閉包

字串引號

使用單引號，若物件是 json 格式，那麼就使用雙引號來定義 key, value

錯誤示範

1

var name =“test01”;

正確寫法

1

var name = ’test01’;

區塊括號

錯誤示範

1
2
3
4

if (true)
{
     console.log(“this is a book.”);
}

正確寫法

1
2
3

if (true) {
    console.log(“this is a book.”);
}

變數宣告

使用一種對每一個變數做一個 var 宣告。

錯誤示範

1
2
3

var ary = ["apple", "orange"],
     price = [150, 125],
     obj = {};

正確寫法

1
2
3

var ary = ["apple", "orange"];
var price = [150, 125];
var obj = {};

變數命名

錯誤示範

1

var str_user = "test01";

正確寫法

1

var strUser = "test01";

函數命名

錯誤示範

1
2

function get_Users() {
}

正確寫法

1
2

function GetUser(){
}

物件與陣列

如果只有很小的資料為陣列的話，請將它寫在同一行，而當您的物件是包含 key, value 的形式時，則排列整齊讓閱讀起來更加容易

錯誤寫法

1
2
3
4
5
6

var ary = [
     "apple", "orange"
];

var person = { "name", "test01"
               , "id": "abcd1234" };

正確寫法

1
2
3
4
5

var ary = [ "apple", "orange" ];
var person = {
     "name", "test01",
     "id": "abcd1234"
};

相等的運算符號

錯誤寫法

1
2
3
4

var index = 0;
if (index == '') {
     console.log("nothing");
}

正確寫法

1
2
3
4

var index = 0
if (index === '') {
     console.log("nothing");
}

條件判斷

儘量不要將過多的判斷都塞在 if 裡面，請先將判斷部分在前面以變數方式先驗證，再將結果的 true, false 的答案擺在 if 裡面

錯誤寫法

1
2
3

if (task.isPrivate() || task.isEnabled()) {
     console.log("the task are private and enabled type");
}

正確寫法

1
2
3
4

var isValid = (task.isPrivate() || task.isEnabled());
if (isValid) {
     console.log("the task are private and enabled type");
}

嵌套閉包

在使用閉包的做法是，不要一直無限嵌套，因為這樣會使得程式過度雜亂

錯誤寫法

1
2
3
4
5

setTimeout(function(){
      obj.click(function(){
           console.log("click...");
      })
}, 3000);

正確寫法

1
2
3
4
5
6
7

setTimeout(function(){
     obj.click(fnObjClick);
},3000);

function fnObjClick() {
     console.log("click...");
}

參考資料：

• https://github.com/felixge/node-style-guide
• http://nodeguide.com/style.html

『A package manager for the web』瀏覽器套件管理工具

一般在寫網頁時，多半會引入套件來使用，而 bower 就是用來管理相依套件工具，bower 是 twitter 研發，透過這樣的管理工具下載安裝 css, js 套件，讓開發者跟隨著這樣的工具，讓 web 套件 (例如： bootstrap, jquery… etc) 方面更好管理，更簡單的方式更新最新版本的套件。

當沒有管理的時候，你也許是…

1. 直接去官方網站抓檔案，還需要記得要下載 dev 版跟 min 壓縮過的版本 (例如：https://code.jquery.com/jquery/)
2. 找 cdn 檔案 (例如：https://developers.google.com/speed/libraries/devguide?hl=zh-tw)
3. 乾脆用現有的 (舊版本繼續沿用)

以上的行為，多半會花一些時間一直找，而這套工具就是解決這樣的問題，只要用指令操作，效率高多囉！

本章節將學習到：

• 安裝 bower
• 使用方法
• 使用 express, bower 建立 bootstrap 套件的前端頁面

安裝 bower

(安裝之前務必要有 node.js, npm, 建議儲存在 global)

1

$npm install bower -g

可以利用 Search Bower packages 頁面搜尋需要的套件：http://bower.io/search/ ，或者用指令搜尋

1

$bower search bootstrap

使用方法：

請先安裝 express 作為網頁框架，然後安裝套件的方式，在這邊安裝一下 bootstrap

1

$bower install bootstrap

指令安裝之後就會看到 bootstrap 出現在 bower_components/bootstrap/. , bower_components/jquery/.

透過 bower init 指令，安裝 bower.json，您可以在 dependencies 的部分輸入套件名稱與版本號

我們在建立好的 express 框架下的 app.js ，把剛才建立好的 bower_components 資料夾，綁進去基本靜態套件的路徑

1

app.use(express.static(path.join(__dirname, 'bower_components/bootstrap/dist/')));

接著用引入檔案的方法，請打開 ./views/layout.jade ，在 head 的子節點的地方新增

1
2

link(rel='stylesheet', href='/css/bootstrap.min.css')
script(src='/js/bootstrap.min.js')

引入成功之後，就可以建立一個 bootstrap 的頁面，下圖是用透過 bower 匯入 bootstrap 套件建立一個簡單前端頁面：

參考資料：

• http://bower.io/
• http://jade-lang.com/tutorial/
• http://getbootstrap.com/

nvm 是一種在管理多個 Node.js 版本的套件，當你預計採用不同版本執行Node.js 的時候，可以採用這個套件，那麼我們可以先進到這個網址裡面找到安裝指令

https://github.com/creationix/nvm

安裝指令請在下方找到：

1

curl https://raw.githubusercontent.com/creationix/nvm/v0.17.2/install.sh | bash

或者用 wget 方式下載

1

wget -qO- https://raw.githubusercontent.com/creationix/nvm/v0.17.2/install.sh | bash

將這個指令貼到命令提示字元

安裝完之後，請先將命令提示字元關閉，再重新開啟以使用 nvm 指令
接著重啟之後，輸入

1

$nvm

確定有 nvm 之後，可以輸入 $nvm ls-remote 指令看有哪些版本可以安裝，在命令提示字元會看到落落長的版本號

安裝

依照 nvm help 指令的說明上，請使用 $nvm install 安裝 node.js 版本，這些版本會實際放在 /usr/local/n/資料夾，例如：

1

$nvm install v0.10.32

再裝一個不同版本的 node，那麼就安裝 v0.11.14 (版本前面的 v 可以不用寫)

1

$nvm install v0.11.14

這時候下一個 $nvm ls 指令，這時候安裝最後的版本，將會當做是當前的版本，可以下 $nvm current ，此時，綠色箭頭就是目前的版本號 v0.11.14

接下來我們可以用簡單的指令切換 Node.js 版本，這時候綠色箭頭就換成 v0.10.32

1

$nvm use 0.10.32

參考資料：

• http://nodejs.org/
• https://github.com/creationix/nvm
• https://github.com/Gizra/KnowledgeBase/wiki/How-to-install-nvm-(Node-Version-Manager)
• https://www.npmjs.org/package/nvm

npm，主要是 node.js 應用程式的建立、共享、重覆使用模組。在上一篇 Node.js 安裝並且建立簡單的 Hello World 程式 是來自於使用 node.js.org 的安裝軟體安裝，那麼其實 npm 就已經裝好哩。

查看 npm 是否有安裝

我們從命令提示字元看一下 npm 是否有安裝成功呢？有出現以下呈現就代表有 npm 了

安裝模組

安裝模組的時候，可以在命令提示字元輸入：

1

npm install [module_name]

試著使用看看

現在我們來使用一款 underscore 的這個模組來介紹如何安裝模組，如何使用模組，首先先來看這個模組可以使用哪些 function，詳情可以查閱官方網站

Underscore is a JavaScript library that provides a whole mess of useful functional
programming helpers without extending any built-in objects. http://underscorejs.org/

裡頭有很多種物件可以使用，像是

• Collections
• Arrays
• Functions
• Objects
• Utility

之後文章再介紹常用的方法或屬性，敬請期待。

參考網址:

• npm 官方網站
• node包管理器 @維基百科

Node.js 是一套使用了 Google V8 虛擬機來解釋 Javascript 語法，允許在後端運行 Javascript 的語法，發生在把頁面發送給 browser 之前的服務器上，所以要實現後台運行的 Javascript 語法，那麼語法要先被編譯後才可以正確執行。

本章節會學習到

• 安裝 Node.js
• 驗證 Node.js 是否正確安裝
• 建立基本 Node.js 程式
• 啟動基本 Node.js 程式
• 安全警示
• 查看 npm 是否有安裝

安裝系統：

首先，簡單的來安裝一下 Node.js ，在這裡示範的系統環境是 Windows XP 32bit，可以到 http://nodejs.org/ 的首頁上下載安裝軟體

• 進入 node.js 官方網站 http://nodejs.org/ 點選 install 後, 會下載一個 node-v0.10.25-x86.msi 安裝檔案

• 點選安裝檔案後, 開始進行安裝

• End-User License Agreement 的頁面, 勾選 “I accept the terms in the License Agreement” 核選方塊後, 點選 Next 進行下一步

• 可指定安裝路徑, 這裡就保持預設就行了, 確認後點選 Next (當然，要改變存放位置也是可以)

• 自訂安裝 Select the way you want features to be installed

• 安裝前的提醒

• 開始進行安裝 Node.js

• 完成安裝

驗證 Node.js 正確安裝

學習新的一套語言，就是要先學會將程式呈現一個簡單的文字顯示，因此不免俗的還是來一個萬年測試，先來看看安裝是否有成功。

• 開啟命令提示字元，輸入 node
• 輸入 12 + 34 ，檢查是否有回應 46 的答案，若有就代表成功囉。

建立 Hello world 的 Node.js 程式

不管利用記事本或是會善用 IDE 做為開發的工具，建立一個 my.js 的檔案，輸入以下的語法

var http = require('http');
http.createServer(function(req, res){
  res.writeHead(200, { 'Content-Type': 'text/html' });
  res.write('<h1> Hello Helen, this is Node.js </h1>');
  res.end('Hello world');
}).listen(3232);

console.log("HTTP Server is listening at port 3232");

開始執行啟動

接著打開命令提示字元，輸入 node my.js
之後就會看到 Http Server is listening at port 3232，這就代表有成功啟動

安全警示

由於 node.js 是利用 google chrome v8 引擎執行, 會出現以下安全性警示，按下解除封鎖按鈕

馬上開起 browser，有出現以下的呈現結果，就是正常運行服務端的 javascript 喔！

如果想停止這個服務的話，在命令提示字元按下 CTRL + C 就將這個 port 停止服務就好了。

Good，這樣就完成簡單的示範，接下來就可以慢慢建立比較複雜的應用程序囉。

最近看了些書籍、電子書、網路爬文，一直都想寫個文章做個記錄，以免忘記，彙整一下所看、所聞、所實作的 Node.js 技術，如果有寫不好的地方也請多多指教囉

這些年，Node.js 的議題越來越熱門了，而且快速的開發中，版本的升級也相當快，Node.js 是一個使用當前速度較快的 Javascript 引擎， 運行在服務端的開發平台。它使用了 Google 的 V8 虛擬機（Google Chrome 瀏覽器使用的 Javascript 執行環境），解析與執行 Javascript 語法，你可以想像是在運行 PHP, Puby, Python 一樣的服務端模式，只是根據 Node.js 的做法它不用像 PHP, Python, Ruby on rails 一樣安裝 Apache, Nginx 的 Http 服務器，因為它本身內建就有 Web server 支援。

Node.js 它可以實現 Javascript 沒有完善的功能，比如說實現 Javascript 沒有的模組觀念、操作系統 API、網路通訊的功能。

到底，Node.js 技術現在趨勢如何？我們可以看以下用 Google Trend 網頁分析 Node.js, ruby on rails, angular.js 的熱門搜尋變化，由這張圖看起來，大概是在 2013 年的時候，出現了交叉變化，Node.js 漸漸得越來越多人去了解它。由此圖看得出來，ruby on rails 有著驚人的表現，到這幾年趨於平緩，但我覺得每個語言都有它表現不凡的技術與能力，其他語言也互相學習技術上優點避掉缺點。本系列將學習 Node.js 的應用，一起來探討探討。

網址在此：

https://www.google.com.tw/trends/explore#q=node.js%2C%20ruby%20on%20rails%2C%20angular.js&cmpt=q

Node.js 它不是

我們都知道學習一套語言會需要知道是什麼樣的一套語言，或是能達到什麼樣的處理，但是更需要反向思考瞭解的是，它不是哪些領域的，或者它不能做到的範圍

• Node.js 不是一種獨立語言
• Node.js 不是一個 Javascript 框架 (eg. Rails, Django, CakePHP)
• Node.js 不是 Client-Side (eg. jQuery, YUI, Extjs)
• Node.js 不是多執行緒

Node.js 能做些什麼

Node.js 不只是能做一個網站，它可以開發一些：

• 檔案上傳工具
• 社群網路的大規模網站
• Websocket 服務器 (例如：聊天室)
• 可以處理複雜邏輯的網站
• 命令行工具
• 交互式終端程式
• JSON 的 API
• Javascript 編輯器
• 單元測試工具

今天就介紹到這裡，待續…

前言

以下我將示範在 Windows 上面安裝 python 語言的環境

下載與安裝 python

1. 進入到 python 官方網站 https://www.python.org/ ，點選上面的 Download 後，選擇 python 2.7.13 版本來下載，至於為甚麼不選擇左邊的 python 3.6.1 呢? 是因為 2.7.x 的版本有比較多 library 使用，之後的文章大致上都會以 2.7.x 的版本來作介紹

2. 點選剛下載的執行檔案，可以選擇 Install for all users 或 Install just for me (not available on Windows Vista)，在這邊我選擇 Install for all users，之後就按一下 Next

3. 選擇安裝路徑，保持預設就可以了，之後就按下 Next

4. 自訂安裝內容，保持預設就可以了，之後就按下 Next

5. 進入安裝程序，保持預設就可以了，之後就按下 Next

6. 安裝完畢就點選，Finish

設定環境變數

安裝完成之後，這時候在命令提示字元還不能執行 python

因此要讓 python 在環境變數上面作個設定，我們打開環境變數，在系統變數區塊選擇 Path，編輯變數值

在數值的後面加入 python 安裝的目錄跟 script 目錄的位置 ;C:\Python27;C:\Python27\Scripts

我們重新打開命令提示字元，輸入 python，這時候就可以發現 python 可以真正的被執行了

也可以在 python 2.7.13 Shell 那邊輸入 print('This is a book.') ，也正常回應 This is a book. 也代表成功喔!

試做：使用 N(172, 5)模擬 100人身高、使用 N(58, 5)模擬 100 人，繪製 X-Y 散佈圖

XY 散佈圖是指：

XY 圖的基本形式是以一個資料數列為基礎，而這個資料數列包含名稱、X 軸值清單以及 Y 軸值清單。每個值配對 (x|y) 在座標系統中都會顯示為一點。

學習目標

透過 R 軟體畫出 XY 散佈圖。

語法

1
2

> weight <- rnorm(100, 58, 5)
> height <- rnorm(100, 172, 5)

Meteor 是架構在 Node.js 上的平台，用來開發 real-time 的網頁程式。Client/Server 都是 Javascript 開發，Meteor 程式都能夠在前後端共用。而且這套框架非常容易學習，短時間內就能夠開發出應用程式出來的唷

學習目標

逐一步驟介紹建置 Meteor 初始化應用程式專案。

安裝 Meteor

安裝 Meteor 的方式在 terminal 輸入以下命令：

curl https://install.meteor.com | sh

安裝完之後你可以再次輸入 meteor 後，執行會說明目前不是在 meteor 專案下，所以目前還只能確認 Meteor 安裝成功並且還會指引你建立 Meteor 專案的指令

1
2
3
4
5
6
7
8
9

$ meteor
  run: You\'re not in a Meteor project directory.

  To create a new Meteor project:
    meteor create <project name>
  For example:
    meteor create myapp

  For more help, see 'meteor --help'.

建立新的專案

裝好 meteor 後，我們建立一個新的專案，建立時使用 meteor 的工具

meteor create meteor_demo

按照命令就會把 meteor 建立基礎的檔案結構，建立完成後就會有一個 meteor_demo 的資料夾，並且說明如何執行應用程式

1
2
3
4
5
6
7
8
9
10
11
12
13

$ meteor create meteor_demo
  Created a new Meteor app in 'meteor_demo'.

  To run your new app:
    cd meteor_demo
    meteor npm install
    meteor

  If you are new to Meteor, try some of the learning resources here:
    https://www.meteor.com/learn

  meteor create --bare to create an empty app.
  meteor create --full to create a scaffolded app.

也包含以下的檔案與資料夾

1
2
3
4
5
6

drwxr-xr-x   7 User  staff   238 Feb 12 08:40 .
drwxr-xr-x  49 User  staff  1666 Feb 12 08:40 ..
drwxr-xr-x  10 User  staff   340 Feb 12 08:40 .meteor
drwxr-xr-x   5 User  staff   170 Feb 12 08:40 client
-rw-r--r--   1 User  staff   183 Feb 12 08:40 package.json
drwxr-xr-x   3 User  staff   102 Feb 12 08:40 server

接著，我們就依照他的指引安裝一些套件

1
2
3

$ cd meteor_demo
$ meteor npm install
$ meteor

在輸入第三行的 meteor 時，是否有發現先前我們在一開始介紹時已經有輸入過了，而這次的執行 meteor 確實是有專案，現在就馬上打開瀏覽器，檢視 http://localhost:3000/ 或是 ( http://0.0.0.0:3000/ )

1
2
3
4
5
6
7
8

$ meteor
[[[[[ ~/Projects/demo/meteor_demo ]]]]]

=> Started proxy.
=> Started MongoDB.
=> Started your app.

=> App running at: http://localhost:3000/

執行成功畫面

這樣子順利運行，若想停止運行應用程式的話只要在執行的 terminal 按下 ctrl+c 就可以了喔！

參考資料

Meteor: Build Apps with JavaScript

當要啟動服務的時候，但是電腦上有執行其他服務而被佔住 port ，你可以這麼做，先查詢之後將找到的 port 移除

使用 netstate 查詢某一 port

1

$netstat -anp tcp | grep 8080

如果 netstat 查不到或不支援，那麼就用以下指令查詢

1

$lsof -i tcp: 8080

最後，查到的結果就用以下方式移除即可

1

$kill -9 <PID>