JS學習筆記 - eval() 是魔鬼

mengera88 發布于2019-08-21 10:33 / 610人閱讀

摘要：要牢記使用這些構造函數來傳遞參數，在大部分情況下，會導致類似的隱患，因此應該也盡量避免使用這些函數。下面一個栗子使用構造函數和是比較類似的，因此該函數的使用也需要十分小心。

本文章記錄本人在學習 JavaScript 中看書理解到的一些東西，加深記憶和并且整理記錄下來，方便之后的復習。

小白使用 eval()

如果在代碼中使用了eval()，請記住一句話：“eval()是一個魔鬼”。該函數可以將任意的字符串當做一個js代碼來執行。當需要討論的代碼是預先編譯好了（不是在動態運行時候決定），是沒有理由使用eval()的。例如，如果你知道點表示法，但是不知道下表表示法的情況（下面一個栗子）。

eval("myValue = myObject." + myKey + ";");

而不是這樣寫（下面一個栗子）。

myValue = MyObject[myKey];

安全隱患

使用eval()是有一些安全隱患的，因為這樣做有可能執行被篡改過的代碼（例如來自網絡的代碼）。這是在處理來自一個Ajax請求的JSON響應時候常見的反模式。在那些情景下，最好是使用瀏覽器內置的方法來解析JSON請求，以確保安全性和有效性。

還有eval()函數還減弱了應用程序的安全性，因為他給被請求的文本賦予了太多的權力，而且就像with語句執行的方式一樣，它降低了語言的性能。

定時器

在編寫js特效的時候，會常用setTimeout、setInterval()方法。要牢記使用這些構造函數來傳遞參數，在大部分情況下，會導致類似eval()的隱患，因此應該也盡量避免使用這些函數。（下面一個栗子）

// bad
setTimeout("myFunc()", 1000);
setInterval("myFunc(1, 2, 3)", 1000);

// good
setTimeout(myFunc, 1000);
setInerval(function(){
    myFunc(1, 2, 3);
}, 1000);

new Function()

使用new Function()構造函數和eval()是比較類似的，因此該函數的使用也需要十分小心。該函數是一個功能強大的函數，但是通常容易被誤用。如果一定要使用eval()的話，可以考慮是new Function()來代替eval()。這樣做的一個潛在的好處就是由于在new Function()中的代碼將在局部變量函數空間中運行，因此代碼中任何采用var定義的變量不會自動成為全局變量（下面一個栗子）。

console.log(typeof un); // undefined
console.log(typeof deux); // undefined
console.log(typeof trois); // undefined

var jsstring = "var un = 1; console.log(un);"
eval(jsstring); // 1

jsstring = "var deux = 2; console.log(deux);"
eval(jsstring); // 2

jsstring = "var deux = 2; console.log(deux);"
(function(){
    eval(jsstring);
}()); // 3

console.log(typeof un); // number
console.log(typeof deux); // undefined
console.log(typeof trois); // undefined

還有就是eval()是會影響到作用域鏈的，而Function更像一個沙盒。無論在那里執行Function，它都僅僅能看到全局作用域。因此對局部變量的影響比較?。ㄏ旅嬉粋€栗子）。

(function(){
    var local = 1;
    eval("local = 3; console.log(local)");
    console.log(local); // 3
}());

(function(){
    var local = 1;
    Function("console.log(typeof local);")(); // undefined
}());

嚴格模式下的 eval()

來自MDN：在嚴格模式下 eval 僅僅為被運行的代碼創建變量, 所以 eval 不會影響到名稱映射到外部變量或者其他局部變量（下面一個栗子）。

var x = 17;
var evalX = eval(""use strict"; var x = 42; x");
assert(x === 17);
assert(evalX === 42);

更多的詳細內容：嚴格模式 MDN

最后，如果文章有什么錯誤和疑問的地方，請指出。與sf各位共勉！

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/85762.html

eval()不是魔鬼，只是被誤解了（翻譯）

摘要：因為道格拉斯的大多數作品并沒有注明日期，所以，我不確定他是否是在年創造了這個術語。但這并不能說明是魔鬼，這只是開發工作流程中的一點問題。中間人攻擊被認為是的永遠存在的危險，會受到蠕蟲的的攻擊。原文來自：https://www.nczonline.net/blog/2013/06/25/eval-isnt-evil-just-misunderstood/ 作者：Nicholas C.Z...

elarity 2019-08-26 11:37 評論0 收藏0
在編寫javascript時要注意的一些細節

摘要：不單單是因為引起的。用與要注意的地方這里要注意的是這二個函數的第一個參數都會把指向還有第一個參數可以為但不要這樣用因為這樣等于自己隱式使用了。自動分號插入 Js不像其他語言強制要求;號結尾不然編譯不過，原因是JS有自動；號的插入。 var text=function(){} text() 這樣你不加;號也能運行其實在內部js是需要;號去幫助解析的 var text=function(...

Eric 2019-08-21 11:20 評論0 收藏0
前端性能優化（JavaScript篇）

摘要：像也是類似的也不建議使用，會降低性能，通過包裹的代碼塊，作用域鏈將會額外增加一層，降低索引效率對象的優化緩存需要被使用的對象獲取數據的性能有如下順序從快到慢變量獲取數組下標獲取對象的整數索引獲取對象屬性獲取對象非整數索引獲取。正巧看到在送書，于是乎找了找自己博客上記錄過的一些東西來及其無恥的蹭書了~~~ 小廣告：更多內容可以看我的博客優化循環如果現在有個一個data[]數組...

KunMinX 2019-08-19 14:42 評論0 收藏0
前端性能優化（JavaScript篇）

摘要：像也是類似的也不建議使用，會降低性能，通過包裹的代碼塊，作用域鏈將會額外增加一層，降低索引效率對象的優化緩存需要被使用的對象獲取數據的性能有如下順序從快到慢變量獲取數組下標獲取對象的整數索引獲取對象屬性獲取對象非整數索引獲取。正巧看到在送書，于是乎找了找自己博客上記錄過的一些東西來及其無恥的蹭書了~~~ 小廣告：更多內容可以看我的博客優化循環如果現在有個一個data[]數組...

kun_jian 2019-08-01 14:38 評論0 收藏0
JSON學習筆記（一）

先學習阮大神的數據類型和Json格式一、js中解析JSON的方式 eval() JSON.parse var jsondata = {staff:[{name:小紅,age:16},{name:小明,age:20},{name:小芳,age:18}]} var jsonobj = eval(( + jsondata + )) alert( jsonobj.staff[0].name); s...

Scott 2019-08-20 15:55 評論0 收藏0