Skip to main content

Categoría: Javascript

Cómo eliminar un elemento de un array en Javascript

tecnicoweb 38.470 Comentarios

Para borrar un elemento de un array en Javascript sin saber su posición, habría que primero buscar la posición y después aplicar la función split.

var nombres = ["Jose","Pepe","Carlos"];
var posicion = nombres.indexOf("Pepe");

if (posicion > -1) {
   nombres.splice(posicion, 1);
}

[array].indexOf(valor) obtenemos la posición el array, hacemos un if para comprobar de que existe en caso contrario no entrar en el if.

Si lo que hemos pasado a indexOf esta en el array, aplicamos la función splice que se encarga de eliminar el elemento.

Obtener parámetros de la url con Javascript

tecnicoweb 30.771 Comentarios

Para obtener un parámetro de la url con el lenguaje de programación Javascript hay que implementar el siguiente código:

Url del ejemplo:

http://tecnicoweb.es/?idUsuario=3&pelo=rubio&ojos=verdes

Código para obtener el valor del parámetro «idUsuario».

var queryString = window.location.search;
var urlParams = new URLSearchParams(queryString);
var anuncioParam = urlParams.get('idUsuario');

Paso a paso.

window.location.search;

Obtenemos «?idUsuario=3&pelo=rubio&ojos=verdes»

var urlParams = new URLSearchParams(queryString);

URLSearchParams es un objeto y te proporciona diferentes funcionalidades, podemos ver todas su opciones aquí

var anuncioParam = urlParams.get('idUsuario');

Se extra el parametro que le pasamos al .get.

console.log(anuncioParam);

Consulta una colección (firebase) desde javascript

tecnicoweb 32.012 Comentarios

Vamos a consulta una colección de firebase (Cloud Firestore) desde javascript.

Lo primero que necesitamos es los datos de configuración que nos lo va a proporciona el mismo firebase, entramos en https://console.firebase.google.com/ seleccionamos el proyecto, a continuación pinchamos en rulina de la izquierda (ver la imagen)

Una vez dentro de la configuración bajamos hasta el apartado «Firebase SDK snippet» copiamos el código javascript y nos lo llevamos a nuestra fichero html.

<!-- The core Firebase JS SDK is always required and must be listed first -->
<script src="https://www.gstatic.com/firebasejs/7.14.2/firebase-app.js"></script>

<!-- TODO: Add SDKs for Firebase products that you want to use
     https://firebase.google.com/docs/web/setup#available-libraries -->
<script src="https://www.gstatic.com/firebasejs/7.14.2/firebase-analytics.js"></script>

<script>
  // Your web app's Firebase configuration
  var firebaseConfig = {
    apiKey: "xxxxxxxxxxxxxxxxxxxx",
    authDomain: "xxxxxxxxxxxx.firebaseapp.com",
    databaseURL: "https://xxxxxxxxxxxx.firebaseio.com",
    projectId: "xxxxxxxxxxxx",
    storageBucket: "xxxxxxxxxxxx.appspot.com",
    messagingSenderId: "xxxxxxxxxxxx",
    appId: "1:xxxxxxxxxxxx:web:xxxxxxxxxxxx",
    measurementId: "G-xxxxxxxxxxxx"
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  firebase.analytics();
</script>

En el siguiente código vamos a iniciar la conexión a partir de la configuración que hemos obtenido ante desde firebase.

firebase.initializeApp(config);
var db = firebase.firestore();

Ya estaríamos conectado, para realizar una consulta de datos sería con la propiedad «collection»

db.collection("coches").get().then((querySnapshot) => {
        querySnapshot.forEach((doc) => {
           console.log("Id",doc.id);
           console.log("Datos",doc.data());
        });
    });

Mostraremos por consola el «Id» y los «Datos» de nuestra tabla «coches»

Si queremos ordenar el listado por un campos, habría que añadir «orderBy».

db.collection("coches").orderBy("fechaPublicacion", "desc").get().then((querySnapshot) => {
        querySnapshot.forEach((doc) => {
           console.log("Id",doc.id);
           console.log("Datos",doc.data());
        });
    });

Nos arrojara el listado de coches ordenado por «fechaPublicacion».

El código javascript (yo lo he incorporado en un fichero html) completo quedaría así:

<script>
    // Your web app's Firebase configuration
    var firebaseConfig = {
        apiKey: "xxxxxxxxxxxxxxxxxxxx",
        authDomain: "xxxxxxxxxxxx.firebaseapp.com",
        databaseURL: "https://xxxxxxxxxxxx.firebaseio.com",
        projectId: "xxxxxxxxxxxx",
        storageBucket: "xxxxxxxxxxxx.appspot.com",
        messagingSenderId: "xxxxxxxxxxxx",
        appId: "1:xxxxxxxxxxxx:web:xxxxxxxxxxxx",
        measurementId: "G-xxxxxxxxxxxx"
    };
    // Initialize Firebase
    firebase.initializeApp(firebaseConfig);
    firebase.analytics();

    firebase.initializeApp(config);
    var db = firebase.firestore();

    db.collection("coches").orderBy("fechaPublicacion", "desc").get().then((querySnapshot) => {
        querySnapshot.forEach((doc) => {
            console.log("Id", doc.id);
            console.log("Datos", doc.data());
        });
    });

</script>

Si queremos hacer una consulta para filtrar los resultados sería añadiendo «where» :

db.collection("coches").where("diesel", "==", "si")
.get().then(function (querySnapshot) {
    querySnapshot.forEach(function (doc) {
           console.log("Id", doc.id);
           console.log("Datos", doc.data());
    });
});

Para recuperar un solo documento por su id:

 db.collection("coches").doc("5LMBbOG8vHWAEKb77wBv")
    .get().then(function (doc) {
            var coche = doc.data();
            console.log("Coche", coche);
    }).catch(function (error) {
            console.log("Error", error);
    });