碼上快樂

相關內容    簡體    繁體

Javascript中數組與字典(即map)的使用

本文轉載自   查看原文   2016-04-22 10:53   3246    JavaScript

簡述：

簡單記錄一下數據結構Map和數組，

其實在Javascript這種弱類型的腳本語言中，數組同時也就是字典，下面主要就是字典數組的簡易使用

 

代碼：

1. 數組中添加map

 

[html]  view plain  copy
 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  2. <html>  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
  5. <title>Test</title>  
  6. <script type="text/javascript">  
  7.   
  8. var arr = [];  
  9. var key = 'Jeremy';  
  10. var value = '!!!!'  
  11. arr.push({  
  12.     'key': key,  
  13.     'value': value,  
  14. });  
  15.   
  16. document.write("key: " + arr[0]['key'] +  
  17.         "<br/>value: " + arr[0]['value']);  
  18.   
  19. </script>  
  20. </head>  
  21. <body>  
  22.   
  23. </body>  
  24. </html>  


輸出0：

 


2. 數組遍歷輸出

 

[html]  view plain  copy
 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  2. <html>  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
  5. <title>Test</title>  
  6. </head>  
  7. <body>  
  8. <script type="text/javascript">  
  9. var arr = [];  
  10. arr.push("Jeremy");  
  11. arr.push("Jimmy");  
  12. for(var i in arr)  
  13.     document.write(i + ": " + arr[i] + "</br>");  
  14. </script>  
  15. </body>  
  16. </html>  


輸出1：

 

 

3. 類似字典（map)遍歷

 

[html]  view plain  copy
 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  2. <html>  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
  5. <title>Test</title>  
  6. </head>  
  7. <body>  
  8. <script type="text/javascript">  
  9. var dict = []; //or dict = new Array()  
  10. dict["Jeremy"] = 20;  
  11. dict["Jimmy"] = 30;  
  12. for(var key in dict)  
  13.     document.write(key + ": " + dict[key] + "</br>");  
  14. </script>  
  15. </body>  
  16. </html>  


輸出2：

 

 


4. 字典聲明時賦值

[java]  view plain  copy
 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  2. <html>  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
  5. <title>Test</title>  
  6. </head>  
  7. <body>  
  8. <script type="text/javascript">  
  9. var dict = {  
  10.     "Jeremy" : 20,  
  11.     "Jimmy" : 30  
  12. };  
  13. for(var key in dict)  
  14.     document.write(key + ": " + dict[key] + "</br>");  
  15. </script>  
  16. </body>  
  17. </html>  

 

 

輸出3：

 

 

5.字典中嵌套數組

 

[html]  view plain  copy
 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  2. <html>  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
  5. <title>Test</title>  
  6. </head>  
  7. <body>  
  8. <script type="text/javascript">  
  9. var dict = {  
  10.     "Jeremy" : ["Chinese", "Math"] ,  
  11.     "Jimmy" : ["Art", "English"]  
  12. };  
  13. var name = "Jeremy";  
  14. for(var courseIndex in dict[name])  
  15.     document.write(dict[name][courseIndex] + "</br>");  
  16. </script>  
  17. </body>  
  18. </html>  


輸:4：

 

 

6. 字典里value為數組， 數組內為字典，

下面的邏輯就是學生 ：  課程列表 ： 某門的課程信息

 

[html]  view plain  copy
 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  2. <html>  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
  5. <title>Test</title>  
  6. </head>  
  7. <body>  
  8. <script type="text/javascript">  
  9. var dict = [];  
  10. var courseListOfJeremy = [  
  11.     {"Chinese" : 3},   
  12.     {"Math": 5}  
  13. ];  
  14. dict['Jeremy'] = courseListOfJeremy;  
  15. var courseListOfJimmy =  [  
  16.     {"Art": 3},   
  17.     {"English": 5}  
  18. ];  
  19. dict['Jimmy'] = courseListOfJimmy;  
  20.   
  21. document.write("Jimmy's Course Number Of Chinese: " + dict['Jeremy'][0]['Chinese']);  
  22. </script>  
  23. </body>  
  24. </html>  


輸出5：

 

 http://blog.csdn.net/anialy/article/details/8295765


免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。



猜您在找 python中字典和數組的使用 javascript中array的map方法的使用 JavaScript中的數組遍歷forEach()與map()方法以及兼容寫法 javascript中的字典 JavaScript中的map方法 javascript source map 的使用 javaScript中的DOM操作及數組的使用 使用JavaScript從數組中刪除對象 JavaScript 中數組 sort() 方法的基本使用 go中的數據結構-字典map
 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM