JS基礎:JSON和它的for in遍歷

  • json

一、對比數組與json寫法

【案例】

如果數組:
var arrUrl=['img/1.png','img/2.png','img/3.png','img/4.png'];
var arrText=['寵物','圖片二','圖片三','面具'];
用json寫:
var imgData ={
 utl:['img/1.png','img/2.png','img/3.png','img/4.png'],
 text:['寵物','圖片二','圖片三','面具'];
};
alert(imgData.url[2])//img/3.png

二、json寫法中的''和.和[]

【案例】

var json2={name:'miaov'};
var json2={'name':'miaov'};
//都正確,只是下面name加了引號''后更為安全穩定

都正確,只是name加了引號后更為安全穩定

alert(json2.name);
alert(jason2['name'];
//上面的兩種讀取寫法:.或者[]也都是正確的

寫法:.或者[]也都是正確的

json2.name='abc';
json2['name']='ABC';
 //上面的兩種改寫方法也都正確

三、Jason可以包含數字,字符串,數組等;數組也可以包字符串

【案例】:

var json2={abc:123,xyz:''}
////{[],[],[]}   [{},{},{}]json可以包含數組,數組也可以包含json
var arr=[{'name':'TM','age':23},{'name':'leo','age':32}];
alert(arr[0].name+'今年有'+arr[1]['age']);
  • for in遍歷

一、遍歷與獲取驗證

【案例】

var json4 ={'name':'miaov','age':3,'fun':'前端開發'};
for(var attr in json4){

alert(attr);//name,age,fun
alert(json4[attr]);//miaov,3,前端開發
alert(json4['attr']);//undefined 加了引號是去找是否有attr屬性
}

【注意】:alert(json4[attr])與alert(json4['attr'])不同

二、有數組時,for in與for的嵌套

【案例】

var json5={
 'url':['img/1.png','img/2.png','img/3.png','img/4.png'],
 'text':['寵物','圖片二','圖片三','面具'];
};
for(var attr in json5){
 for(var i=0;i<json5[attr].length;i++){
   alert(json5[attr][i]);//img1.png,img/2.png,...面具
 }
}

這說明for in循環可以嵌套for

var arr={[],[],[]}

反過來for循環也可以嵌套for in

var arr=[{},{},{}]

三、for in遍歷對象屬性

window下面有多少屬性,及屬性名對應的值:

<script>
var str="";
var num =0;
for(var attr in window){
  str +=num+ '.'+ attr + ':'+window[attr]+'<br/>';
  num++;
}
document.body.innerHTML=str;
</script>

四、json中可以用for嗎?(不可以)數組可以用for in 嗎?(可以)

var json={
 'url':['img/1.png','img/2.png','img/3.png','img/4.png'],
 'text':['寵物','圖片二','圖片三','面具'];
};
alert(json.length);//undefined說明json沒有長度length概念
 for(var i=0;i<json.length;i++){

}
//上面都測試了json沒有長度length概念,所以json不用for


var arr=['a','b','c'];
for(var i in attr){
 alert(i);//0,1,2
 alert(arr[i]);//a,b,c
所以for in可以用于數組
}

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • Spring Cloud為開發人員提供了快速構建分布式系統中一些常見模式的工具(例如配置管理,服務發現,斷路器,智...
    卡卡羅2017閱讀 134,923評論 18 139
  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 173,269評論 25 708
  • 和明姑娘通電話,明姑娘問:“你還記得那次我們一起偷無花果嗎?” 我說當然記得啊,那次吃到的無花果是最好吃的無花果。...
    馮小琦嗯閱讀 1,048評論 0 1
  • 他繼續翻看著這本書,當他看到第七十頁的時候,發現少了一部分,他重新打開那份文件,自己當初的一時失誤造成了這個后果,...
    小丑說她很快樂閱讀 228評論 0 0
  • 衡量一部奇幻劇集是否優秀的標準之一,就是它的粉絲們能否在其世界觀的框架內衍生出新的理論。而對于美劇《權力的游戲》來...
    wit小學生閱讀 4,742評論 3 9