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使用onclick事件改变选中行的颜色
Dec 30 Javascript
Angular实现form自动布局
Jan 28 Javascript
Vue.js实战之组件的进阶
Apr 04 Javascript
vue组件间通信子与父详解(二)
Nov 07 Javascript
对vue 键盘回车事件的实例讲解
Aug 25 Javascript
100行代码实现vue表单校验功能(小白自编)
Nov 19 Javascript
vue中 v-for循环的用法详解
Feb 19 Javascript
JS数组扁平化、去重、排序操作实例详解
Feb 24 Javascript
Jquery ajax书写方法代码实例解析
Jun 12 jQuery
Javascript中的解构赋值语法详解
Apr 02 Javascript
JavaScript如何优化逻辑判断代码详解
Jun 08 Javascript
JavaScript 中for/of,for/in 的详细介绍
Nov 17 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魔术变量用法实例详解
2014/11/13 PHP
php导入excel文件到mysql数据库的方法
2015/01/14 PHP
PHP实现长文章分页实例代码(附源码)
2016/02/03 PHP
php把时间戳转换成多少时间之前函数的实例
2016/11/16 PHP
总结PHP内存释放以及垃圾回收
2018/03/29 PHP
PHP字符串与数组处理函数用法小结
2020/01/07 PHP
html数组字符串拼接的最快方法
2009/09/16 Javascript
css transform 3D幻灯片特效实现步骤解读
2013/03/27 Javascript
AngularJS基础 ng-keypress 指令简单示例
2016/08/02 Javascript
JavaScript调试的多个必备小Tips
2017/01/15 Javascript
微信小程序 JS动态修改样式的实现代码
2017/02/10 Javascript
微信小程序城市定位的实现实例(获取当前所在国家城市信息)
2017/05/17 Javascript
vue结合axios与后端进行ajax交互的方法
2018/07/06 Javascript
React组件重构之嵌套+继承及高阶组件详解
2018/07/19 Javascript
使用Object.defineProperty如何巧妙找到修改某个变量的准确代码位置
2018/11/02 Javascript
vue-cli 目录结构详细讲解总结
2019/01/15 Javascript
JavaScript实现图片的放大缩小及拖拽功能示例
2019/05/14 Javascript
Element-UI+Vue模式使用总结
2020/01/02 Javascript
精确查找PHP WEBSHELL木马的方法(1)
2011/04/12 Python
python登录QQ邮箱发信的实现代码
2013/02/10 Python
Python文件和目录操作详解
2015/02/08 Python
Python实现把json格式转换成文本或sql文件
2015/07/10 Python
Python实现使用卷积提取图片轮廓功能示例
2018/05/12 Python
Python实现求解一元二次方程的方法示例
2018/06/20 Python
解决python字典对值(值为列表)赋值出现重复的问题
2019/01/20 Python
python3+selenium实现qq邮箱登陆并发送邮件功能
2019/01/23 Python
Pytorch根据layers的name冻结训练方式
2020/01/06 Python
PyTorch 解决Dataset和Dataloader遇到的问题
2020/01/08 Python
Django与AJAX实现网页动态数据显示的示例代码
2021/02/24 Python
CSS3 真的会替代 SCSS 吗
2021/03/09 HTML / CSS
html5 canvas手势解锁源码分享
2020/01/07 HTML / CSS
美国帽子俱乐部商店:Hat Club
2019/07/05 全球购物
什么是Smarty变量操作符?如何使用Smarty变量操作符
2014/07/18 面试题
创先争优标语
2014/06/27 职场文书
党员批评与自我批评材料
2014/10/14 职场文书
python3 sqlite3限制条件查询的操作
2021/04/07 Python