1

En el código pretendo usar los métodos .replace() y .toUpperCase() simultáneamente en el mismo párrafo. Si lo intento hacer en una misma función, solo me acepta el primer método. Al comentar .toUpperCase(), .replace() se activa; pero en ningún caso actúan ambos.

Alternativamente, he creado una segunda función mySecondFunction, a la que asigno otra variable text2 y que debería afectar al mismo párrafo mediante id="demo2", sin embargo esta segunda función no efectúa ningún cambio sobre el párrafo.

Me surgen dos dudas:

  1. ¿Es correcto que una función ejecute dos acciones? En caso afirmativo, ¿cómo proceder en este caso concreto?
  2. Asumiendo que para cada acción sea necesario una función nueva, ¿cómo hacer que la segunda función actúe?
  • Aclaración: En VSCode no aparece el error generado al ejecutar el código desde Stackoverflow.

<script>
function myFunction() {
  let text = document.getElementById("demo").innerHTML;
  document.getElementById("demo").innerHTML =
  //text.toUpperCase();
  text.replace("Hello","World");
}

function mySecondFunction() {
  let text2 = document.getElementById("demo2").innerHTML;
  document.getElementById("demo2").innerHTML =
  text2.toUpperCase();
}

</script>
<!DOCTYPE html>
<html>
<body>

<h2>JavaScript String Methods</h2>
<p>Convert string to upper case:</p>

<button onclick="myFunction()">Try it</button>

<p id="demo" id="demo2">Hello World!</p>

</body>
</html>

3
  • 1
    Puedes crear una tercera función que anide las dos anteriores.
    – OscarR
    Commented el 8 ene. 2022 a las 12:24
  • Nunca he anidado funciones… lo pruebo y lo comparto. Muchas gracias ;) Commented el 8 ene. 2022 a las 12:40
  • 1
    He añadido un ejemplo, la cuestión básica es hacer que le llegue cada cambio a la función correspondiente y el resultado final llevarlo al html.
    – OscarR
    Commented el 8 ene. 2022 a las 12:46

1 respuesta 1

1

Sobre el punto 1, no tiene respuesta única. Dependerá de muchos factores elegir si se ejecutan una, dos o mas acciones dentro de una función. Sobre la forma de proceder igual, según requerimientos y según el que esté delante del teclado optará por usar una u otra opción.

Sobre le punto dos, tienes la opción que he comentado en la pregunta. Una función controla las otras dos acciones. Tambien tienes la opción encadenarlas la primera a la segunda, pero eso ya es cuestión de nuevo de gustos. Pongo un ejemplo:

function textReplace(text) {
  return text.replace("Hello", "World");
}

function textUpperCase(text) {
  return text.toUpperCase();
}

function replaceAndUpperCase() {
  let text = document.getElementById("demo");
  let replace = textReplace(text.innerHTML);
  let uppercase = textUpperCase(replace);
  text.innerHTML = uppercase;
}
<html>
  <body>
    <h2>JavaScript String Methods</h2>
    <p>Convert string to upper case:</p>
    <button onclick="replaceAndUpperCase()">Try it</button>
    <p id="demo">Hello World!</p>
  </body>
</html>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.