JavaScript中eval()函數

運作結果如下:
注意:雖然eval()的功能非常強大,但在實際使用中用到它的情況并不多。
從案例中也能看出,eval()函數會執行字元串中的js代碼,這是不太安全的,試想一下,如果有不懷好意的人送出一些惡意的js代碼到伺服器上,那是會造成安全隐患的。是以,我個人推薦使用JSON.parse()
以下是完整的源碼
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>javaScript中eval()函數和JSON.parse()函數</title>
<style type="text/css">
input[type=button] {
background-color: #8E388E;
border: 0px solid #8E388E;
color: #fff;
width: 160px;
height: 40px;
border-radius: 6px; /*把邊框做成圓角*/
}
</style>
<script type="text/javascript">
//報錯,Uncaught ReferenceError: hello is not defined
// console.log('*4*', eval('hello'));
console.log('*1*', eval('var a = 6; var b = 10; a * b')); //60
console.log('*2*', eval('5 + 3')); //8
console.log('*3*', eval(2 + 8)); //10
var x = 20;
console.log('*4*', eval(x + 30)); //50
var fn1 = function() {return 666;};
console.log(eval(fn1)); //ƒ () {return 666;}
//Uncaught SyntaxError: Function statements require a function name
// console.log(eval(fn1 + "()"));
console.log(eval("(" + fn1 + "()" + ")")); //666
var str = '{"id" : 12, "name" : "令狐沖", "f" : "function hi(){console.log(\'hi tom\');}"}';
// console.log(eval(str)); //報錯
console.log(eval('(' + str + ')')); //{id: 12, name: "令狐沖"}
var obj = eval('(' + str + ')');
console.log(obj.id, obj.name); //12 "令狐沖"
//
var obj2 = JSON.parse(str);
console.log(obj2);
console.log(obj2.id, obj2.name);
//字元串中包含js代碼
var test = '{"name" : "韋小寶", "f" : console.log("江西省贛州市于都縣")}';
var obj3 = eval('(' + test + ')'); //eval()函數會執行字元串中的js代碼
console.log('*A*' ,obj3, obj3.name, typeof obj3.name, obj3.f, typeof obj3.f);
//Uncaught SyntaxError: Unexpected token c in JSON at position 23
// var obj4 = JSON.parse(test);
var test2 = '{"name" : "張無忌", "f" : "console.log(123456);"}';
var obj5 = eval('(' + test2 + ')');
console.log('*B*', obj5, obj5.name, typeof obj5.name, obj5.f, typeof obj5.f);
var obj6 = JSON.parse(test2);
console.log('*C*', obj6, obj6.name, typeof obj6.name, obj6.f, typeof obj6.f);
</script>
</head>
<body style="background-color: #CCE8CF;">
<h1>javaScript中eval()函數和JSON.parse()函數</h1>
<div id="div1" style="background-color: Wheat; height: 100%;"></div>
</body>
</html>
注意:雖然eval()的功能非常強大,但在實際使用中用到它的情況并不多。