Eliminar atributos en blanco de un objeto de JavaScript

Dado un objeto de JavaScript con valores nulos, la tarea es eliminar esos valores nulos del objeto usando javascript. A continuación se muestran los métodos para eliminar los atributos en blanco:

  • Eliminar propiedad de JavaScript
    Esta palabra clave elimina una propiedad de un objeto. Elimina tanto el valor como la propiedad también. Después de la eliminación, la propiedad no está disponible para su uso. Este operador solo se puede usar en propiedades de objetos. No se puede usar en variables o funciones y propiedades de objeto de JavaScript predefinidas.
    Sintaxis:
    delete Object.property or
    delete Object['propertyName']
    
    • Ejemplo 1: este ejemplo recorre cada clave del objeto y verifica si la propiedad tiene un valor nulo. Si es así, elimina esa propiedad mediante el uso de Eliminar propiedad .

      <!DOCTYPE html>
      <html>
        
      <head>
          <title>
              JavaScript | Remove blank attributes from an Object.
          </title>
      </head>
        
      <body style="text-align:center;" id="body">
          <h1 style="color:green;">  
                  GeeksForGeeks  
              </h1>
          <p id="GFG_UP" style="font-size: 19px; font-weight: bold;">
          </p>
          <button onClick="GFG_Fun()">
              click here
          </button>
          <p id="GFG_DOWN" 
             style="color: green; font-size: 24px; font-weight: bold;">
          </p>
          <script>
              var up = document.getElementById('GFG_UP');
              var down = document.getElementById('GFG_DOWN');
              var obj = {
                  prop_1: null,
                  prop_2: 'GFG',
                  prop_3: 3,
                  prop_4: null
              }
              up.innerHTML = JSON.stringify(obj);
        
              function GFG_Fun() {
                  Object.keys(obj).forEach((key) => (obj[key] == null) && delete obj[key]);
                  down.innerHTML = JSON.stringify(obj);
              }
          </script>
      </body>
        
      </html>

      Producción:

      • Antes de hacer clic en el botón:
      • Después de hacer clic en el botón:

      Ejemplo 2: este ejemplo repasa cada clave del objeto y verifica si la propiedad también tiene valores nulos e indefinidos. Si lo tiene, elimina esa propiedad mediante Eliminar propiedad .

      <!DOCTYPE html>
      <html>
        
      <head>
          <title>
              JavaScript | Remove blank attributes from an Object.
          </title>
      </head>
        
      <body style="text-align:center;" id="body">
          <h1 style="color:green;">  
                  GeeksForGeeks  
              </h1>
          <p id="GFG_UP" style="font-size: 19px; font-weight: bold;">
          </p>
          <button onClick="GFG_Fun()">
              click here
          </button>
          <p id="GFG_DOWN"
             style="color: green; font-size: 24px; font-weight: bold;">
          </p>
          <script>
              var up = document.getElementById('GFG_UP');
              var down = document.getElementById('GFG_DOWN');
              var obj = {
                  prop_1: null,
                  prop_2: 'GFG',
                  prop_3: 3,
                  prop_4: null
              }
              up.innerHTML = JSON.stringify(obj);
        
              function delet(obj) {
                  for (var prop in obj) {
                      if (obj[prop] === null || obj[prop] === undefined) {
                          delete obj[prop];
                      }
                  }
              }
        
              function GFG_Fun() {
                  delet(obj);
                  down.innerHTML = JSON.stringify(obj);
              }
          </script>
      </body>
        
      </html>

      Producción:

      • Antes de hacer clic en el botón:
      • Después de hacer clic en el botón:

Publicación traducida automáticamente

Artículo escrito por PranchalKatiyar y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *