Editor - PHP

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <title>Funciones en JS — Ejemplo 2</title>
    <style>
        body  { font-family: Arial, sans-serif; padding: 20px; background: #fff; max-width: 650px; }
        h3    { margin: 20px 0 8px; font-size: 15px; color: #333; }
        table { border-collapse: collapse; width: 100%; margin-bottom: 14px; }
        th    { background: #F7DF1E; color: #333; padding: 8px 12px; text-align: left; font-size: 13px; }
        td    { padding: 8px 12px; border-bottom: 1px solid #eee; font-size: 13px; font-family: monospace; }
        .bloque { background: #f9f9f9; border-left: 4px solid #F7DF1E; padding: 10px 14px; margin: 8px 0; border-radius: 0 6px 6px 0; font-size: 14px; }
        .label  { font-size: 11px; color: #888; font-weight: bold; margin-bottom: 4px; text-transform: uppercase; }
    </style>
</head>
<body>

<h2>Funciones — Parámetros</h2>

<h3>Valores por defecto</h3>
  <table id="tabla-default"></table>

<h3>Parámetro rest — cantidad variable de argumentos</h3>
  <table id="tabla-rest"></table>

<h3>Objeto como parámetro — patrón options</h3>
  <table id="tabla-obj"></table>

<h3>Spread al llamar una función</h3>
  <div class="bloque"><div class="label">...array como argumentos</div><div id="r-spread"></div></div>

// ── Valores por defecto ───────────────────────────────────────────────
    function saludar(nombre = "visitante", saludo = "Hola", signo = "!") {
        return `${saludo}, ${nombre}${signo}`;
    }

function crearUsuario(nombre, rol = "alumno", activo = true) {
        return `${nombre} | rol: ${rol} | activo: ${activo}`;
    }

// ── Rest ──────────────────────────────────────────────────────────────
    function sumarTodos(...numeros) {
        let total = 0;
        for (const n of numeros) total += n;
        return total;
    }

function unirTextos(separador, ...textos) {
        return textos.join(separador);
    }

function mayor(...numeros) {
        let max = numeros[0];
        for (const n of numeros) {
            if (n > max) max = n;
        }
        return max;
    }

// ── Objeto como parámetro ─────────────────────────────────────────────
    function crearProducto({ nombre, precio, stock = 0, categoria = "general" }) {
        return `${nombre} | $${precio} | stock: ${stock} | cat: ${categoria}`;
    }

function formatearDinero({ monto, moneda = "ARS", decimales = 2 }) {
        return `${moneda} ${monto.toFixed(decimales)}`;
    }

// ── Spread al llamar ──────────────────────────────────────────────────
    function sumar3(a, b, c) {
        return a + b + c;
    }

const nums = [10, 20, 30];
    const resultSpread = sumar3(...nums);

const numeros = [5, 1, 8, 3, 9, 2];
    const maxVal  = Math.max(...numeros);
    const minVal  = Math.min(...numeros);

document.getElementById("r-spread").innerHTML =
        `sumar3(...[${nums}]) = <strong>${resultSpread}</strong><br>` +
        `Math.max(...[${numeros}]) = <strong>${maxVal}</strong><br>` +
        `Math.min(...[${numeros}]) = <strong>${minVal}</strong>`;
  </script>

</body>
</html>