今天有個情境描述如下 :
TABLE 裡面有 3 筆基金 , 當基金標的含有特定標的時 , 需要出現某份報表 ,
如果今天我們單純的 HARD CODE 的話可能如下 :
$(document).ready(function(){
var filterFund = ['HSBC'], //當投資標的有HSBC則要出現報表
isRpt = false, //是否出現報表
$tr = $("#tbl").find("tr");
//找尋 table 所有基金欄位值是否有HSBC
$tr.each(function (index, val) {
var fund = $(this).find("td:eq(1)").text();
if ($.inArray(fund, filterFund) > -1) {
isRpt = true;
return false;
}
});
if(isRpt){
alert("Show Report");
}
});
今天我們改成使用 UnderScore 來簡化上述的 Code :
$(document).ready(function(){
var filterFund = ['HSBC'], //當投資標的有HSBC則要出現報表
isRpt = false, //是否出現報表
$tr = $("#tbl").find("tr");
//取得 table 基金欄位所有的值
var fundgroup = $tr.find( 'td:nth-child(2)' ).map(function () {
return $(this ).text();
}).get();
isRpt = _.intersection(fundgroup, filterFund).length > 0;
if(isRpt){
alert('Show Report');
}
});
在第一個例子中 , 我們必須迴圈整個 table 找尋是否有我們所需要得標的 ,
整個 each 迴圈中讓人乍看之下不知道這段是在做啥 ,
可是在第二個例子中 , intersection 的名稱讓人很清楚的明白這主要是取兩個集合的交集 ,
若今天交集的資料集在 0 筆以上的話則出現報表 , 因此清晰的函數命名以及動作的簡化
把原本複雜的描述清楚的表示了
本文同步發布於 保政島 使用 Underscore intersection 情境