首頁 > 開發者 > JavaScript
JavaScript DSL 流暢介面(使用鏈式調用)執行個體，dsl鏈式
認真研究了一會DSL，發現了這麼幾件有趣的事，JavaScript用得最多的一個東西怕是鏈式調用 (方法鏈，即Method Chaining)。 有意思的是Martin Flower指出:
複製代碼 代碼如下:
I've also noticed a common misconception - many people seem to equate fluent interfaces with Method Chaining. Certainly chaining is a common technique to use with fluent interfaces, but true fluency is much more than that.
很多人將鏈式調用等同於流暢介面。然而鏈式調用是流暢介面的一種常用方法，真實的流暢介面不止這麼一點點。
DSL 流暢介面
流暢介面的初衷是構建可讀的API，畢竟代碼是寫給人看的。
類似的，簡單的看一下早先我們是通過方法級聯來操作DOM
複製代碼 代碼如下:
var btn = document.createElement("BUTTON"); // Create a <button> element
var t = document.createTextNode("CLICK ME"); // Create a text node
btn.appendChild(t); // Append the text to <button>
document.body.appendChild(btn); // Append <button> to <body>
而用jQuery寫的話，便是這樣子
複製代碼 代碼如下:
$('<span>').append("CLICK ME");
等等
於是回我們便可以建立一個簡單的樣本來展示這個最簡單的DSL
複製代碼 代碼如下:
Func = (function() {
this.add = function(){
console.log('1');
return this;
};
this.result = function(){
console.log('2');
return this;
};
return this;
});
var func = new Func();
func.add().result();
然而這看上去像是運算式產生器。
DSL 運算式產生器
運算式產生器對象提供一組連貫介面，之後將連貫介面調用轉換為對底層命令-查詢API的調用。
這樣的API，我們可以在一些關於資料庫的API中看到:
複製代碼 代碼如下:
var query =
SQL('select name, desc from widgets')
.WHERE('price < ', $(params.max_price), AND,
'clearance = ', $(params.clearance))
.ORDERBY('name asc');
鏈式調用有一個問題就是收尾，同上的代碼裡面我們沒有收尾，這讓人很迷惑。。加上一個query和end似乎是一個不錯的結果。
其他
方法級聯
表示如下:
複製代碼 代碼如下:
a.b();
a.c();
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
