0

Tengo una duda, estoy iniciando con javascript y en una guía me dan un método para traer datos con fetch desde giphy. EL error que tengo es que al ejecutarlo con los datos requeridos me esta devolviendo un estado pendiente. Les comparto el código para que me orienten, puedo ver que si hago console a la variable data, los datos se están recibiendo pero la respuesta me da pendiente.

Les comparto la clase y el método que estoy usando, agradezco cualquier ayuda o guía.

class Giphy{

    constructor(search){
        this.apiKey = 'Ot8LkNZiCNqOlYdTfvzfCHNlwW4fgXxo';
        this.search = search;
    }


    getSearchResults(search) {
        const found =
        fetch('http://api.giphy.com/v1/gifs/search?q=' + this.search +
        '&api_key=' + this.apiKey)
        .then((response) => { return response.json() })
        .then(data => { return data })

        .catch((error) => {
        return error
        })
        return found
        }

}

const gif = new Giphy('gato');

console.log(gif.getSearchResults());

Desde ya, gracias.

1 respuesta 1

0

Puedes hacer uso de async/await, aparte de que hará que tu código se vea limpio y organizado

class Giphy{
  constructor(search) {
    this.apiKey = 'Ot8LkNZiCNqOlYdTfvzfCHNlwW4fgXxo';
    this.search = search;
  }
  async getSearchResults() {
    let api = await fetch('http://api.giphy.com/v1/gifs/search?q=' + this.search + '&api_key=' + this.apiKey);
    let found = await api.json();
    return found;
  }
}
const gif = new Giphy('gato');
gif.getSearchResults().then((result) => {
   console.log(result);
 });

Editado

Recuerda que las funciones que usan async siempre devuelven una promesa.


Exporta e importa modulo para NodeJS

Para exportar un módulo para NodeJS, seria de la siguiente forma.

Creas un archivo llamado Giphy.js

// tu clase aquí...
module.exports = Giphy;

Para importarlo seria de esta forma

const Giphy = requiere('./Giphy.js');
const gif = new Giphy();
// ...

Exportar e importar módulo para EcmaScript

Para exportar creas un archivo Giphy.js

// tu clase aquí...
export default Giphy;

Para importarlo seria así

import Giphy from './Giphy.js'
const gif = new Giphy();
// ...

Ojo

En caso de que desees exportar e importa módulos para ambas opciones, debes guardar los archivos .js en diferentes carpetas o con diferentes nombres. Para evitar errores

11
  • Muchas gracias por la respuesta, me sirve mucho. Pero quiera saldar otra duda. Si deseo ejecutar esa clase con ese método getSearchResults() que están en un archivo llamado xx.js pero hacerlo desde otro archivo llamado yy.js, como debería hacer la importancia o como debería invocarla el archivo, la clase y el método? Mil gracias por la respuesta.
    – HELMER90
    el 10 ene. 2020 a las 21:24
  • @HELMER90 edite mi respuesta ;) cualquier cosa que no entiendas, dímelo y te ayudare ;) el 10 ene. 2020 a las 21:58
  • Este es el resultado de exportar la clase e importarla desde otro archivo. SyntaxError: import declarations may only appear at top level of a module app.js:2 SyntaxError: export declarations may only appear at top level of a module giphy.js:38:2. Mi archivo principal se llama app.js y desde allí estoy tratando de importar la clase de giphy.js.
    – HELMER90
    el 11 ene. 2020 a las 1:15
  • import Giphy from '/js/giphy.js' const gif = new Giphy('gato'); gif.getSearchResults().then((result) => { console.log(result); }); y a continuación archivo giphy.js export default class Giphy{ constructor(search) { this.apiKey = 'Ot8LkNZiCNqOlYdTfvzfCHNlwW4fgXxo'; this.search = search; } async getSearchResults() { let api = await fetch('api.giphy.com/v1/gifs/search?q=' + this.search + '&api_key=' + this.apiKey); let found = await api.json(); return found; } }
    – HELMER90
    el 11 ene. 2020 a las 1:16
  • @HELMER90 import Gyphy from './js/Giphy.js' te hizo falta un punto al pricio, por eso te da error el 11 ene. 2020 a las 1:26

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.