arraysJS

<!DOCTYPE html>
<html lang="en">
<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>Probando JavaScript</title>
</head>
<body>
    <h2>Prueba de arrays</h2>
    <p id="prueba"></p>
    <p id="longitud"></p>
    <p id="orden"></p>
    <p id="ultimo"></p>
    <p id="borrado_ult"></p>
    <p id="agregado_fin"></p>
    <p id="borrado_prim"></p>
    <p id="agregado_prim"></p>

    <br><br>
    <h2>Pruebas de objetos</h2>
    <p id="objetos"></p>
    <p id="apellido"></p>
    <p id="nombre"></p>
    <p id="hijes"></p>
    <p id="hijes2"></p>
    <p id="hijes3"></p>

    <script>

        /*
        Arreglo: variable que puede contener màs de un valor de diferente tipo
        Hay dos formas de declarar un arreglo
        a) var arreglo = ["Ana", 15.2, 20, "Jose"]
        b) var arreglo = new Array("Ana", 15.2, 20, "Jose")

        var arreglo1 = [1, 15.2, 20, "Jose"];
        var arreglo2 = new Array("Victor", 15.2, 20, "Jose");
        alert(arreglo1);
        alert(arreglo2);
        alert("El primer elemento de arreglo1 es " + arreglo1[0]);

        // modifico un elemento de un array
        arreglo2[1] = "hola";
        alert(arreglo2);
        */
        // Objetos: es similar a un diccionario de python: contiene propiedades y valor
        // var alumno = {nombre:"Alan", apellido:"Perez", edad:24}


        var autos = ["VW","Ford","Fiat","Renault"];
        var alumno = {nombre:"Alan", apellido:"Perez", edad:24};
        var hijos = ["Juan", "Roberto", "Pedro"];
        var hijas = ["Andrea", "Emma"];
        // creo una nueva lista concatenando dos
        var hijes = hijas.concat(hijos)
        // Ej de como concatenar varias listas
        // var lista = lista1.concat(lista2, lista3, lista4, etc)


        //

        document.getElementById("prueba").innerHTML = "["+ autos + "]";
        document.getElementById("longitud").innerHTML = "La longitud del array es " + autos.length;
        document.getElementById("orden").innerHTML = "Array ordenado = [" + autos.sort() + "]";
        document.getElementById("ultimo").innerHTML = "Último elemento = " + autos[autos.length-1];
        autos.pop();
        document.getElementById("borrado_ult").innerHTML = "Borramos el último elemento: " + autos;
        autos.push("Saab");
        document.getElementById("agregado_fin").innerHTML = "Agregamos otro elemento al final: " + autos;
        autos.shift();
        document.getElementById("borrado_prim").innerHTML = "Borramos el primer elemento: " + autos;
        autos.unshift("Chevrolet");
        document.getElementById("agregado_prim").innerHTML = "Agregamos otro elemento al principio: " + autos;

        // el método splice modifica más de un item
        // array.splice(a,b,c,d)
        // a indica la posición donde se añade un nuevo elemento
        // b indica la cantidad de elementos a remover
        // lista = ["Ana","Tito","Juan","Elsa","Victor"]
        // lista.splice(1,3,"x","y","z")   esto arroja ["Ana", "x", "y", "z", "Victor"]
        // Borro elementos con splice:
        // lista.splice(1,3) esto arroja ["Ana","Victor"]
        // Agrego un nombre a la lista entre Ana y Victor
        // lista.splice(1,"")


        document.getElementById("objetos").innerHTML = alumno; // devuelve object Object
        document.getElementById("apellido").innerHTML = "El apellido del alumno es " + alumno.apellido;
        document.getElementById("nombre").innerHTML = "Y su nombre " + alumno["nombre"];
        document.getElementById("hijes").innerHTML = "Mis hijxs: " + hijes;
        hijes.splice(1,"Emma","Victor"); // arroja Andrea,Victor,Emma,Juan,Roberto,Pedro
        // agrego Karen entre Juan y Roberto
        //hijes.splice(4,"Roberto","Karen");
        hijes.splice(4,0,"Karen"); // Andrea,Victor,Emma,Juan,Karen,Roberto,Pedro

        // slice es un metodo que rebana un array
        // lista.slice(a,b) rebana los elemntos entre los indices a y b-1
        // lista.slice(a) rebana desde a hasta el final
        var rebanada = hijes.slice(2,5); // rebana Emma,Juan,Karen,
        document.getElementById("hijes2").innerHTML = "Mis hijxs preferides: " + rebanada;
        // para mostrar solo los dos últimos hijos:
        var rebanada2 = hijes.slice(5) // rebana Roberto, Pedro
        document.getElementById("hijes3").innerHTML = "Mis dos ultimos hijxs: " + rebanada2;

    </script>

</body>
</html>