Использовать функцию выборки внутри класса?

#javascript #class #async-await #fetch

#javascript #класс #асинхронный-ожидание #выборка

Вопрос:

Он возвращает weight as undefined , даже если он существует в файле json. Даже если я сделаю weight пустым объектом, например this.weight = '' , в конструкторе, он просто зарегистрирует пустую строку. Любая помощь?

 class Pokemon {
  constructor(name){
    this.name = name
    this.init()
  }

  init = () => {
    fetch(`https://pokeapi.co/api/v2/pokemon/${this.name}`)
    .then(response => response.json())
    .then(data => {
      this.name = data.name
      this.weight = data.weight
      this.height = data.height
      this.move = data.moves[0].move.name;
    })
  }
}

(async () => {
  const pika = new Pokemon('pikachu');
  console.log(await pika.height)
})()
 

Ответ №1:

Вы можете иметь init возвращает свое обещание, и должны init быть вызваны не из конструктора, а вызывающим Pokemon :

 class Pokemon {
  constructor(name){
    this.name = name
  }

  init = () => {
    return fetch(`https://pokeapi.co/api/v2/pokemon/${this.name}`)
    .then(response => response.json())
    .then(data => {
      this.name = data.name
      this.weight = data.weight
      this.height = data.height
      this.move = data.moves[0].move.name;
    })
  }
}

(async () => {
  const pika = new Pokemon('pikachu');
  pika.init()
    .then(() => {
      console.log(pika.height);
    });
})() 

Если ее нужно использовать в нескольких местах, а вызов init извне не подходит, вы также можете попросить конструктор назначить обещание свойству экземпляра и вместо этого отключить его:

 class Pokemon {
  constructor(name){
    this.name = name
    this.init();
  }

  init = () => {
    this.initProm = fetch(`https://pokeapi.co/api/v2/pokemon/${this.name}`)
    .then(response => response.json())
    .then(data => {
      this.name = data.name
      this.weight = data.weight
      this.height = data.height
      this.move = data.moves[0].move.name;
    })
  }
}

(async () => {
  const pika = new Pokemon('pikachu');
  pika.initProm
    .then(() => {
      console.log(pika.height);
    });
})()