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 相关文章推荐
JavaScript中清空数组的三种方法分享
Apr 07 Javascript
jQuery学习总结之元素的相对定位和选择器(持续更新)
Apr 26 Javascript
JS关键字变色实现思路及代码
Feb 21 Javascript
jquery+json实现数据列表分页示例代码
Nov 15 Javascript
javascript将DOM节点添加到文档的方法实例分析
Aug 04 Javascript
jQuery插件uploadify实现ajax效果的图片上传
Jun 18 Javascript
JS公共小方法之判断对象是否为domElement的实例
Nov 25 Javascript
easy ui datagrid 从编辑框中获取值的方法
Feb 22 Javascript
如何使用Bootstrap创建表单
Mar 29 Javascript
妙用Angularjs实现表格按指定列排序
Jun 23 Javascript
解决angularjs WdatePicker ng-model的问题
Sep 13 Javascript
vue3.0+vue-router+element-plus初实践
Dec 02 Vue.js
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极大的增强功能和性能
2006/10/09 PHP
PHP彩蛋信息介绍和阻止泄漏的方法(隐藏功能)
2014/08/06 PHP
Thinkphp多文件上传实现方法
2014/10/31 PHP
php结合ajax实现手机发红包的案例
2016/10/13 PHP
PHP pthreads v3使用中的一些坑和注意点分析
2020/02/21 PHP
Node.js中的模块机制学习笔记
2014/11/04 Javascript
深入浅出 jQuery中的事件机制
2016/08/23 Javascript
jQuery通过ajax方法获取json数据不执行success的原因及解决方法
2016/10/15 Javascript
angularJS深拷贝详解
2017/03/23 Javascript
Angular 组件之间的交互的示例代码
2018/03/24 Javascript
通过一次报错详细谈谈Point事件
2018/05/17 Javascript
vue移动端监听滚动条高度的实现方法
2018/09/03 Javascript
详解JavaScript的数据类型以及数据类型的转换
2019/04/20 Javascript
js实现聊天对话框
2020/02/08 Javascript
玩转python爬虫之爬取糗事百科段子
2016/02/17 Python
python模拟Django框架实例
2016/05/17 Python
快速了解Python开发中的cookie及简单代码示例
2018/01/17 Python
Python使用pandas处理CSV文件的实例讲解
2018/06/22 Python
Python 异常的捕获、异常的传递与主动抛出异常操作示例
2019/09/23 Python
Python读取csv文件实例解析
2019/12/30 Python
tensorflow 获取所有variable或tensor的name示例
2020/01/04 Python
如何用Python绘制3D柱形图
2020/09/16 Python
Python __slots__的使用方法
2020/11/15 Python
Django自带的用户验证系统实现
2020/12/18 Python
pycharm 如何取消连按两下shift出现的全局搜索
2021/01/15 Python
10个顶级Python实用库推荐
2021/03/04 Python
高级运动鞋:GREATS
2019/07/19 全球购物
应届生个人求职信模板
2013/11/26 职场文书
财会自我鉴定范文
2013/12/27 职场文书
研究生毕业鉴定
2014/01/29 职场文书
幼儿园毕业寄语
2014/04/03 职场文书
医学专业大学生求职信
2014/07/12 职场文书
党员个人对照检查材料
2014/10/01 职场文书
法制工作总结2015
2015/07/23 职场文书
生活委员竞选稿
2015/11/21 职场文书
2016大学生国家助学贷款承诺书
2016/03/25 职场文书