logo

Як створити словник і динамічно додати пари ключ-значення?

Ця стаття навчить вас, як створити словник у JavaScript, використовуючи об’єкти для зберігання пар ключ-значення. Хоча JavaScript не має вбудованого типу словника, ми можемо ефективно створити його за допомогою об’єктів JavaScript. Почнемо зі створення нового об’єкта JavaScript, який буде діяти як наш словник.

рядок замінює всю java

Синтаксис:



Ключем може бути рядок, ціле число. Якщо ви просто напишете key1 або будь-яке число, це буде розглядатися як рядок.

var dict = { key1 : value1 , key2 : value2 , .... };>
  • Створити порожній словник
    var dict = {};>
  • Додавання пар ключ-значення до словника
    dict[new_key] = new_value;>
    або Якщо new_key вже присутній у словнику, тоді значення this буде оновлено до new_value.
    dict.new_key = new_value;>
  • Доступ до пар ключ-значення
    var value = dict[key];>
    або
    var value = dict.key;>
  • Ітерація всього словника
    for(var key in dict) { console.log(key + ' : ' + dict[key]); }>

приклад:

HTML
   Словник у Javascripttitle> head> <body style='text-align: center;'> <h1 style='color: green;'>techcodeview.com h1><p>var dict = { <br />'виродок' : 1 , <br />'для' : '2', <br />'гіки' : 3.5 <br />}; <br />p> <button onClick='fun()'>Кнопка «Додати нові пари «ключ-значення»><p id='demo'>p><script>функція fun() { var dict = { geek: 1, for: '2', geeks: 3.5, };  dict.new_geeks = 'нове_значення';  dict['another_new_geeks'] = 'інше_значення';  var to_show = 'var dict = { ';  for (ключ var у dict) { to_show += ''' + key + '' : ' + dict[key] + ' ';  } to_show += ' }; ';  document.getElementById('demo') .innerHTML = to_show;  } script> body> html>></pre> </code> <p dir='ltr'>  <b>  <strong>Вихід:</strong>  </b>  </p> <br /> <div id="container-4ae8242bd8e42d94c5c0bf390d5144e6"></div><br />  <img src='//techcodeview.com/img/javascript-misc/88/how-create-dictionary.webp' alt="">  <br></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="">Категорія</h2>
                        <div class="content">
                            <ul class="list-unstyled">
                                <li> <a href="/software-engineering/">Розробка Програмного Забезпечення</a> </li><li> <a href="/excel-advanced/">Excel - Advanced</a> </li><li> <a href="/java-servlet/">Java-Сервлет</a> </li><li> <a href="/cpp-data-types/">Cpp-Типи Даних</a> </li><li> <a href="/matplotlib-pyplot-class/">Matplotlib Pyplot-Клас</a> </li><li> <a href="/angular-material/">Кутовий Матеріал</a> </li><li> <a href="/24-7-innovation-labs/">Інноваційні Лабораторії 24*7</a> </li><li> <a href="/cpp-control-flow/">Cpp-Control-Flow</a> </li><li> <a href="/python-input-output/">Python-Введення-Виведення</a> </li><li> <a href="/geeks-premier-league-2022-cat/">Гікс-Прем'єр-Ліга-2022</a> </li>
                                
                            </ul>
                        </div><!--//content-->  
                    </div><!--//section-inner-->                 
                </aside><!--//aside-->
                
                 <aside class="testimonials aside section">
                   <div class="section-inner">
                        <h2 class="heading">Математика</h2>
                        <div class="content">
                            <div class="item">
                                 <blockquote class="quote">                                  
                                    <span> <i class="fa fa-quote-left"></i> Математика</span>
                                </blockquote>                
                                                                                             
                            </div><!--//item-->
                            
                            <p> <a class="more-link" href="/maths/"> <i class="fa fa-external-link"></i> Читати Далі</a> </p> 
                            
                        </div><!--//content-->
                    </div><!--//section-inner-->
                </aside><!--//section-->
                
               
                            
                 <aside class="languages aside section">
                    <div class="section-inner">
                        <h2 class="heading">Цікаві Статті</h2>
                        <div class="content">
                            <ul class="list-unstyled">
                                <li class="item">
                                    <span class="title"> <strong> <a href="/should-i-take-ap-calculus-ab-131998">Чи варто приймати AP Calculus AB чи AP Calculus BC?</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/what-is-10-11th-power">Скільки дорівнює 10 в 11-му степені?</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/java-json">Java JSON</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/es6-tutorial/">Підручник Es6</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/basics-file-handling-c">Основи обробки файлів у C</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">Популярні Пости</h2>
                        <div class="content">
                            <ul class="list"> <li><a href="/c-bitwise-xor-operator">xor c++</a>
</li><li><a href="/mkdir-command-linux-unix-with-examples">Команди Linux створити папку</a>
</li><li><a href="/objects-classes-java">об'єкт у програмуванні на Java</a>
</li><li><a href="/cathode-ray-tube">монітор з електронно-променевою трубкою</a>
</li><li><a href="/when-did-windows-7-come-out">коли вийшла win 7</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 Всі Права Захищені |  <a href="//de.techcodeview.com/">techcodeview.com</a> | <a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Відмова Від Відповідальності</a>  |  <a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">Про Нас</a>  |  <a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Політика Конфіденційності</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>
	
</body>
</html>