javascript eval和JSON之间的联系


Posted in Javascript onDecember 31, 2009

如果您想详细了解eval和JSON请参考以下链接:

eval  :https://developer.mozilla.org/En/Core_JavaScript_1.5_Reference/Global_Functions/Eval

JSON:http://www.json.org/

eval函数的工作原理

eval函数会评估一个给定的含有JavaScript代码的字符串,并且试图去执行包含在字符串里的表达式或者一系列的合法的JavaScript语句。eval函数将把最后一个表达式或者语句所包含的值或引用作为返回值。

举例说明

  • eval评估JavaScript表达式
var bar = 'bar';
var foobar = eval('"foo" + bar');
alert(foobar);
  • eval评估JavaScript语句
var bar = 'bar';
// if variable bar equals 'bar', foobar is the result of 
// last executing statement: bar="foo-bar";
var foobar = eval('if(bar == "bar") {bar="foo-bar";} else {bar = "bar-foo";}');
alert(foobar);// change the valuebar = 'foo';
// now our the last executed statement is: bar = "bar-foo";
// therefore the value of variable foobar has been changed
// into 'bar-foo'
foobar = eval('if(bar == "bar") {bar="foo-bar";} else {bar = "bar-foo";}');
alert(foobar);

JSON的格式

JSON的格式是由大括号和由冒号(:)构成的名值对所组成的。注意JSON格式与对象字面量 (object literals) 的区别:JSON的名字部分严格用引号+名字来表示。

举例说明

  • 对象的字面量
var objectLiteral = {
name: "Objector.L",
  age: "24",
  special: "JavaScript",
  sayName: function() {
return this.name;
}
};
  • JSON对象
var jsonFormat = {
  "summary": "Blogs",
  "blogrolls": [
{
       "title": "Explore JavaScript",
 "link": "http://example.com/"
    },
    { 
 "title": "Explore JavaScript",
 "link": "http://example.com/"
    }
]
};

eval和JSON

由于Ajax的兴起,JSON这种轻量级的数据格式作为客户端与服务器之间的传输格式逐渐地流行起来,进而出现的问题是如何将服务器端构建好的JSON数据转化为可用的JavaScript对象。利用eval函数无疑是一种简单而直接的方法。在转化的时候需要将JSON字符串的外面包装一层圆括号:

var jsonObject = eval("(" + jsonFormat + ")");

为什么要加括号?

加上圆括号的目的是迫使eval函数在评估JavaScript代码的时候强制将括号内的表达式(expression)转化为对象,而不是作为语句(statement)来执行。举一个例子,例如对象字面量{},如若不加外层的括号,那么eval会将大括号识别为JavaScript代码块的开始和结束标记,那么{}将会被认为是执行了一句空语句。所以下面两个执行结果是不同的:

alert(eval("{}"); // return undefined
alert(eval("({})");// return object[Object]

JSON格式的名字部分为什么要加引号?

因为eval函数会将{foo:”bar”}解释成合法的JavaScript语句,而非表达式。但是人们往往想要的是让eval将这段代码解释成一个对象。所以JSON格式会强制你去在名字的外侧加上引号再结合圆括号,这样eval就不会错误的将JSON解释成代码块。

举例说明

  • eval错误解析语义
alert(eval('{foo:"bar"}'));   // return "bar", incorrect
  • eval正确解析JSON
alert(eval('({"foo": "bar"})')); // return JSON object, correct

结论

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

following this format:

eval('{' + jsonString + ')');
Javascript 相关文章推荐
javascript Onunload与Onbeforeunload使用小结
Dec 31 Javascript
JavaScript Event学习第四章 传统的事件注册模型
Feb 07 Javascript
Wordpress ThickBox 添加“查看原图”效果代码
Dec 11 Javascript
分享8款优秀的 jQuery 加载动画和进度条插件
Oct 24 Javascript
JQuery右键菜单插件ContextMenu使用指南
Dec 19 Javascript
jquery实现鼠标滑过显示提示框的方法
Feb 05 Javascript
jquery中ajax使用error调试错误的方法
Feb 08 Javascript
JS重载实现方法分析
Dec 16 Javascript
angularJS 发起$http.post和$http.get请求的实现方法
May 18 Javascript
Koa 使用小技巧(小结)
Oct 22 Javascript
layui-table获得当前行的上/下一行数据的例子
Sep 24 Javascript
搭建vscode+vue环境的详细教程
Aug 31 Javascript
js下用gb2312编码解码实现方法
Dec 31 #Javascript
JavaScript 学习笔记(七)字符串的连接
Dec 31 #Javascript
JavaScript 学习笔记(六)
Dec 31 #Javascript
JavaScript 学习笔记(五)
Dec 31 #Javascript
JavaScript 学习笔记(四)
Dec 31 #Javascript
javascript showModalDialog模态对话框使用说明
Dec 31 #Javascript
javascript控制frame,iframe的src属性代码
Dec 31 #Javascript
You might like
php 去除html标记--strip_tags与htmlspecialchars的区别详解
2013/06/26 PHP
PHP生成Gif图片验证码
2013/10/27 PHP
phpstorm编辑器乱码问题解决
2014/12/01 PHP
PHP利用pdo_odbc实现连接数据库示例【基于ThinkPHP5.1搭建的项目】
2019/05/13 PHP
laravel框架的安装与路由实例分析
2019/10/11 PHP
jquery photoFrame 图片边框美化显示插件
2010/06/28 Javascript
Dom 是什么的详细说明
2010/10/25 Javascript
基于jquery的防止大图片撑破页面的实现代码(立即缩放)
2011/10/24 Javascript
js switch case default 的用法示例介绍
2013/10/23 Javascript
利用CSS3在Angular中实现动画
2016/01/15 Javascript
移动端使用localStorage缓存Js和css文的方法(web开发)
2016/09/20 Javascript
详解在Angular项目中添加插件ng-bootstrap
2017/07/04 Javascript
JQuery 获取Dom元素的实例讲解
2017/07/08 jQuery
Node.js 使用流实现读写同步边读边写功能
2017/09/11 Javascript
js实现rem自动匹配计算font-size的示例
2017/11/18 Javascript
详解webpack 热更新优化
2018/09/13 Javascript
微信小程序上传多图到服务器并获取返回的路径
2019/05/05 Javascript
微信小程序前端自定义分享的实现方法
2019/06/13 Javascript
Vue中的this.$options.data()和this.$data用法说明
2020/07/26 Javascript
JavaScript浅层克隆与深度克隆示例详解
2020/09/01 Javascript
[42:20]2014 DOTA2华西杯精英邀请赛5 24 DK VS NewBee
2014/05/25 DOTA
Python生成验证码实例
2014/08/21 Python
python里使用正则的findall函数的实例详解
2017/10/19 Python
Python数据结构之栈、队列的实现代码分享
2017/12/04 Python
Python实现的栈(Stack)
2018/01/26 Python
Python OpenCV中的resize()函数的使用
2019/06/20 Python
关于Pytorch的MNIST数据集的预处理详解
2020/01/10 Python
python标准库sys和OS的函数使用方法与实例详解
2020/02/12 Python
python GUI库图形界面开发之PyQt5窗口类QMainWindow详细使用方法
2020/02/26 Python
Pytorch中的自动求梯度机制和Variable类实例
2020/02/29 Python
Python 抓取数据存储到Redis中的操作
2020/07/16 Python
Html5实现用户注册自动校验功能实例代码
2016/05/24 HTML / CSS
德国富尔达运动鞋店:43einhalb
2020/12/25 全球购物
国旗下的讲话演讲稿
2014/05/08 职场文书
群众路线个人整改措施
2014/10/24 职场文书
Keras多线程机制与flask多线程冲突的解决方案
2021/05/28 Python