日韩无码专区无码一级三级片|91人人爱网站中日韩无码电影|厨房大战丰满熟妇|AV高清无码在线免费观看|另类AV日韩少妇熟女|中文日本大黄一级黄色片|色情在线视频免费|亚洲成人特黄a片|黄片wwwav色图欧美|欧亚乱色一区二区三区

RELATEED CONSULTING
相關(guān)咨詢
選擇下列產(chǎn)品馬上在線溝通
服務(wù)時間:8:30-17:00
你可能遇到了下面的問題
關(guān)閉右側(cè)工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
JSDev:一個優(yōu)化JavaScript開發(fā)過程的小工具

JSDev 是老道(Douglas Crockford)最近搞的一個不太起眼的小玩意,他的大致思路是,對 JavaScript 做預(yù)處理,選擇性地把注釋轉(zhuǎn)為相應(yīng)的代碼。JSDev 處理的注釋塊有以下兩種形式:

成都創(chuàng)新互聯(lián)公司IDC提供業(yè)務(wù):成都移動云計算中心,成都服務(wù)器租用,成都移動云計算中心,重慶服務(wù)器租用等四川省內(nèi)主機托管與主機租用業(yè)務(wù);數(shù)據(jù)中心含:雙線機房,BGP機房,電信機房,移動機房,聯(lián)通機房。

 
 
 
  1. /* */ 
  2. /*(*/ 

然后你可以指定 JSDev 開啟哪些 tag,JSDev 就會把這塊注釋改成相應(yīng)的代碼,而這些注釋在 JavaScript 正常運行的時候是不會起作用的,在用 JSMin 等工具壓縮后也都會全被去掉,這樣就方便了 JavaScript 的開發(fā)。

一開始,老道只給出了 C 語言版本的程序,幾天后他給出了 JavaScript 版本,我覺得這開始變得有意思了,折騰了兩天,想試看能否用到今后的開發(fā)項目中去。下面我們先以 C 程序為例說明 JSDev 的用法,然后說說怎樣通過 JavaScript 版本把它用在 node 開發(fā)或者前端開發(fā)過程中。本文假定你在類 Unix 系統(tǒng)(Linux/FreeBSD/Mac OS)下工作并且對命令行、node 編程都有一定了解。

C 語言版本 和 JSDev 的用法

先從 github 上 clone 我的 fork,把 C 源碼編譯成可執(zhí)行文件。

 
 
 
  1. git clone https://github.com/yuest/jsdev.git #clone github 上的源代碼到本地  
  2. cd jsdev  
  3. gcc jsdev.c #編譯 C 版本  
  4. sudo mv a.out /usr/local/bin/jsdev #把編譯好的可執(zhí)行文件移動到一個 $PATH 底下的目錄 

現(xiàn)在我們就可以用 jsdev 來運行程序了??墒窃诿钚休斎?jsdev 并回車,卻什么都沒有,原來老道只做了這工具最核心的部分,而未在軟件界面下什么功夫,所以連個命令用法提示也沒有。作為預(yù)處理器,它只會從 stdin 吃進 JavaScript 代碼,然后把處理過的代碼從 stdout 拉出來,至于文件操作嘛,用 unix 命令行的管道特性就可以啦。

普及一下,要把文件,比如說 in.js 當 stdin 輸入到 jsdev 程序,使用小于符號 < 就行,如 jsdev 啦:jsdev out.js 就可以。如果要嘗試 jsdev,只需要用 jsdev

只運行 jsdev out.js 這個命令不會對 in.js 有任何改動,我們需要以 tag 為參數(shù)調(diào)用 jsdev 命令來指定需要開啟的 tag,多個空格間用空格分開。以例子來說明,如果 in.js 代碼如下:

 
 
 
  1. /*hello console.log('Hello, World!')*/ 
  2. /*hi console.log('Hi, there.')*/ 

那么 jsdev

 
 
 
  1. {console.log('Hello, World!')}  
  2. /*hi console.log('Hi, there.')*/ 

而 jsdev

 
 
 
  1. {console.log('Hello, World!')}  
  2. {console.log('Hi, there.')} 

這里的花括號是為了避免與程序中其他部分發(fā)生關(guān)聯(lián)而加的,主要問題是 JavaScript 有行尾自動插入分號的設(shè)計,如果不加花括號把上下文隔開,可能會與前后行產(chǎn)生關(guān)聯(lián),比如變成上一行的函數(shù)調(diào)用之類?;ɡㄌ枌嶋H上是把多個語句復(fù)合成一個語句,最常見的地方是用在 if 等僅接受一個語句的關(guān)鍵字后。JavaScript 里面的花括號不會產(chǎn)生一個命名空間。

你可以為 tag 指定一個函數(shù)名,于是此 tag 指定的注釋塊就會被這個函數(shù)名 wrap(有點像 JSONP),如以下 in.js:

 
 
 
  1. /*log some_variable*/ 

用命令 jsdev

 
 
 
  1. {console.log(some_variable);} 

這可以用于調(diào)試代碼時打印當時狀態(tài)下的某些變量值,會比較方便。

另外還可以為注釋塊指定條件,如下的 in.js:

 
 
 
  1. var name = 'Yuest' 
  2. /*hello console.log('Hello, World!')*/ 
  3. /*hello(name === 'Celine') console.log('Hello, Celine!')*/ 

用命令 jsdev

 
 
 
  1. var name = 'Yuest' 
  2. {console.log('Hello, World!')}  
  3. if (name === 'Celine') {console.log('Hello, Celine!')} 

如果運行這段代碼,很顯然只會輸出 Hello, World!。

指定函數(shù)和條件也可以同時使用,如:

 
 
 
  1. var name = 'Yuest' 
  2. /*log 'Hello, World!'*/ 
  3. /*log(name === 'Ling') 'Hello, Ling!'*/ 

用命令 jsdev

 
 
 
  1. var name = 'Yuest' 
  2. {console.log('Hello, World!');}  
  3. if (name === 'Ling') {console.log('Hello, Ling!');} 

和前面幾乎是一樣的,但注釋短了不少。以上就是關(guān)于 JSDev 使用方法的一切了。其實最核心的是 /* */ 這種形式,我們可以完全只用這種形式來達到上面一樣的目的:

 
 
 
  1. var name = 'Yuest' 
  2. /*hello console.log('Hello, World!')*/ 
  3. /*hello if (name === 'Ling') {console.log('Hello, Ling!')}*/ 

上面的代碼用命令 jsdev

 
 
 
  1. var name = 'Yuest' 
  2. {console.log('Hello, World!')}  
  3. {if (name === 'Ling') {console.log('Hello, Ling!')}} 

所以可以看出,為 tag 指定函數(shù)名和條件只是做了一些簡化而已。

哦對了,還忘了 jsdev 命令接受一個 -comment 參數(shù)為輸出的文件頭部添加注釋,如對于上面的 in.js 文件,運行一下命令:

 
 
 
  1. jsdev 

會獲得:

 
 
 
  1. // Author: Yuest  
  2. // This is a temporary file generated by JSDev  
  3. var name = 'Yuest' 
  4. {console.log('Hello, World!')}  
  5. {if (name === 'Ling') {console.log('Hello, Ling!')}} 

嗯,以上就真的是關(guān)于 JSDev 用法的一切了,而關(guān)于要如何用好它,則需要他的使用者有一點想象力。比如,你可以寫一些 bash 腳本什么的。下面說說 JavaScript 版本的 JSDev 以及我想到的用在 node 項目的方法。

JavaScript 版本和 node 中用法

老道給出的 jsdev.js 里面只定義了一個 JSDEV 函數(shù),接受三個參數(shù),***個參數(shù)是要處理的源代碼,第二、三個參數(shù)是兩個數(shù)組,分別指定 tag 和注釋。如果上面***一條命令用 JavaScript 版本來處理,就應(yīng)該是:

 
 
 
  1. JSDEV( input  
  2.      , ['hello']  
  3.      , ['Author: Yuest', 'This is a temporary file generated by JSDev']) 

我的 fork 為 node 加上了 exports.JSDEV = JSDEV,并 publish 到 npm 上了,你只需 npm install jsdev 或者在 package.json 里面加上 jsdev 的依賴,并在源碼里

 
 
 
  1. var JSDEV = require('jsdev').JSDEV 

就可以使用 JavaScript 版本的 JSDEV() 函數(shù)了。

因為 node 可以通過修改 module.constructor.prototype._compile 來修改要載入的文件,非常適合拿來應(yīng)用 JSDev 這種預(yù)處理器。我的想法是,一個文件要開啟哪些 tag 下的注釋塊,應(yīng)該在其自身(也是用注釋)來描述。如果程序載入了 jsdev 并調(diào)用其 replaceRequire 方法(require('jsdev').replaceRequire()),之后再 require 進的文件有 //@jsdev tag1 tag2 這樣的注釋,就會用 jsdev 開啟 tag1、tag2 指定的注釋塊。

指定開啟 tags 的規(guī)則這樣寫:

 
 
 
  1. //@jsdev(test,production) tag1 tag2  
  2. //@jsdev(development) tag3 

以上注釋行表示在環(huán)境變量 NODE_ENV=test 或 NODE_ENV=production 的時候開啟本文件的 tag1 tag2 注釋塊,在 NODE_ENV=development 時開啟 tag3 注釋塊。如果沒有 jsdev 后面的括號,默認是 development,因此可以寫成

 
 
 
  1. //@jsdev(test,production) tag1 tag2  
  2. //@jsdev tag3 

例如有 a.js:

 
 
 
  1. require('jsdev').replaceRequire()  
  2. require('./b') 

b.js:

 
 
 
  1. //@jsdev(test,production) hello  
  2. //@jsdev hi  
  3. /*hello console.log('hello')*/ 
  4. /*hi console.log('hi')*/ 

則運行 node a.js 會輸出 hi,而運行NODE_ENV=test 則會輸出 hello

另外,對于前端開發(fā)也是一樣的,有 replaceStatic() 函數(shù),可以替換 connect/express 的 static middleware。這樣就可以預(yù)處理通過 static middleware 返回到瀏覽器的 js 文件。文件內(nèi) tag 開啟的規(guī)則和前面寫的一樣。需要注意的是要在使用 connect.static(root) 之前調(diào)用 replaceStatic()。

更多的例子可以參考我寫的測試,在遷出的代碼中 ./runtests (當然要確保 npm 依賴已經(jīng)安裝,即在目錄下運行 npm install)就可以運行測試。我在這里提供這個很通用的工具的用法,要怎樣用好它(什么環(huán)境設(shè)定什么 tag 之類),就要靠用戶的想象力了吧。

有不足的地方歡迎指證,可以到 github 里面去提 issue。

原文:http://club.cnodejs.org/topic/4f3b65a1b43c3c846a05518c


標題名稱:JSDev:一個優(yōu)化JavaScript開發(fā)過程的小工具
新聞來源:http://www.5511xx.com/article/cdssppo.html