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 相关文章推荐
多个datatable共存造成多个表格的checkbox都被选中
Jul 11 Javascript
控制文字内容的显示与隐藏示例
Jun 11 Javascript
Javascript学习笔记之 函数篇(二) : this 的工作机制
Jun 24 Javascript
jquery实现点击弹出可放大居中及关闭的对话框(附demo源码下载)
May 10 Javascript
关于JSON与JSONP简单总结
Aug 16 Javascript
ECMAScript6--解构
Mar 30 Javascript
微信小程序 下拉菜单的实现
Apr 06 Javascript
AngularJS双向绑定和依赖反转实例详解
Apr 15 Javascript
详解vuejs之v-for列表渲染
Jun 22 Javascript
JS实现非首屏图片延迟加载的示例
Jan 06 Javascript
微信小程序js文件改变参数并在视图上及时更新【推荐】
Jun 11 Javascript
详解webpack2异步加载套路
Sep 14 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新手上路(六)
2006/10/09 PHP
php 随机排序广告的实现代码
2011/05/09 PHP
PHP将HTML转换成文本的实现代码
2015/01/21 PHP
JavaScript 中的replace方法说明
2007/04/13 Javascript
UI Events 用户界面事件
2012/06/27 Javascript
JS实现兼容性较好的随屏滚动效果
2015/11/09 Javascript
jQuery实现监控页面所有ajax请求的方法
2015/12/10 Javascript
jquery实现的判断倒计时是否结束代码
2016/02/05 Javascript
Bootstrap显示与隐藏简单实现代码
2017/03/06 Javascript
nodeJS微信分享
2017/12/20 NodeJs
vue-cli脚手架config目录下index.js配置文件的方法
2018/03/13 Javascript
微信小程序中使用ECharts 异步加载数据实现图表功能
2018/07/13 Javascript
详解JS实现系统登录页的登录和验证
2019/04/29 Javascript
仿iPhone通讯录制作小程序自定义选择组件的实现
2019/05/23 Javascript
Vue实现多标签选择器
2019/11/28 Javascript
vue3.0 自适应不同分辨率电脑的操作
2021/02/06 Vue.js
用Python进行TCP网络编程的教程
2015/04/29 Python
Python中property函数用法实例分析
2018/06/04 Python
Flask框架各种常见装饰器示例
2018/07/17 Python
pycharm运行程序时在Python console窗口中运行的方法
2018/12/03 Python
python实现flappy bird游戏
2018/12/24 Python
Python单元测试与测试用例简析
2019/11/09 Python
深入了解Python 变量作用域
2020/07/24 Python
HTML5地理定位与第三方工具百度地图的应用
2016/11/17 HTML / CSS
HTML5之SVG 2D入门4—笔画与填充
2013/01/30 HTML / CSS
购买200个世界上最好的内衣品牌:Bare Necessities
2017/02/11 全球购物
法国最大电子商务平台:Cdiscount
2018/03/13 全球购物
巴西手表购物网站:eclock
2019/03/19 全球购物
意大利包包和行李箱销售网站:Bagaglio.it
2021/03/02 全球购物
财务会计专业个人求职信范本
2014/01/08 职场文书
组织鉴定材料
2014/06/02 职场文书
献爱心大型公益活动策划方案
2014/09/15 职场文书
应急管理工作总结2015
2015/05/04 职场文书
党员干部学习三严三实心得体会
2016/01/05 职场文书
Redis 持久化 RDB 与 AOF的执行过程
2021/11/07 Redis
bootstrapv4轮播图去除两侧阴影及线框的方法
2022/02/15 HTML / CSS