由來
今早面試看到一題是說使用js實現(xiàn).net中的where功能而账，當時腦子里一片空白启摄，只能回來腦補下（本來想將博客放到github及Blogger上凌外，但限于配置麻煩蹦玫，暫且放這里）啊片。真心不知道ES6以下的js支不支持 " => "只锻， 后來在chrome上測試下竟然支持，我沒有打開chrome對ES6的支持钠龙。這是一個簡單實現(xiàn)炬藤，主要使用到了eval，暫時沒有考慮其性能碴里，同時實現(xiàn)了 select 及distinct方法沈矿，歡迎大牛指正。既然語法支持那就可以對傳入的參數(shù)做進一步處理咬腋，首先將參數(shù)轉為字符串然后使用正則提取變量及表達式羹膳，到使用eval執(zhí)行語句時再將表達式中的參數(shù)替換為指定的值。以下代碼還可以重構根竿，可以考慮寫一個方法專門解析表達式陵像、增加表達式正確性校驗等等。
Array.prototype.where = function(){
var args = arguments[0].toString();
var matches = args.match(/(\w)(\s+)?=>(.*)+/);
if(!matches){
console.error('invalid expression.');
return;
}
var name = matches[1];
var expression = matches[3];
if(!this) return [];
var result=[];
this.forEach(function(value, index, array) {
eval('var rpr=/'+ name + '/g');
var newexp = expression.replace(rpr,value);
var res = eval(newexp);
if(res){
result.push(value);
}
});
return result;
};
Array.prototype.select = function(){
var args = arguments[0].toString();
var matches = args.match(/(\w)(\s+)?=>(.*)+/);
if(!matches){
console.error('invalid expression .');
return;
}
var name = matches[1];
var expression = matches[3];
matches = expression.match(/\.(\w+)/);
if(!matches) {
console.error('invalid expression .');
return;
}
var property = matches[1];
var result=[];
this.forEach(function(value, index, array) {
if(value[property]){
result.push(value[property]);
}
});
return result;
};
Array.prototype.distinct = function(){
var args = arguments[0].toString();
var matches = args.match(/(\w)(\s+)?=>(.*)+/);
if(!matches){
console.error('invalid expression .');
return;
}
var name = matches[1];
var expression = matches[3];
matches = expression.match(/\.(\w+)/);
if(!matches) {
console.error('invalid expression .');
return;
}
var property = matches[1];
var result=[];
this.forEach(function(value, index, array) {
if(value[property]){
var add = true;
for (var i = 0; i < result.length; i++) {
if(value[property]==result[i][property]){
add = false;
break;
}
}
if(add) result.push(value);
}
});
return result;
};
var mres = [20,33,40,89,55].where(x=>x%5==0);
var seles = [{age:423},{age:120},{name:'leo',age:80}].select(a=>a.age);
var distic = [{age:423},{age:120},{age:120},
{name:'leo',age:80},{name:'leo',age:80}].distinct(a=>a.age);
console.log(mres);
結果
性能測試
昨天看一個篇不錯的文章里面使用了10萬數(shù)據來測試eval及function寇壳，看到這個那我也來試試醒颖。代碼修改如下：
var arrs = [],models=[];
for (var i = 0; i < 100000; i++) {
arrs.push(i);
models.push({age:i,name:'name'+i});
}
console.time("where");
var mres = arrs.where(x=>x%5==0);
console.timeEnd("where");
console.time("select");
var seles = models.select(a=>a.age);
console.timeEnd("select");
console.time("distinct");
var distic = models.distinct(a=>a.age);
console.timeEnd("distinct");
相比distinct，其他兩個 很快就能看到結果壳炎，過了7-8分鐘還是沒有結果泞歉，后來看了下代碼，自己真是笑死匿辩。
distinct使用了一個最壞的情況來運行腰耙，arrs中沒有重復數(shù)據，時間復雜度是O(n2)铲球，這么看沒有個把鐘出不來. 那就先讓他自己運行吧挺庞，剛好和妹子有約，晚上回來在看稼病。晚上11點半到家选侨，結果如下：
結果和預期差不多，一個半小時溯饵，chrome按F12在debug模式下會慢些侵俗。既然如此那就來調整下，一個是where的實現(xiàn)丰刊，一個distinct的是實現(xiàn)隘谣，select功能少暫時可以不用考慮。
where
先看使用eval的實現(xiàn)：
然后是function的實現(xiàn)：
最后看結果：
從結果看這差距不是一般的大。
distinct
這個然我想起了之前看到的位圖算法寻歧，用一個bit位來記錄某項記錄是否已存在掌栅，我們可以使用的最小數(shù)據類型只能是float及int，可以考慮使用強類型數(shù)組 Uint32Array码泛。這里有個問題是我們事先并不能知道某一個數(shù)的大小猾封，有可能該數(shù)據所在的位置已經超出bit_arr的界限，所以這個需要做判斷噪珊。如果超出則增加bit_arr的長度晌缘。然后我的實現(xiàn)如下：
(function(){
var bit_arr ;
var get = function(index,offset){
var value = bit_arr[index]>>offset;
return value & 0x01;
};
var set = function(index,offset){
bit_arr[index] = bit_arr[index]+(1<<offset);
}
window.distinct = function(arr){
var count = parseInt(arr.length/32) + 1;
bit_arr = new Uint32Array(count);
for (var i = 0; i < count; i++) {
bit_arr[i]=0;
}
var results = [];
arr.forEach(function(value,index,array){
var arr_index = parseInt(value/32);
var offset = value%32;
if(!bit_arr[arr_index]) bit_arr[arr_index] = 0;
var bit = get(arr_index,offset);
if(bit == 0){
set(arr_index,offset);
results.push(value);
}
});
return results;
};
})();
測試代碼如下：
var arrs = [],models=[];
for (var i = 0; i < 20000; i++) {
arrs.push(i);
// models.push({age:i,name:'name'+i});
}
for (var i = 0; i < 20000; i++) {
arrs.push(i);
}
for (var i = 0; i < 40000; i++) {
arrs.push(i*2);
}
for (var i = 0; i < 20000; i++) {
arrs.push(i*3);
}
console.time("distinct");
distinct(arrs);
console.timeEnd("distinct");
測試結果：
結果還明顯，我多次測試其時間都在130ms左右痢站。
<center>總結</center>
其實很多時候只要有一個點子一個想法都可以去嘗試磷箕，做出來后定會有收獲。有關lambda部分還有很多功能可以實現(xiàn)阵难，像前面提到的那位博主有考慮到緩存function岳枷，不過他的lambda表達式是使用字符串包含的，感覺不太雅觀呜叫。CSDN的編輯器太操蛋空繁，竟然沒有自動保存草稿的功能，害我重寫朱庆，哎...真不夠專業(yè)盛泡。還是馬克飛象好些。先這樣了娱颊，后續(xù)有想法再補充饭于。
個人github博客地址參見 https://blog.magicleox.com/
有關eval性能的文章：
http://www.nowamagic.net/librarys/veda/detail/1627
https://www.nczonline.net/blog/2013/06/25/eval-isnt-evil-just-misunderstood/
