javascript enval()函数与JSON 之间关系

快来打我* 2023-10-16 22:12 2阅读 0赞

概念定义：

eval() 函数可计算某个字符串，并执行其中的的 JavaScript 代码。enval()函数将把最后一个表达式或者语句所包含的值或引用作为返回值。

举例说明一：eval()------javascrit表达式

<!doctype html>
    <html lang="en">
     <head>
      <meta charset="UTF-8">
      <meta name="Generator" content="EditPlus®">
      <meta name="Author" content="">
      <meta name="Keywords" content="">
      <meta name="Description" content="">
      <title>Document</title>
     <script type="text/javascript"> 
    	var bar = 'bar';
    	var foobar = eval('"foo" + bar');
    	alert(foobar);
    </script> 
     </head>
     <body>
      
     </body>
    </html>

效果展示：

![Center][]  
疑问：var foobar = eval('"foo" + bar');如何理解？假设修改这句表达式会产生怎么样的一个结果？

我们开始回答第二个问题：如果我们把疑问中的那句代码修改为var foobar = eval("foo" + bar);

效果展示：

![Center 1][]

返回的结果是我们最不愿意看到的，underfined.这是为什么了？这个我们的从eval（）函数传递的参数可以找到答案。如下截图：

![Center 2][]

那朋友们，又有疑问了，为什么第一种写法又可以？这个需要各位朋友去百度和google，''与字符串的关系。这算留给大家的一个思考。

举例说明二：eval()------javascrit语句

源代码：

<!doctype html>
    <html lang="en">
     <head>
      <meta charset="UTF-8">
      <meta name="Generator" content="EditPlus®">
      <meta name="Author" content="">
      <meta name="Keywords" content="">
      <meta name="Description" content="">
      <title>Document</title>
     <script type="text/javascript"> 
    	var bar = 'bar';
    	var foobar = eval('if(bar == "bar") {bar="foo-bar";} else {bar = "bar-foo";}');
    	alert(foobar);
    </script> 
     </head>
     <body>
      
     </body>
    </html>

效果展示：

![Center 3][]

eval和JSON

由于Ajax的兴起，JSON这种轻量级的数据格式作为客户端与服务器之间的传输格式逐渐地流行起来，进而出现的问题是如何将服务器端构建好的JSON数据转化为可用的JavaScript对象。利用eval函数无疑是一种简单而直接的方法。

结论

理解eval的工作原理,合理结合eval和json应用于JavaScript的数据传递和对象转换

[Center]: https://img-blog.csdn.net/20150825232937582?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
[Center 1]: https://img-blog.csdn.net/20150825233529089?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
[Center 2]: https://img-blog.csdn.net/20150825233928327?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
[Center 3]: https://img-blog.csdn.net/20150825234435603?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center