1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
|
---
title: Date.prototype.toLocaleTimeString()
slug: Web/JavaScript/Referencia/Objetos_globales/Date/toLocaleTimeString
tags:
- Date
- Fecha
- Internacionalizacion
- JavaScript
- Method
- Prototype
- Referencia
translation_of: Web/JavaScript/Reference/Global_Objects/Date/toLocaleTimeString
---
<div>{{JSRef}}</div>
<p>El método <strong><code>toLocaleTimeString()</code></strong> devuelve una cadena con una representación de la parte del tiempo de esta fecha sensible al idioma. Los nuevos argumentos <code>locales</code> y <code>options</code> le permiten a la aplicación especificar el idioma cuyas convenciones de formato deben usarse y personalizan el comportamiento de esta función. En implementaciones antiguas que ignoran los argumentos <code>locales</code> y <code>options</code> la localidad usada y la forma de la cadena devuelta son completamente dependientes de la implementación.</p>
<div>{{EmbedInteractiveExample("pages/js/date-tolocaletimestring.html")}}</div>
<h2 id="Sintaxis">Sintaxis</h2>
<pre class="syntaxbox"><code><var>dateObj</var>.toLocaleTimeString([<var>locales[, </var><var>options</var>]])</code></pre>
<h3 id="Parámetros">Parámetros</h3>
<p>Los argumentos <code>locales</code> y <code>options</code> personalizan el comportamiento de la función y le permiten a la aplicación especificar el idioma cuyas convenciones de formato deben usarse. En las implementaciones que ignoran los argumentos <code>locales</code> y <code>options</code>, la localidad y la forma de la cadena devuelta son dependientes por completo de la implementación.</p>
<p>Vea el <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat/DateTimeFormat">constructor <code>Intl.DateTimeFormat()</code></a> para los detalles de estos parámetros y sobre cómo usarlos.</p>
<p>El valor predeterminado de cada componente de fecha-hora es {{jsxref("undefined")}}, pero si las propiedades <code>weekday</code>, <code>year</code>, <code>month</code> y <code>day</code> son todas {{jsxref("undefined")}}, entonces <code>year</code>, <code>month</code> y <code>day</code> se asumen como <code>"numeric"</code>.</p>
<h3 id="Valor_devuelto">Valor devuelto</h3>
<p>Una cadena representando la porción de tiempo de la instancia {{jsxref("Global_Objects/Date", "Date")}} dada, conforme a las convenciones específicas del idioma.</p>
<h2 id="Ejemplos">Ejemplos</h2>
<h3 id="Usando_toLocaleTimeString">Usando <code>toLocaleTimeString()</code></h3>
<p>En el uso básico sin especificar una localidad, una cadena con formato en la localidad y opciones predeterminadas es devuelta.</p>
<pre class="brush: js">var fecha = new Date(Date.UTC(2012, 11, 12, 3, 0, 0));
// toLocaleTimeString() sin argumentos depende de la implementación,
// la localidad y la zona horaria predeterminadas
console.log(date.toLocaleTimeString());
// → "21:00:00" si se ejecuta en la localidad es-MX con la zona horaria America/Mexico_City
</pre>
<h3 id="Verificando_el_soporte_de_argumentos_locales_y_options">Verificando el soporte de argumentos <code>locales</code> y <code>options</code></h3>
<p>Los argumentos <code>locales</code> y <code>options</code> aún no están soportados en todos los navegadores. Para verificar si alguna implementación ya los soporta, puede usar el requerimiento de que etiquetas inválidas son rechazadas con una excepción {{jsxref("RangeError")}}:</p>
<pre class="brush: js">function toLocaleTimeStringSoportaLocales() {
try {
new Date().toLocaleTimeString('i');
} catch (e) {
return e.name === 'RangeError';
}
return false;
}
</pre>
<h3 id="Usando_locales">Usando <code>locales</code></h3>
<p>Este ejemplo muestra una de las variaciones en formatos de tiempo localizados. Para obtener el formato del idioma usado en la interfaz de su aplicación, asegúrese de especificar ese idioma (y posiblemente algunos de <em>fallback</em>) usando el argumento <code>locales</code>:</p>
<pre class="brush: js">var fecha = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
// los siguientes formatos asumen la zona horaria de la localidad;
// America/Los_Angeles para los EEUU
// El inglés americano usa formato de 12 horas con AM/PM
console.log(fecha.toLocaleTimeString('en-US'));
// → "7:00:00 PM"
// El inglés británico usa formato de 24 horas sin AM/PM
console.log(date.toLocaleTimeString('en-GB'));
// → "03:00:00"
// El koreano usa formato de 12 horas con AM/PM
console.log(date.toLocaleTimeString('ko-KR'));
// → "오후 12:00:00"
// En muchos países donde hablan árabe se usan dígitos árabes
console.log(date.toLocaleTimeString('ar-EG'));
// → "<span dir="rtl">٧:٠٠:٠٠ م</span>"
// cuando se pide un idioma que puede no estar disponible, como
// balinés, incluya un idioma de respaldo, como en este caso, indonesio
console.log(date.toLocaleTimeString(['ban', 'id']));
// → "11.00.00"
</pre>
<h3 id="Usando_options">Usando <code>options</code></h3>
<p>Los resultados provistos por <code>toLocaleTimeString()</code> pueden ser personalizados usando el argumento <code>options</code>:</p>
<pre class="brush: js">var fecha = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
// una aplicación puede querer usar UTC y visibilizarlo:
var options = { timeZone: 'UTC', timeZoneName: 'short' };
console.log(date.toLocaleTimeString('en-US', options));
// → "3:00:00 AM GMT"
// algunas veces incluso en EEUU necesitan el tiempo en 24 horas
console.log(date.toLocaleTimeString('en-US', { hour12: false }));
// → "19:00:00"
// mostrar únicamente horas y minutos, use options con la localidad predeterminada - usar un arreglo vacío
console.log(date.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }));
// → "20:01"
</pre>
<h2 id="Rendimiento">Rendimiento</h2>
<p>Cuando se da formato a un gran número de fechas, es mejor crear un objeto {{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}} y usar su método {{jsxref("DateTimeFormat.prototype.format", "format")}}.</p>
<h2 id="Especificaciones">Especificaciones</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Specification</th>
</tr>
<tr>
<td>{{SpecName('ESDraft', '#sec-date.prototype.tolocaletimestring', 'Date.prototype.toLocaleTimeString')}}</td>
</tr>
<tr>
<td>{{SpecName('ES Int Draft', '#sup-date.prototype.tolocaletimestring', 'Date.prototype.toLocaleTimeString')}}</td>
</tr>
</tbody>
</table>
<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
<p>{{Compat("javascript.builtins.Date.toLocaleTimeString")}}</p>
<h2 id="Ver_también">Ver también</h2>
<ul>
<li>{{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}}</li>
<li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li>
<li>{{jsxref("Date.prototype.toLocaleString()")}}</li>
<li>{{jsxref("Date.prototype.toTimeString()")}}</li>
<li>{{jsxref("Date.prototype.toString()")}}</li>
</ul>
|
