154 lines
7.4 KiB
Markdown
154 lines
7.4 KiB
Markdown
|
---
|
||
|
|
title: Convert HTML Entities
|
||
|
|
localeTitle: Convertir entidades HTML
|
||
|
|
---
|
||
|
|
|
||
|
|
|
||
|
|
 Recuerda usar **`Read-Search-Ask`** si te atascas. Tratar de emparejar el programa  y escribe tu propio código 
|
||
|
|
|
||
|
|
###  Explicación del problema:
|
||
|
|
|
||
|
|
* Debe crear un programa que convierta las entidades HTML de una cadena a sus entidades HTML correspondientes. Solo hay unos pocos para que puedas usar diferentes métodos.
|
||
|
|
|
||
|
|
##  Sugerencia: 1
|
||
|
|
|
||
|
|
* Puedes usar expresiones regulares, pero en este caso no lo hice.
|
||
|
|
|
||
|
|
> _intenta resolver el problema ahora_
|
||
|
|
|
||
|
|
##  Sugerencia: 2
|
||
|
|
|
||
|
|
* Usted se beneficiará de un gráfico con todas las entidades html para que sepa cuáles son las correctas para colocar.
|
||
|
|
|
||
|
|
> _intenta resolver el problema ahora_
|
||
|
|
|
||
|
|
##  Sugerencia: 3
|
||
|
|
|
||
|
|
* Debe separar la cadena y trabajar con cada carácter para convertir los correctos y luego unir todo de nuevo.
|
||
|
|
|
||
|
|
> _intenta resolver el problema ahora_
|
||
|
|
|
||
|
|
## ¡Alerta de spoiler!
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
**¡Solución por delante!**
|
||
|
|
|
||
|
|
##  Solución de código básico:
|
||
|
|
|
||
|
|
```javascript
|
||
|
|
function convertHTML(str) {
|
||
|
|
// Split by character to avoid problems.
|
||
|
|
|
||
|
|
var temp = str.split('');
|
||
|
|
|
||
|
|
// Since we are only checking for a few HTML elements I used a switch
|
||
|
|
|
||
|
|
for (var i = 0; i < temp.length; i++) {
|
||
|
|
switch (temp[i]) {
|
||
|
|
case '<':
|
||
|
|
temp[i] = '<';
|
||
|
|
break;
|
||
|
|
case '&':
|
||
|
|
temp[i] = '&';
|
||
|
|
break;
|
||
|
|
case '>':
|
||
|
|
temp[i] = '>';
|
||
|
|
break;
|
||
|
|
case '"':
|
||
|
|
temp[i] = '"';
|
||
|
|
break;
|
||
|
|
case "'":
|
||
|
|
temp[i] = "'";
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
temp = temp.join('');
|
||
|
|
return temp;
|
||
|
|
}
|
||
|
|
|
||
|
|
//test here
|
||
|
|
convertHTML("Dolce & Gabbana");
|
||
|
|
```
|
||
|
|
|
||
|
|
### Explicación del código:
|
||
|
|
|
||
|
|
Explica la solución aquí y agrega cualquier enlace relevante.
|
||
|
|
|
||
|
|
#### Enlaces relevantes
|
||
|
|
|
||
|
|
* [str.split ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
|
||
|
|
* [arr.join ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
|
||
|
|
* [declaración de cambio](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/switch)
|
||
|
|
|
||
|
|
 [Ejecutar código](https://repl.it/CLnP/0)
|
||
|
|
|
||
|
|
##  Solución de código intermedio:
|
||
|
|
```
|
||
|
|
function convertHTML(str) {
|
||
|
|
//Chaining of replace method with different arguments
|
||
|
|
str = str.replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>').replace(/"/g,'"').replace(/'/g,"'");
|
||
|
|
return str;
|
||
|
|
}
|
||
|
|
|
||
|
|
// test here
|
||
|
|
convertHTML("Dolce & Gabbana");
|
||
|
|
```
|
||
|
|
|
||
|
|
 [Ejecutar código](https://repl.it/CLnQ/0)
|
||
|
|
|
||
|
|
### Explicación del código:
|
||
|
|
|
||
|
|
Explica la solución aquí y agrega cualquier enlace relevante.
|
||
|
|
|
||
|
|
#### Enlaces relevantes
|
||
|
|
|
||
|
|
* [str.replace ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace)
|
||
|
|
* [Expresiones regulares](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp)
|
||
|
|
|
||
|
|
##  Solución avanzada de código:
|
||
|
|
|
||
|
|
```javascript
|
||
|
|
function convertHTML(str) {
|
||
|
|
// Use Object Lookup to declare as many HTML entities as needed.
|
||
|
|
htmlEntities={
|
||
|
|
'&':'&',
|
||
|
|
'<':'<',
|
||
|
|
'>':'>',
|
||
|
|
'"':'"',
|
||
|
|
'\'':"'"
|
||
|
|
};
|
||
|
|
//Use map function to return a filtered str with all entities changed automatically.
|
||
|
|
return str.split('').map(entity => htmlEntities[entity] || entity).join('');
|
||
|
|
}
|
||
|
|
|
||
|
|
// test here
|
||
|
|
convertHTML("Dolce & Gabbana");
|
||
|
|
```
|
||
|
|
|
||
|
|
 [Ejecutar código](https://repl.it/CLnR/0)
|
||
|
|
|
||
|
|
### Explicación del código:
|
||
|
|
|
||
|
|
* Cree un objeto para usar la funcionalidad de búsqueda para encontrar fácilmente los caracteres.
|
||
|
|
* Divida la cadena original por caracteres y use el mapa para verificar la entidad html modificada o use la misma. Alternativamente, puede usar Regex `str.replace(/&|<|>|"|'/gi` .
|
||
|
|
* Se agrega la función a, que es lo que devuelve la entidad convertida o la original si no hay conversión. Si sigues la ruta regular, solo tienes que devolver los hits emparejados. `return html[entity];`
|
||
|
|
* Por último nos unimos a todos los personajes una vez más.
|
||
|
|
|
||
|
|
**Tenga en cuenta** que si tomó la ruta de expresiones regulares, entonces no necesita unirse a nada, solo asegúrese de devolver toda la operación o de guardarla en una variable y luego devolverla.
|
||
|
|
|
||
|
|
#### Enlaces relevantes
|
||
|
|
|
||
|
|
* [str.split ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
|
||
|
|
* [arr.map ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
|
||
|
|
* [arr.join ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
|
||
|
|
|
||
|
|
##  NOTAS PARA LAS CONTRIBUCIONES:
|
||
|
|
|
||
|
|
*  **NO** agregue soluciones que sean similares a las soluciones existentes. Si cree que es **_similar pero mejor_** , intente fusionar (o reemplazar) la solución similar existente.
|
||
|
|
* Agregue una explicación de su solución.
|
||
|
|
* Categorice la solución en una de las siguientes categorías: **Básica** , **Intermedia** y **Avanzada** . 
|
||
|
|
* Agregue su nombre de usuario solo si ha agregado algún **contenido principal relevante** . (  **_NO_** _elimine ningún nombre de usuario existente_ )
|
||
|
|
|
||
|
|
> Ver  [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referencia.
|