¿Es posible insertar insertar un objeto en el DOM de HTML?

[garcia_romero.y]

Hola, buenas tardes.
Me encuentro muy confundida acerca de si es posible o no imprimir en la pantalla gracias al innerHTML el retorno de una función cuando este es de tipo Object, ya que cuando asigno al espacio en el DOM la llamada a la función, solo se imprime el tipo de dato del objeto, pero no su contenido. He leído documentación a cerca del inner y de los objetos, pero aún no puedo solucionar el problema. Alguien podria auxiliarme respecto a por donde empezar a buscar, por favor.

result.innerHTML = window.cipher.createCipherWithOffset(offset.value); // Retorna : [object Object] en la página web

[ruthcinha]

Hola @garcia_romero.y bienvenida!!
Nos podrías indicar como está hecho la función createCipherWithOffset?

Gracias

[fabian]

Hola!

Por supuesto que si, acá el problema que tuviste es otro, puesto que en HTML, tal como pusiste puedes poner todo lo que quieras mientras sea texto.
Y esa es la clave “mientras sea texto”, los objetos de javascript NO son texto, por lo que debemos transformarlos para poder imprimirlos o ponerlos en HTML usando :

const objetoComoTexto = JSON.stringify(objetoAImprimir)

De esta forma transformas el objeto en texto y puedes ocuparlo como texto.

[lupo]

@garcia_romero.y, gracias por animarte a preguntar por acá

[…] es posible o no imprimir en la pantalla gracias al innerHTML el retorno de una función cuando este es de tipo Object […]

La respuesta corta sería sí. De hecho, al imprimir [object Object], lo que está pasando es que la función cipher.createCipherWithOffset está retornando un objeto, y JavaScript lo está convirtiendo a un string para poder insertarlo en en el innerHTML del nodo result. El problema en esta caso es que el valor de retorno de cipher.createCipherWithOffset debería ser de tipo string y no object.

Como referencia, todos los objetos resultan en [object Object] al convertirlos a string, a menos de que el objeto provea un método toString(), que en caso de que exista será invocado a la hora de convertir el objeto a un string.

const a = { foo: 'bar' };
console.log(`${a}`); // => [object Object]
console.log(a.toString()); // => [object Object]


const b = {
  foo: 'bar',
  toString: function () {
    return `foo: ${this.foo}`;
  }
};

console.log(`${b}`); // => 'foo: bar'

Espero que sea de ayuda

[garcia_romero.y]

Hola, en verdad muchas gracias RuthCinHa, Fabian y Lupo. Pude aplicar lo que me comentan y finalmente y con ayuda de los Jedis en México pude entender que era lo que estaba pasando, ahora el retorno de mi función puede ser detectada como un objeto y a su vez es posible imprimir en la Web gracias al DOM, comparto la resolución final de mi problema esperando sea de ayuda para alguien más. Saludos y de nuevo, mil gracias.

createCipherWithOffset : (offset) =>{
let encodePhrase = “Hola”;
let decodePhrase = “Adios”;
let objCipher = Object.create({},{
getEncode :{value: function(){return this.Encode;}},
getDecode :{value: function(){return this.Decode;}}
});
objCipher.encode = cipher.encode(encodePhrase,offset);
objCipher.decode = cipher.decode(decodePhrase,offset);
let textObj = JSON.stringify(objCipher);
let returnObj = [textObj, objCipher.valueOf()];
return returnObj;
} // Retorna en ya en la web : {“encode”:“String1”,“decode”:“String2”},[object Object]