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 相关文章推荐
Jquery中dialog属性小记
Sep 03 Javascript
javascript动态加载三
Aug 22 Javascript
JavaScript bold方法入门实例(把指定文字显示为粗体)
Oct 17 Javascript
jQuery超赞的评分插件(8款)
Aug 20 Javascript
详解js中class的多种函数封装方法
Jan 03 Javascript
BooStrap对导航条的改造实践小结
Sep 21 Javascript
浅谈js常用内置方法和对象
Sep 24 Javascript
BootStrap 页签切换失效的解决方法
Aug 17 Javascript
nuxt+axios解决前后端分离SSR的示例代码
Oct 24 Javascript
Vue页面刷新记住页面状态的实现
Dec 27 Javascript
微信小程序使用前置摄像头拍照
Oct 22 Javascript
VUE递归树形实现多级列表
Jul 15 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中的登陆login
2007/01/18 PHP
中英文字符串翻转函数
2008/12/09 PHP
php原生导出excel文件的两种方法(推荐)
2016/11/19 PHP
javascript 鼠标悬浮图片显示原图 移出鼠标后原图消失(多图)
2009/12/28 Javascript
实用的JS正则表达式(手机号码/IP正则/邮编正则/电话等)
2013/01/11 Javascript
Javascript图片上传前的本地预览实例
2014/06/16 Javascript
JavaScript的9种继承实现方式归纳
2015/05/18 Javascript
JS实现黑客帝国文字下落效果
2015/09/01 Javascript
再次谈论React.js实现原生js拖拽效果引起的一系列问题
2016/04/03 Javascript
js判断主流浏览器类型和版本号的简单实现代码
2016/05/26 Javascript
JS控制HTML元素的显示和隐藏的两种方法
2016/09/27 Javascript
nodejs 图片预览和上传的示例代码
2017/09/30 NodeJs
基于vue,vue-router, vuex及addRoutes进行权限控制问题
2018/05/02 Javascript
vue awesome swiper异步加载数据出现的bug问题
2018/07/03 Javascript
vue项目打包上传github并制作预览链接(pages)
2019/04/19 Javascript
Nodejs使用archiver-zip-encrypted库加密压缩文件时报错(解决方案)
2019/11/18 NodeJs
js防抖函数和节流函数使用场景和实现区别示例分析
2020/04/11 Javascript
在vue项目中利用popstate处理页面返回的操作介绍
2020/08/06 Javascript
Vue仿Bibibili首页的问题
2021/01/21 Vue.js
详解Python的Django框架中inclusion_tag的使用
2015/07/21 Python
人生苦短我用python python如何快速入门?
2018/03/12 Python
python3连接MySQL数据库实例详解
2018/05/24 Python
Django项目中包含多个应用时对url的配置方法
2018/05/30 Python
pandas中read_csv的缺失值处理方式
2019/12/19 Python
python异常处理、自定义异常、断言原理与用法分析
2020/03/23 Python
pandas实现导出数据的四种方式
2020/12/13 Python
加拿大建筑和装修专家:Reno-Depot
2017/12/21 全球购物
大学本科毕业生的自我鉴定
2013/11/26 职场文书
医院总经理岗位职责
2014/02/04 职场文书
社区工作感言
2014/02/21 职场文书
写自荐信的注意事项
2014/03/09 职场文书
社区消防工作实施方案
2014/03/21 职场文书
优秀安全员事迹材料
2014/05/11 职场文书
领导班子党的群众路线教育实践活动对照检查材料
2014/09/25 职场文书
工程部主管岗位职责
2015/02/12 职场文书
编写python程序的90条建议
2021/04/14 Python