JavaScript對象和字串之間的轉(zhuǎn)換實(shí)例探討
更新時(shí)間：2013年04月21日 17:34:39 作者：
從對象的格式可以看出，如果字串的格式定義成 json 格式的， 就可以直接轉(zhuǎn)換為obj了，感興趣的朋友可以參考下哈
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>
也可以在定義時(shí)初始化值：
var obj = {key:'11'};
對象如何轉(zhuǎn)換成string
如果直接使用 :
obj.toString()
得到的是 [object,object] 這樣的字串。
從上面的第二種定義方式 (var obj = {key:'11'};) 可以看出， js 的對象對應(yīng)的字串類是一對大括號(hào)里包著一批鍵值對的方式。
其實(shí)就是JSON的數(shù)據(jù)格式， 不了解的可以學(xué)學(xué)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>
重點(diǎn)說一下為什么取值使用：
eval("obj."+attr);
而不是直接使用
obj.attr
因?yàn)?obj.attr 找到的 obj 中key 值為attr 的value ， 但是obj 中并沒有attr 的key 值。
這里的attr 是一個(gè)變量。 所以 就要借助于eval 的方式了。
String 如何轉(zhuǎn)換為對象
從對象的格式可以看出，如果字串的格式定義成 json 格式的， 就可以直接轉(zhuǎn)換為obj了。
比較以下以下兩種的方式：
var obj1 = {attr1:'value1',attr2:'value2'};
var obj2 = "{attr1:'value1',attr2:'value2'}";
obj1 直接是一個(gè)對象， obj2 只是一個(gè)字串。
使用eval(obj2) 就可以轉(zhuǎn)換為對象了。
為什么會(huì)有這種用法： 因?yàn)楹芏鄷r(shí)候，我們會(huì)從服務(wù)端返回這種字串供前端處理。
1. var obj = new Object()
復(fù)制代碼 代碼如下:
<!--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 = {};
復(fù)制代碼 代碼如下:
<!--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>
也可以在定義時(shí)初始化值：
var obj = {key:'11'};
對象如何轉(zhuǎn)換成string
如果直接使用 :
復(fù)制代碼 代碼如下:
obj.toString()
得到的是 [object,object] 這樣的字串。
從上面的第二種定義方式 (var obj = {key:'11'};) 可以看出， js 的對象對應(yīng)的字串類是一對大括號(hào)里包著一批鍵值對的方式。
其實(shí)就是JSON的數(shù)據(jù)格式， 不了解的可以學(xué)學(xué)json 格式。
使用以下方式就可以取出obj 的key 和value了。
復(fù)制代碼 代碼如下:
<!--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>
重點(diǎn)說一下為什么取值使用：
復(fù)制代碼 代碼如下:
eval("obj."+attr);
而不是直接使用
復(fù)制代碼 代碼如下:
obj.attr
因?yàn)?obj.attr 找到的 obj 中key 值為attr 的value ， 但是obj 中并沒有attr 的key 值。
這里的attr 是一個(gè)變量。 所以 就要借助于eval 的方式了。
String 如何轉(zhuǎn)換為對象
從對象的格式可以看出，如果字串的格式定義成 json 格式的， 就可以直接轉(zhuǎn)換為obj了。
比較以下以下兩種的方式：
復(fù)制代碼 代碼如下:
var obj1 = {attr1:'value1',attr2:'value2'};
var obj2 = "{attr1:'value1',attr2:'value2'}";
obj1 直接是一個(gè)對象， obj2 只是一個(gè)字串。
使用eval(obj2) 就可以轉(zhuǎn)換為對象了。
為什么會(huì)有這種用法： 因?yàn)楹芏鄷r(shí)候，我們會(huì)從服務(wù)端返回這種字串供前端處理。
相關(guān)文章
這篇文章主要介紹了通過a標(biāo)簽的超鏈接提交form表單方法匯總，十分的全面細(xì)致，也很實(shí)用，有需要的小伙伴可以參考下。2015-06-06
javascript表格隔行變色加鼠標(biāo)移入移出及點(diǎn)擊效果的方法
這篇文章主要介紹了javascript表格隔行變色加鼠標(biāo)移入移出及點(diǎn)擊效果的方法,涉及javascript實(shí)現(xiàn)隔行變色及鼠標(biāo)點(diǎn)擊效果的相關(guān)技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-04-04
png-8模式的圖片，如果沒有漸變的話是透明的，如果有漸變就不透明了。需要js的支持。2010-02-02
JS實(shí)現(xiàn)頁面滾動(dòng)到關(guān)閉時(shí)的位置與不滾動(dòng)效果
這篇文章主要介紹了JS實(shí)現(xiàn)頁面滾動(dòng)到關(guān)閉時(shí)的位置與不滾動(dòng)效果,滾動(dòng)有兩種方案，其一，利用路由中的meta，在離開頁面時(shí)緩存 top 信息，其二，利用keep-alive緩存整個(gè)頁面。但是僅限于沒有實(shí)時(shí)數(shù)據(jù)變動(dòng)的頁面，需要的朋友可以參考下本文2022-06-06
JavaScript隊(duì)列數(shù)據(jù)結(jié)構(gòu)詳解
這篇文章主要介紹了JavaScript隊(duì)列數(shù)據(jù)結(jié)構(gòu)詳解，隊(duì)列是一種先進(jìn)先出的數(shù)據(jù)結(jié)構(gòu)，隊(duì)列中允許兩種基礎(chǔ)操作，也就是插入和刪除，也就是入隊(duì)和出隊(duì)2022-07-07
js實(shí)現(xiàn)密碼強(qiáng)度檢測【附示例】
下面小編就為大家?guī)硪黄猨s實(shí)現(xiàn)密碼強(qiáng)度檢測【附示例】。小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-03-03
微信小程序 this.triggerEvent()的具體使用
這篇文章主要介紹了微信小程序 this.triggerEvent()的具體使用，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-12-12
setInterval 不準(zhǔn)的原因及問題解決方案
setInterval 是 JavaScript 中用于定時(shí)執(zhí)行任務(wù)的常用方法,本文主要介紹了setInterval 不準(zhǔn)的原因及問題解決方案,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2025-02-02
JS實(shí)現(xiàn)圖片幻燈片效果代碼實(shí)例
這篇文章主要介紹了JS實(shí)現(xiàn)圖片幻燈片效果代碼實(shí)例,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-05-05
JSONP(JSON?with?Padding)是JSON的一種“使用模式”,可用于解決主流瀏覽器的跨域數(shù)據(jù)訪問的問題,這篇文章主要給大家介紹了關(guān)于JSONP跨域請求原理的相關(guān)資料,需要的朋友可以參考下2022-01-01