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>  <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="">Категорія</h2>
                        <div class="content">
                            <ul class="list-unstyled">
                                <li> <a href="/list/">Список</a> </li><li> <a href="/converter-tools/">Інструменти Конвертера</a> </li><li> <a href="/c-loops-control-statements/">C-Цикли Та Оператори Керування</a> </li><li> <a href="/maths-class-9-cat/">Математика-Клас-9</a> </li><li> <a href="/dbms-tutorial/">Підручник По Субд</a> </li><li> <a href="/python-json/">Python-Json</a> </li><li> <a href="/pyspark-tutorial/">Підручник Pyspark</a> </li><li> <a href="/physics-calculators/">Фізичні Калькулятори</a> </li><li> <a href="/python-built-functions/">Вбудовані Функції Python</a> </li><li> <a href="/physics-class-10-cat/">Фізика-Клас-10</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">Діапазон float у python</h2>
                        <div class="content">
                            <div class="item">
                                 <blockquote class="quote">                                  
                                    <span> <i class="fa fa-quote-left"></i> Діапазон float у Python із підручником, tkinter, кнопкою, оглядом, полотном, рамкою, налаштуваннями середовища, першою програмою python тощо.</span>
                                </blockquote>                
                                                                                             
                            </div><!--//item-->
                            
                            <p> <a class="more-link" href="/range-float-python"> <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="/java-switch-statement">Java Switch Statement</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/how-use-between-sql">Як використовувати BETWEEN у SQL</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/7-aquarius-traits-you-need-know-131196">7 рис Водолія, які вам потрібно знати</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/calculate-standard-error-r">Обчисліть стандартну похибку в R</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/palindrome-program-java">Програма Palindrome на Java</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="/latex-partial-derivative">часткова диференціація в латексі</a>
</li><li><a href="/rani-mukerji">індійська актриса рані мукерджі</a>
</li><li><a href="/typescript-map">карта машинописом</a>
</li><li><a href="/merge-sort-algorithm">mergesort java</a>
</li><li><a href="/powershell-comments">багаторядковий коментар powershell</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="//nl.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>