JavaScript对象和字串之间的转换实例探讨


Posted in Javascript onApril 21, 2013

JavaScript 对象定义方式
1. var obj = new Object()

<!--Add by oscar999--> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> New Document </TITLE> 
<META NAME="Author" CONTENT="oscar999"> 
<script> 
var obj = new Object(); 
obj.key = "11"; 
alert(obj.key); 
</script> 
</HEAD> 
<BODY> 
</BODY> 
</HTML>

2. var obj = {};
<!--Add by oscar999--> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> New Document </TITLE> 
<META NAME="Author" CONTENT="oscar999"> 
<script> 
var obj = {}; 
obj.key = "11"; 
alert(obj.key); 
</script> 
</HEAD> 
<BODY> 
</BODY> 
</HTML>

也可以在定义时初始化值:
var obj = {key:'11'};
对象如何转换成string
如果直接使用 :
obj.toString()

得到的是 [object,object] 这样的字串。
从上面的第二种定义方式 (var obj = {key:'11'};) 可以看出, js 的对象对应的字串类是一对大括号里包着一批键值对的方式。

其实就是JSON的数据格式, 不了解的可以学学json 格式。
使用以下方式就可以取出obj 的key 和value了。

<!--Add by oscar999--> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> New Document </TITLE> 
<META NAME="Author" CONTENT="oscar999"> 
<script> 
var obj = {attr1:'value1',attr2:'value2'}; 
for(attr in obj) 
{ 
alert(attr); 
alert(eval("obj."+attr)); 
} 
</script> 
</HEAD> 
<BODY> 
</BODY> 
</HTML>

重点说一下为什么取值使用:
eval("obj."+attr);

而不是直接使用
obj.attr

因为 obj.attr 找到的 obj 中key 值为attr 的value , 但是obj 中并没有attr 的key 值。
这里的attr 是一个变量。 所以 就要借助于eval 的方式了。

String 如何转换为对象
从对象的格式可以看出,如果字串的格式定义成 json 格式的, 就可以直接转换为obj了。
比较以下以下两种的方式:

var obj1 = {attr1:'value1',attr2:'value2'}; 
var obj2 = "{attr1:'value1',attr2:'value2'}";

obj1 直接是一个对象, obj2 只是一个字串。
使用eval(obj2) 就可以转换为对象了。

为什么会有这种用法: 因为很多时候,我们会从服务端返回这种字串供前端处理。

Javascript 相关文章推荐
Web层改进II-用xmlhttp 无声息提交复杂表单
Jan 22 Javascript
javascript 动态生成私有变量访问器
Dec 06 Javascript
jQuery第三课 修改元素属性及内容的代码
Mar 14 Javascript
JS实现的表格行鼠标点击高亮效果代码
Nov 27 Javascript
基于JavaScript代码实现兼容各浏览器的设为首页和加入收藏
Jan 07 Javascript
全面了解JavaScript的数据类型转换
Jul 01 Javascript
vue实现导航栏效果(选中状态刷新不消失)
Dec 13 Javascript
Vue2.0结合webuploader实现文件分片上传功能
Mar 09 Javascript
vue实现div拖拽互换位置
Jul 29 Javascript
微信小程序云开发之新手环境配置
May 16 Javascript
jQuery+ajax实现文件上传功能
Dec 22 jQuery
JavaScript 与 TypeScript之间的联系
Nov 27 Javascript
jquery获取自定义属性(attr和prop)实例介绍
Apr 21 #Javascript
js和jquery对dom节点的操作(创建/追加)
Apr 21 #Javascript
jquery获取焦点和失去焦点事件代码
Apr 21 #Javascript
jQuery获取注册信息并提示实现代码
Apr 21 #Javascript
jQuery隔行变色与普通JS写法的对比
Apr 21 #Javascript
jQuery模拟超链接点击效果代码
Apr 21 #Javascript
jquery 元素控制(追加元素/追加内容)介绍及应用
Apr 21 #Javascript
You might like
php调用c接口无错版介绍
2014/03/11 PHP
ThinkPHP数据操作方法总结
2015/09/28 PHP
Laravel学习教程之本地化模块
2017/08/18 PHP
PHP使用JpGraph绘制折线图操作示例【附源码下载】
2019/10/18 PHP
jquery $.ajax()取xml数据的小问题解决方法
2010/11/20 Javascript
jquery动态增加删除表格行的小例子
2013/11/14 Javascript
jQuery 获取、设置HTML或TEXT内容的两种方法
2014/05/23 Javascript
使用AngularJS创建单页应用的编程指引
2015/06/19 Javascript
浏览器环境下JavaScript脚本加载与执行探析之动态脚本与Ajax脚本注入
2016/01/19 Javascript
jQuery 生成svg矢量二维码
2016/08/09 Javascript
浅谈Angular的$q, defer, promise
2016/12/20 Javascript
javascript按顺序加载运行js方法
2017/12/01 Javascript
layer.confirm取消按钮绑定事件的方法
2018/08/17 Javascript
JS/HTML5游戏常用算法之路径搜索算法 随机迷宫算法详解【普里姆算法】
2018/12/13 Javascript
JS基于对象的链表实现与使用方法示例
2019/01/31 Javascript
Vue v-for循环之@click点击事件获取元素示例
2019/11/09 Javascript
Vue.directive 实现元素scroll逻辑复用
2019/11/29 Javascript
关于vue3默认把所有onSomething当作v-on事件绑定的思考
2020/05/15 Javascript
Vue父子之间值传递的实例教程
2020/07/02 Javascript
[33:19]完美世界DOTA2联赛PWL S2 PXG vs InkIce 第一场 11.26
2020/11/30 DOTA
跟老齐学Python之编写类之二方法
2014/10/11 Python
线程和进程的区别及Python代码实例
2015/02/04 Python
Python实现把xml或xsl转换为html格式
2015/04/08 Python
浅谈Python用QQ邮箱发送邮件时授权码的问题
2018/01/29 Python
python正向最大匹配分词和逆向最大匹配分词的实例
2018/11/14 Python
pandas DataFrame索引行列的实现
2019/06/04 Python
python scatter函数用法实例详解
2020/02/11 Python
CSS3实现文字波浪线效果示例代码
2016/11/20 HTML / CSS
曼联官方网上商店:Manchester United Direct
2017/07/28 全球购物
在C中是否有模拟继承等面向对象程序设计特性的好方法
2012/05/22 面试题
校园安全教育广播稿
2014/02/17 职场文书
企业管理毕业生求职信
2014/03/11 职场文书
邮政竞聘演讲稿
2014/09/03 职场文书
酒店收银员岗位职责
2015/04/07 职场文书
SQL Server内存机制浅探
2022/04/06 SQL Server
Python使用PyYAML库读写yaml文件的方法
2022/04/06 Python