關(guān)于eval 與new Function 到底該選哪個(gè)?
廢話不多說(shuō),直接上測(cè)試代碼
var aa = "{name:'cola',item:[{age:11},{age:22},{age:23},{age:23}]}";
var now = new Date().getTime();
for (var i = 0; i < 100000; i++) {
var a = eval("(" + aa + ")");
}
var now1 = new Date().getTime();
document.write("eval 時(shí)間為:" + (now1 - now) + "<br/>");
var now2 = new Date().getTime();
for (var i = 0; i < 100000; i++) {
var fn = new Function("return" + aa);
fn();
}
var now3 = new Date().getTime();
document.write("new Function時(shí)間為:" + (now3 - now2) + "<br/>");
//經(jīng)過(guò)測(cè)試結(jié)果 FF效果如下
//eval 時(shí)間為:979
//new Function時(shí)間為:1372
//經(jīng)過(guò)測(cè)試結(jié)果 IE8效果如下
//eval 時(shí)間為:913
//new Function時(shí)間為:1037
//經(jīng)過(guò)測(cè)試結(jié)果 Chrome效果如下
//eval 時(shí)間為:211
//new Function時(shí)間為:251
//經(jīng)過(guò)測(cè)試結(jié)果 Opera
//eval 時(shí)間為:384
//new Function時(shí)間為:1024
測(cè)試結(jié)果為不同瀏覽器測(cè)試的參考數(shù)據(jù),覺(jué)得奇怪的是為什么每個(gè)瀏覽器測(cè)試的時(shí)候都是eval要快點(diǎn),我們是不是要采用他呢?
親,先不要急, 接下往下看,帶著這些疑問(wèn),好奇心的我終于展開(kāi)了另外一個(gè)測(cè)試,這時(shí)候我做一個(gè)動(dòng)態(tài)涵數(shù)來(lái)分別讓eval 和 new Function 來(lái)執(zhí)行再看看效果
var testEval = function (obj) {
<SPAN style="COLOR: #ff0000"> return eval('0, ' + obj + '');</SPAN>
//return eval('( ' + obj + ')');
};
var testFun = function (obj) {
var fn = new Function("return " + obj);
fn();
};
var now = new Date().getTime();
for (var i = 0; i < 1000; i++) {
var fn = testEval("function test(){ document.write('我有一頭小毛驢,從來(lái)也不騎.........'); }");
fn();
}
var now1 = new Date().getTime();
document.write("<br/>");
document.write("eval 時(shí)間為:" + (now1 - now) + "<br/>");
var now2 = new Date().getTime();
for (var i = 0; i < 1000; i++) {
testFun("document.write('我有一頭小毛驢,從來(lái)也不騎.........');");
}
var now3 = new Date().getTime();
document.write("new Function時(shí)間為:" + (now3 - now2) + "<br/>");
//經(jīng)過(guò)測(cè)試結(jié)果 FF效果如下
//eval 時(shí)間為:495
//new Function時(shí)間為:50
//經(jīng)過(guò)測(cè)試結(jié)果 IE8效果如下
//eval 時(shí)間為:34
//new Function時(shí)間為:20
//經(jīng)過(guò)測(cè)試結(jié)果 Chrome效果如下
//eval 時(shí)間為:7
//new Function時(shí)間為:4
//經(jīng)過(guò)測(cè)試結(jié)果 Opera
//eval 時(shí)間為:7
//new Function時(shí)間為:18
如上結(jié)果測(cè)試 如果構(gòu)建一個(gè)動(dòng)態(tài)執(zhí)行讓eval去執(zhí)行 在FF上是超級(jí)的慢, 其它瀏覽器差別不大, 我們這里不必過(guò)于太多追究
return eval('0, ' + obj + ''); 可能大家覺(jué)得這里這個(gè) 0 是什么意思,加0主要是兼容所有的瀏覽器,不加的話,IE9以下版本就會(huì)報(bào)錯(cuò)
但是真正的0的意思 怎么去剖析 我還真不知道,只是知道加 了這個(gè)就可以解決惡心的IE不能兼容的問(wèn)題
經(jīng)過(guò)上面二個(gè)栗子說(shuō)明 如果是為了JSON串的轉(zhuǎn)換eval 明顯要快, 如果是動(dòng)態(tài)涵數(shù)解析 那么 new Function要快, 這里說(shuō)出了二個(gè)優(yōu)劣勢(shì), 還有的就是eval兼容性不很好,如果解析出錯(cuò),可能會(huì)導(dǎo)致其它的JS腳本不會(huì)執(zhí)行,
而 后者則不會(huì),他只會(huì)針對(duì)于 這個(gè)Function 我這人不喜歡太麻煩的事情, 果斷放棄eval 用 new Function 來(lái)代替。 如果有理解的不太對(duì)的地方,請(qǐng)大家指正,歡迎拍磚。
相關(guān)文章
JS多線程API?webworker應(yīng)用場(chǎng)景有哪些
這篇文章主要介紹了JS多線程API?webworker應(yīng)用場(chǎng)景有哪些,加密數(shù)據(jù),預(yù)取數(shù)據(jù),預(yù)渲染,復(fù)雜數(shù)據(jù)處理場(chǎng)景,預(yù)加載圖片需要的朋友可以參考下2023-02-02
Javascript入門(mén)學(xué)習(xí)第五篇 js函數(shù)
上篇文章講了js中對(duì)象和數(shù)組的一些方法。 這章我們先說(shuō)說(shuō)函數(shù),然后來(lái)點(diǎn)實(shí)戰(zhàn)。2008-07-07
注釋的藝術(shù)——JS里直接寫(xiě)HTML,無(wú)需轉(zhuǎn)義
注釋的藝術(shù)——JS里直接寫(xiě)HTML,無(wú)需轉(zhuǎn)義...2006-12-12
THREE.JS入門(mén)教程(5)你應(yīng)當(dāng)知道的十件事
Three.js是一個(gè)偉大的開(kāi)源WebGL庫(kù),WebGL允許JavaScript操作GPU,在瀏覽器端實(shí)現(xiàn)真正意義的3D,本文會(huì)讓你了解一下使用THREE.JS處理3D/避免SetInterval/使用倒序循環(huán)等等,感興趣的朋友可以了解下哦2013-01-01
現(xiàn)如今最流行的JavaScript代碼規(guī)范
流行的雖然不一定是好的,但是從交流的角度來(lái)說(shuō),按照流行的風(fēng)格編寫(xiě)代碼,可以讓你的代碼在大多數(shù)人看起來(lái)更習(xí)慣2014-03-03
JavaScript高級(jí)程序設(shè)計(jì)(第3版)學(xué)習(xí)筆記8 js函數(shù)(中)
接著看函數(shù)——這個(gè)具有魔幻色彩的對(duì)象。在上篇文章中說(shuō)函數(shù)內(nèi)部屬性時(shí),還遺留了一個(gè)this內(nèi)部屬性沒(méi)有解釋?zhuān)贿^(guò)在說(shuō)this之前,我想先說(shuō)一說(shuō)執(zhí)行環(huán)境和作用域的概念2012-10-10
js裝飾設(shè)計(jì)模式學(xué)習(xí)心得
本片文章給大家分享一下作者學(xué)習(xí)Javascript裝飾設(shè)計(jì)模式后的心得以及要點(diǎn)分享,有興趣的朋友參考下。2018-02-02

