No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Curso de PHP: Integración con HTML

Curso de PHP: Integración con HTML

Carlos Eduardo Gómez García

Carlos Eduardo Gómez García

¿Cómo pasar variables de PHP a JavaScript?

7/24
Recursos

Aportes 29

Preguntas 4

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

Esta clase resume mis ultimos 3 meses haciendo experimentos raros para comunicar php con js =’)

No se me había ocurrido hacer algo así pero que bueno que lo vimos ya que puede ser útil en determinado momento como bien lo dices para obtener un dato que es requerido de esta forma.
Pero si, hay que tener cuidado de no usarlo mucho por que en el cliente se puede ver el dato obtenido desde Js y este puede ser editado directamente desde la la consola en caso lo hayamos guardado en una variable.
.
Código empleado:

<?php
  // Creación de variables
  $personas = [
    [
      'id' => 0,
      'username' => "Joel",
    ],
    [
      'id' => 1,
      'username' => "Julieta",
    ],
    [
      'id' => 2,
      'username' => "Pepe",
    ],
  ];

  $saludo = "¡Hey, que tal!";
?>
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>iJCode - Integración de PHP con HTML</title>
</head>
<body>
  <h1 id="saludo"></h1>

    <!-- Obteniendo variables de PHP desde Javascript -->
    <script>
      // Declarando variables
      let d = document;
      let $saludo = d.getElementById('saludo');

      // Pintando en el H1 el valor de la variable obtenida de PHP en JS
      $saludo.textContent = '<?= $saludo ?>';

      // Mostrando en consola el arreglo obtenido de PHP en JS
      let personas = '<?= json_encode($personas) ?>'; // [{"id":0,"username":"Joel"},{"id":1,"username":"Julieta"},{"id":2,"username":"Pepe"}]
      let personasJson = JSON.parse(personas);
      console.log( personasJson ); // (3) [{…}, {…}, {…}]

      // Recorriendo el arreglo obtenido para mostrar los nombres
      personasJson.forEach((el) =>{
        console.log(el.username);
      });
      /*
        Joel
        Julieta
        Pepe
      */
    //  Nota*: Se debe tener cuidado de obtener datos de PHP desde Js ya que esta información se puede leer y editar desde el navegador

    </script>
</body>
</html>

.
Resultado:

OJO! hay que colocar comillas simples, de lo contrario con las dobles comillas da error en JSON.parse();

Muy buena explicación del RetaxMaster! Muy util este video.

Para pasar variables de PHP a Javascript, bastara con imprimir la variable de PHP a la variable de Javascript, esto es completamente valido.

<?php  $number=1 ?>
<script>
let number = <?= $number ?>
</script>

El verdadero reto es pasar variables de JS para PHP, toca aprender a hacer API rest

var variable ="<?php echo $carro->name ?>"

Esta sería una forma, desconozco si entra en la categoría de las buenas prácticas.

A lo que se refiere el profesor, es al uso de AJAX

Nota de la clase, este tipo de cosas solo se debe ocupar en cierto casos.

Excelente forma de explicar!

La verdad es que nunca se me hubiese ocurrido, interesante ejercicio. Poco aplicado en la práctica profesional pero para entender conceptos y aprender experimentando es un excelente ejemplo. Además, si funciona en PHP, también lo podemos hacer con python , con java, con Go. etc. cualquier lenguaje que haga SSR.

Clasesota!

![](

retaxmaster explica muy bien.

Tiene más sentido que todas las pruebas que estaba haciendo, la última vez que trate de comunicar PHP con JS, cree uun input y al input le puse todos los valores que necesitaba … sé que fue mala idea, pero fue lo mejor que se me ocurrio

Brutal!!!. Necesitaba este curso hace años, cuando recien comenzaba a hacerme esta pregunta de pasar variables o datos de php a js.

esta clase me resuleve como 2 meses intentando pasarle datos a un grafico sin que se vea feo.

PHP se ejecuta en tiempo de carga en el servidor, para posteriormente darle el HTML ya procesado al cliente.
Mientas que Javascript despues de que la pagina ya fue cargada.

La clase que esperé durante mucho tiempo
Alguna vez tuve que investigar bastante para poder pasar variables de PHP a JS, ya que quería usar una líbreria de JS llamada Chart.js (https://www.chartjs.org/), por ende los datos deberían ser usados en esa versión del momento en JS por decirlo de alguna forma. Pero, recuerdo que fue mas complicado aprenderlo y aplicarlo a lo facíl que lo mostro en el video.
Que curso tan genial, gracias Retax

¿Cómo se le llama a esta característica de los lenguajes de programación (en este caso, PHP) que permite “dejar” una coma (",") al final sin ningún problema:

$users = array(
    array(
        "id" => 0,
        "username" => "username1",
    ),
);

Esta característica de los lenguajes de programación se llama trailing comma o coma final. Consiste en permitir que se coloque una coma después del último elemento de una lista, un arreglo, un objeto o una función, sin que esto genere un error de sintaxis. Algunos lenguajes de programación, como PHP, admiten esta característica, mientras que otros, como JavaScript, la rechazan o la limitan a ciertos casos¹.

La ventaja de usar la coma final es que facilita la adición, eliminación o reordenamiento de elementos en una lista, un arreglo, un objeto o una función, sin tener que preocuparse por agregar o quitar comas. Además, mejora la legibilidad del código y evita posibles errores al copiar y pegar².

La desventaja de usar la coma final es que puede generar confusión al leer el código, ya que puede parecer que falta un elemento después de la coma. Además, puede causar problemas de compatibilidad con algunos lenguajes o versiones que no la soportan³.

En el caso de PHP, la coma final se puede usar en arreglos desde la versión 5.4 y en listas desde la versión 7.3.

no me funciona, me da error

me tocó hacer una prueba tecnica validando un formulario hecho en php y yo tenía un archivo js con un algoritmo de verificación de modulo 11 que se llama que es para validación de unn rut chileno y todavía no se como implementarlo en el código

este es el momento que esperaba…

“json_encode” es una función de PHP que se utiliza para convertir un valor de PHP en una cadena de texto en formato JSON (JavaScript Object Notation).

<?php
  $datos = array("nombre" => "Juan", "edad" => 30);
  $json = json_encode($datos);
  // La variable $json contiene la cadena '{"nombre":"Juan","edad":30}'
?>

Luego, podemos enviar la cadena de texto en formato JSON al cliente y decodificarla en JavaScript para acceder a los valores del arreglo de PHP. Y de esta manera, podemos utilizar la información de PHP en nuestro código JavaScript.

🐘 Es importante recordar que JS se ejecuta en el navegador, porque es un lenguaje para Frontend (en este caso). Entonces PHP funciona en el Backend, donde manda la página ya procesada y estructurada al navegador.

de php a javascript

😃 me está mega gustando este curso! gracias profe!
gracias platzi!

pasar variables de PHP a JavaScript