logo

Come creare un dizionario e aggiungere dinamicamente coppie chiave-valore?

Questo articolo ti insegnerà come creare un dizionario in JavaScript utilizzando oggetti per memorizzare coppie chiave-valore. Sebbene JavaScript non abbia un tipo di dizionario integrato, possiamo crearne uno in modo efficace utilizzando gli oggetti JavaScript. Iniziamo creando un nuovo oggetto JavaScript che funga da dizionario.

impilare in Java

Sintassi:

La chiave può essere una stringa, un numero intero. Se scrivi semplicemente key1 o qualsiasi numero, verrà trattato come una stringa.



var dict = { key1 : value1 , key2 : value2 , .... };>
  • Crea dizionario vuoto
    var dict = {};>
  • Aggiunta di coppie chiave-valore nel dizionario
    dict[new_key] = new_value;>
    oppure Se new_key è già presente nel dizionario, il suo valore verrà aggiornato a new_value.
    dict.new_key = new_value;>
  • Accesso alle coppie chiave-valore
    var value = dict[key];>
    O
    var value = dict.key;>
  • Iterazione dell'intero dizionario
    for(var key in dict) { console.log(key + ' : ' + dict[key]); }>

Esempio:

HTML
   Dizionario in Javascripttitle> head> <body style='text-align: center;'> <h1 style='color: green;'>techcodeview.com h1><p>var dict = { <br />'geek' : 1 , <br />'per' : '2', <br />'geek': 3.5 <br />}; <br />p> <button onClick='fun()'>Pulsante Aggiungi nuove coppie chiave-valore><p id='demo'>p><script>function fun() { var dict = { geek: 1, for: '2', geek: 3.5, };  dict.new_geeks = 'nuovo_valore';  dict['another_new_geeks'] = 'another_value';  var to_show = 'var dict = { ';  for (var key in dict) { to_show += ''' + key + '' : ' + dict[key] + ' ';  } mostrare_per += ' }; ';  document.getElementById('demo') .innerHTML = to_show;  } script> corpo> html>></pre> </code> <p dir='ltr'>  <b>  <strong>Produzione:</strong>  </b>  </p>  <img src='//techcodeview.com/img/javascript-misc/88/how-create-dictionary.webp' alt="">  <br></article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//spiritscaution.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></div> </article>
                         
                        </div><!--//content-->
                    </div><!--//section-inner-->                 
                </section><!--//section-->
    
            </div><!--//primary-->
            <div class="secondary col-md-4 col-sm-12 col-xs-12">
                  <aside class="info aside section">
                    <div class="section-inner">
                        <h2 class="">Categoria</h2>
                        <div class="content">
                            <ul class="list-unstyled">
                                <li> <a href="/python-directory-program/">Programma Di Directory Python</a> </li><li> <a href="/techtips/">Suggerimenti tecnici</a> </li><li> <a href="/c-conversion-programs/">Programmi Di Conversione C</a> </li><li> <a href="/atoms-ions/">Atomi E Ioni</a> </li><li> <a href="/python-pandas-dataframe-methods/">Metodi Python Pandas-Dataframe</a> </li><li> <a href="/javascript-lodash/">Javascript-Lodash</a> </li><li> <a href="/acids-bases-salts/">Acidi, Basi E Sali</a> </li><li> <a href="/pandas-tutorial/">Tutorial Sui Panda</a> </li><li> <a href="/java-overloading/">Sovraccarico Java</a> </li><li> <a href="/r-dataframe-function/">Funzione R Dataframe</a> </li>
                                
                            </ul>
                        </div><!--//content-->  
                    </div><!--//section-inner-->                 
                </aside><!--//aside-->
                
                 <aside class="testimonials aside section">
                	 <div class="section-inner">
                        <div class="content">
                            <div class="item">
  								<div class="rekl_placeholder" id="sidebar_placeholder_1"> <script type="text/javascript">atOptions = {'key' : 'f53f1abf3c3a788f849c12a956865db1','format' : 'iframe','height' : 300,'width' : 160,'params' : {}};</script><script type="text/javascript" src="//spiritscaution.com/f53f1abf3c3a788f849c12a956865db1/invoke.js"></script> <br></div>                                                   
                            </div>
                        </div>
                    </div>
                   <div class="section-inner">
                        <h2 class="heading">Apri un file in Python</h2>
                        <div class="content">
                            <div class="item">
                                 <blockquote class="quote">                                  
                                    <span> <i class="fa fa-quote-left"></i> Un portale di informatica per geek. Contiene articoli di informatica e programmazione ben scritti, ben pensati e ben spiegati, quiz e domande per colloqui pratici/competitivi/aziendali.</span>
                                </blockquote>                
                                                                                             
                            </div><!--//item-->
                            
                            <p> <a class="more-link" href="/open-file-python"> <i class="fa fa-external-link"></i> Per Saperne Di Più</a> </p> 
                            
                        </div><!--//content-->
                    </div><!--//section-inner-->
                </aside><!--//section-->
                
               
                            
                 <aside class="languages aside section">
                    <div class="section-inner">
                        <h2 class="heading">Articoli Interessanti</h2>
                        <div class="content">
                            <ul class="list-unstyled">
                                <li class="item">
                                    <span class="title"> <strong> <a href="/arrays-in-java">Array in Java</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/best-crucible-act-3-summary-1311590">Miglior riepilogo dell'Atto 3 del Crogiolo</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/android-activity-lifecycle">Ciclo di vita delle attività Android</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/ascii-table-c">Tabella ASCII in C</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/what-are-comments-css">Cosa sono i commenti nei CSS?</a> </strong> </span>
                                    
                                </li><!--//item-->
                               
                            </ul>
                        </div><!--//content-->
                    </div><!--//section-inner-->
                </aside><!--//section-->
                
              
                 <aside class="list music aside section">
                    <div class="section-inner">
                        <h2 class="heading">Messaggi Popolari</h2>
                        <div class="content">
                            <ul class="list"> <li><a href="/hover-css">css in bilico</a>
</li><li><a href="/singleton-design-pattern-java">progettazione singleton</a>
</li><li><a href="/java-convert-char-int">char a intero java</a>
</li><li><a href="/how-convert-bytes-string-python">byte Python in stringa</a>
</li><li><a href="/difference-between-set">set vs mappa</a>
</li><li><a href="/homogeneous-mixture-definition">miscela omogenea</a>
</li> 
                                
                                
                            </ul>
                        </div><!--//content-->
                    </div><!--//section-inner-->
                </aside><!--//section-->
              
            </div><!--//secondary-->    
        </div><!--//row-->
    </div><!--//masonry-->
    
	    <footer class="footer">
        <div class="container text-center">
                <span>
Copyright ©2025 Tutti I Diritti Riservati |  <a href="//nl.techcodeview.com/">techcodeview.com</a> | <a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Disclaimer</a>  |  <a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">Chi Siamo</a>  |  <a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Politica Sulla Riservatezza</a>  </span>
        </div>
    </footer>
 
         
    <script type="text/javascript" src="https://techcodeview.com/template/assets/plugins/jquery-1.11.3.min.js"></script>
    <script type="text/javascript" src="https://techcodeview.com/template/assets/plugins/bootstrap/js/bootstrap.min.js"></script>    
    

    <script type="text/javascript" src="https://techcodeview.com/template/assets/js/main.js"></script>     
	
	<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.1/highlight.min.js"></script>
	<script>
!function(){"use strict";let t=document.createElement("button");t.id="toTopBtn",t.innerHTML="↑";let e=`
        #toTopBtn {
            position: fixed;
            bottom: 25px;
            right: 25px;
            z-index: 9999;
            opacity: 0;
            visibility: hidden;
            background-color: #213141;
            color: white;
            border: none;
            border-radius: 8px;
            width: 50px;
            height: 50px;
            font-size: 24px;
            cursor: pointer;
            transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
        }
        #toTopBtn:hover {
            background-color: #555;
        }
    `,i=document.createElement("style");i.type="text/css",i.innerText=e,document.head.appendChild(i),document.body.appendChild(t),window.addEventListener("scroll",()=>{let e=window.scrollY||document.documentElement.scrollTop;e>300?(t.style.opacity="1",t.style.visibility="visible"):(t.style.opacity="0",t.style.visibility="hidden")}),t.addEventListener("click",()=>{window.scrollTo({top:0,behavior:"smooth"})})}();
</script>
</body>
</html>