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 相关文章推荐
转一个日期输入控件,支持FF
Apr 27 Javascript
IE不支持getElementsByClassName最终完美解决方案
Dec 17 Javascript
Javascript和HTML5利用canvas构建Web五子棋游戏实现算法
Jul 17 Javascript
JS刷新当前页面的几种方法总结
Dec 24 Javascript
Node.js入门教程:在windows和Linux上安装配置Node.js图文教程
Aug 14 Javascript
DOM事件阶段以及事件捕获与事件冒泡先后执行顺序(图文详解)
Aug 18 Javascript
Vue.js 中的 $watch使用方法
May 25 Javascript
mpvue开发音频类小程序踩坑和建议详解
Mar 12 Javascript
微信小程序 调用微信授权窗口相关问题解决
Jul 25 Javascript
简单了解JavaScript弹窗实现代码
May 07 Javascript
angular组件间通讯的实现方法示例
May 07 Javascript
vue-router 控制路由权限的实现
Sep 24 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网页后退不再出现过期
2007/03/08 PHP
php disk_free_space 返回目录可用空间
2010/05/10 PHP
在JavaScript中通过URL传递汉字的方法
2007/04/09 Javascript
javascript入门·动态的时钟,显示完整的一些方法,新年倒计时
2007/10/01 Javascript
JavaScript 计算图片加载数量的代码
2011/01/01 Javascript
JavaScript高级程序设计 读书笔记之九 本地对象Array
2012/02/27 Javascript
js改变文章字体大小的实例代码
2013/11/27 Javascript
bootstrap table 表格中增加下拉菜单末行出现滚动条的快速解决方法
2017/01/05 Javascript
ES6中的箭头函数实例详解
2017/04/06 Javascript
详解vue过滤器在v2.0版本用法
2017/06/01 Javascript
纯js实现动态时间显示
2020/09/07 Javascript
基于Bootstrap分页的实例讲解(必看篇)
2017/07/04 Javascript
基于vue.js路由参数的实例讲解——简单易懂
2017/09/07 Javascript
jquery使用iscorll实现上拉、下拉加载刷新
2017/10/26 jQuery
javascript变量提升和闭包理解
2018/03/12 Javascript
Vue Echarts实现可视化世界地图代码实例
2019/05/07 Javascript
详解vuex的简单todolist例子
2019/07/14 Javascript
微信JSSDK实现打开摄像头拍照再将相片保存到服务器
2019/11/15 Javascript
Javascript前端下载后台传来的文件流代码实例
2020/08/18 Javascript
Pycharm学习教程(3) 代码运行调试
2017/05/03 Python
使用apidoc管理RESTful风格Flask项目接口文档方法
2018/02/07 Python
浅析python继承与多重继承
2018/09/13 Python
python url 参数修改方法
2018/12/26 Python
Django 表单模型选择框如何使用分组
2019/05/16 Python
Django框架封装外部函数示例
2019/05/28 Python
Flask框架钩子函数功能与用法分析
2019/08/02 Python
加拿大票务网站:Ticketmaster加拿大
2017/07/17 全球购物
国家励志奖学金获奖感言
2014/01/09 职场文书
古汉语文学求职信范文
2014/03/16 职场文书
留学生求职信
2014/06/03 职场文书
中国梦演讲稿3分钟
2014/08/19 职场文书
中级会计大学生职业生涯规划书
2014/09/16 职场文书
博士给导师的自荐信
2015/03/06 职场文书
色戒观后感
2015/06/12 职场文书
2015年酒店销售部工作总结
2015/07/24 职场文书
OpenCV全景图像拼接的实现示例
2021/06/05 Python