logo

Wie erstelle ich ein Wörterbuch und füge Schlüssel-Wert-Paare dynamisch hinzu?

In diesem Artikel erfahren Sie, wie Sie in JavaScript ein Wörterbuch erstellen, indem Sie Objekte zum Speichern von Schlüssel-Wert-Paaren verwenden. Obwohl JavaScript über keinen integrierten Wörterbuchtyp verfügt, können wir mithilfe von JavaScript-Objekten effektiv einen erstellen. Beginnen wir mit der Erstellung eines neuen JavaScript-Objekts, das als unser Wörterbuch fungiert.

Syntax:

Java wandelt String in int um

Der Schlüssel kann eine Zeichenfolge oder eine Ganzzahl sein. Wenn Sie nur „key1“ oder eine beliebige Zahl schreiben, wird es als Zeichenfolge behandelt.



var dict = { key1 : value1 , key2 : value2 , .... };>
  • Erstellen Sie ein leeres Wörterbuch
    var dict = {};>
  • Hinzufügen von Schlüssel-Wert-Paaren im Wörterbuch
    dict[new_key] = new_value;>
    oder Wenn „new_key“ bereits im Wörterbuch vorhanden ist, wird der Wert auf „new_value“ aktualisiert.
    dict.new_key = new_value;>
  • Auf Schlüssel-Wert-Paare zugreifen
    var value = dict[key];>
    oder
    var value = dict.key;>
  • Das gesamte Wörterbuch iterieren
    for(var key in dict) { console.log(key + ' : ' + dict[key]); }>

Beispiel:

alphabetische Zahl
HTML
   Wörterbuch in JavascriptTitel> Kopf> <body style='text-align: center;'> <h1 style='color: green;'>techcodeview.com h1><p>var dict = { <br />'Geek': 1, <br />'für 2', <br />'Geeks': 3.5 <br />}; <br />p> <button onClick='fun()'>Schaltfläche „Neue Schlüssel-Wert-Paare hinzufügen“><p id='demo'>p><script>function fun() { var dict = { geek: 1, for: '2', geeks: 3.5, };  dict.new_geeks = 'new_value';  dict['another_new_geeks'] = 'another_value';  var to_show = 'var dict = { ';  for (var key in dict) { to_show += ''' + key + '' : ' + dict[key] + ' ';  } to_show += ' }; ';  document.getElementById('demo') .innerHTML = to_show;  } script> body> html>></pre> </code> <p dir='ltr'>  <b>  <strong>Ausgabe:</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="">Kategorie</h2>
                        <div class="content">
                            <ul class="list-unstyled">
                                <li> <a href="/quotes/">Zitate</a> </li><li> <a href="/roman-numerals/">Römische Zahlen</a> </li><li> <a href="/terms-of-use/">Nutzungsbedingungen</a> </li><li> <a href="/artificial-neural-network/">Künstliche Neuronale Netz</a> </li><li> <a href="/maths-class-11-cat/">Mathe-Klasse-11</a> </li><li> <a href="/c-functions/">C-Funktionen</a> </li><li> <a href="/python-time-module/">Python-Zeitmodul</a> </li><li> <a href="/english-difference-between/">Englisch-Unterschied-Zwischen</a> </li><li> <a href="/coa-tutorial/">Coa-Tutorial</a> </li><li> <a href="/linux-man-pages/">Linux-Manpages</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">10 Personifizierungsbeispiele in Poesie, Literatur und mehr</h2>
                        <div class="content">
                            <div class="item">
                                 <blockquote class="quote">                                  
                                    <span> <i class="fa fa-quote-left"></i> Was ist Personifizierung? Schauen Sie sich unsere hilfreichen Personifizierungsbeispiele an, um dieses literarische Mittel zu verstehen.</span>
                                </blockquote>                
                                                                                             
                            </div><!--//item-->
                            
                            <p> <a class="more-link" href="/10-personification-examples-poetry-131562"> <i class="fa fa-external-link"></i> Weiterlesen</a> </p> 
                            
                        </div><!--//content-->
                    </div><!--//section-inner-->
                </aside><!--//section-->
                
               
                            
                 <aside class="languages aside section">
                    <div class="section-inner">
                        <h2 class="heading">Interessante Artikel</h2>
                        <div class="content">
                            <ul class="list-unstyled">
                                <li class="item">
                                    <span class="title"> <strong> <a href="/himanshi-khurana">Himanshi Khurana</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/cm-mm-converter">cm-zu-mm-Konverter</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/cpp-multithreading/">Cpp-Multithreading</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/advantages-disadvantages-coal">Vor- und Nachteile von Kohle</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/half-angle-formulas">Halbwinkelformeln</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">Beliebte Beiträge</h2>
                        <div class="content">
                            <ul class="list"> <li><a href="/how-center-images-css">wie man ein Bild in CSS zentriert</a>
</li><li><a href="/java-string-format">String-Formatierer</a>
</li><li><a href="/binary-search-algorithm">binärer Suchalgorithmus</a>
</li><li><a href="/what-is-0-0625-fraction">0,0625 als Bruch</a>
</li><li><a href="/add-elements-array-java">Zu einem Array Java hinzufügen</a>
</li><li><a href="/java-simpledateformat">Formatieren Sie ein Datum in Java</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 Alle Rechte Vorbehalten |  <a href="//ro.techcodeview.com/">techcodeview.com</a> | <a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Haftungsausschluss</a>  |  <a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">Über Uns</a>  |  <a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Datenschutzrichtlinie</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>