Este artículo le enseñará cómo crear un diccionario en JavaScript utilizando objetos para almacenar pares clave-valor. Aunque JavaScript no tiene un tipo de diccionario incorporado, podemos crear uno de manera efectiva usando objetos JavaScript. Comencemos creando un nuevo objeto JavaScript para que actúe como nuestro diccionario.
Sintaxis:
La clave puede ser una cadena, un número entero. Si simplemente escribe la clave1 o cualquier número, se tratará como una cadena.
var dict = { key1 : value1 , key2 : value2 , .... };>- Crear diccionario vacío
var dict = {};> - Agregar pares clave-valor en el diccionario
dict[new_key] = new_value;>
O si new_key ya está presente en el diccionario, entonces el valor de esto se actualizará a new_value.dict.new_key = new_value;>
- Acceso a pares clave-valor
var value = dict[key];>
ovar value = dict.key;>
- Iterando todo el diccionario
for(var key in dict) { console.log(key + ' : ' + dict[key]); }>
Ejemplo:
HTML Diccionario en Javascripttítulo>cabeza> <body style='text-align: center;'> <h1 style='color: green;'>techcodeview.com h1><p>vardict = { <br />'geek' : 1 , <br />'para 2', <br />'geeks' : 3.5 <br />}; <br />p> <button onClick='fun()'>Botón Agregar nuevos pares clave-valor><p id='demo'>p><script>función divertida() { var dict = { geek: 1, para: '2', geeks: 3.5, }; dict.new_geeks = 'nuevo_valor'; dict['otro_nuevo_geeks'] = 'otro_valor'; var to_show = 'var dict = { '; for (var clave en dict) { to_show += ''' + clave + '' : ' + dict[clave] + ' '; } to_show += ' }; '; document.getElementById('demo') .innerHTML = to_show; } script> cuerpo> html>></pre> </code> <p dir='ltr'> <b> <strong>Producción:</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="">Categoría</h2>
<div class="content">
<ul class="list-unstyled">
<li> <a href="/python-library/">Biblioteca Python</a> </li><li> <a href="/python-sorting-exercises/">Ejercicios-De-Clasificación De Python</a> </li><li> <a href="/c-inheritance/">C++-Herencia</a> </li><li> <a href="/top-10-list-world/">Lista De Los 10 Mejores - Mundo</a> </li><li> <a href="/angular-material/">Materiales Angulares</a> </li><li> <a href="/english-blogs/">Blogs En Inglés</a> </li><li> <a href="/cricket/">Grillo</a> </li><li> <a href="/html-basics/">Conceptos Básicos De Html</a> </li><li> <a href="/node-js-fs-module/">Módulo Node.js-Fs</a> </li><li> <a href="/cpu-scheduling/">Programación-De-Cpu</a> </li>
</ul>
</div><!--//content-->
</div><!--//section-inner-->
</aside><!--//aside-->
<aside class="testimonials aside section">
<div class="section-inner">
<h2 class="heading">¿Qué es la barra de herramientas de formato?</h2>
<div class="content">
<div class="item">
<blockquote class="quote">
<span> <i class="fa fa-quote-left"></i> ¿Qué es la barra de herramientas de formato con explicación del dispositivo de entrada, dispositivo de salida, memoria, CPU, placa base, red informática, virus, software, hardware, etc.?</span>
</blockquote>
</div><!--//item-->
<p> <a class="more-link" href="/what-is-formatting-toolbar"> <i class="fa fa-external-link"></i> Leer Más</a> </p>
</div><!--//content-->
</div><!--//section-inner-->
</aside><!--//section-->
<aside class="languages aside section">
<div class="section-inner">
<h2 class="heading">Artículos De Interés</h2>
<div class="content">
<ul class="list-unstyled">
<li class="item">
<span class="title"> <strong> <a href="/list-arab-countries">Lista de países árabes</a> </strong> </span>
</li><!--//item--><li class="item">
<span class="title"> <strong> <a href="/10-best-liveleak-alternatives-2024">Las 10 mejores alternativas de Liveleak 2024</a> </strong> </span>
</li><!--//item--><li class="item">
<span class="title"> <strong> <a href="/ounces-grams-converter">Convertidor de onzas a gramos</a> </strong> </span>
</li><!--//item--><li class="item">
<span class="title"> <strong> <a href="/invocationtargetexception">Excepción de invocación de objetivos</a> </strong> </span>
</li><!--//item--><li class="item">
<span class="title"> <strong> <a href="/numpy-zeros-python">numpy.zeros() en Python</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">Entradas Populares</h2>
<div class="content">
<ul class="list"> <li><a href="/an-array-strings-c">matriz de cadenas del programa c</a>
</li><li><a href="/postgresql-drop-column">cómo eliminar una columna en postgresql</a>
</li><li><a href="/javascript-window-open-method">ventana javascript.abierta</a>
</li><li><a href="/java-string-replace">reemplazar la cadena en java</a>
</li><li><a href="/how-call-javascript-function-html">función de llamada javascript desde html</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 Todos Los Derechos Reservados | <a href="//pl.techcodeview.com/">techcodeview.com</a> | <a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Descargo De Responsabilidad</a> | <a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">Acerca De Nosotros</a> | <a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Política De Privacidad</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>