Javascript - Pq não consigo pegar o retorno?

Programação
#1

preciso obter a dimensão de uma imagem que retorna da url, porém consigo exibir em um alerta mas não consigo pegar utilizando return. o que estou fazendo de errado?


var img = new Image();
img.onload = function() {
  return this.width + 'x' + this.height;
}
img.src = 'http://www.google.com/intl/en_ALL/images/logo.gif';
#2

Dentro do onload, o this não se refere à imagem carregada, mas ao escopo do script como um todo (ou da “classe” onde esse script está).

Use o nome da variável img:

img.onload = function() {
  console.log(img.width + 'x' + img.height);
}

Se você precisa desse valor em outro ponto, pode chamar outra função dentro de onload, que recebe as dimensões e faz o que você precisa.

Abraço.

#3

mas toda vez utilizo return retorna undefined.

exemplo abaixo…

function ObterDimensao(){
var img = new Image();
img.onload = function() {
  var v =  this.width + 'x' + this.height;
  teste2(v)
}
img.src = 'http://www.google.com/intl/en_ALL/images/logo.gif'
}
function teste2 (v){
return(v);
}

ObterDimensao();
#4

Esse é seu código completo? Onde está dando “undefined”?

Rodei seu código aqui e funcionou (exemplo: https://jsfiddle.net/h37sobru/). O que você está tentando fazer exatamente?

Note que você não pode fazer return do tamanho da imagem antes de ela ser carregada (src = “url_da_imagem”), por isso você precisa passar o valor para as variáveis que precisam dele, ou chamar outra função dentro de onload para pegar o valor que você quer. Se você fizer:

let dimensoes = ObterDimensao();

Terá undefined em dimensoes, pois a imagem é carregada de forma assíncrona e a função ObterDimensao retorna undefined antes mesmo de a imagem ser carregada. O que você precisa é algo como:

let dimensoes;

ObterDimensao();

E em ObterDimensao:

var img = new Image();
img.onload = function() {
  dimensoes =  this.width + 'x' + this.height;
}
img.src = 'http://www.google.com/intl/en_ALL/images/logo.gif'
}

Abraço.

#5

Eu quero obter o return e não alert.
pois preciso pegar esse retorno pra aplicar em outra função…
image

#6

Como já expliquei, você não pode usar o return porque a carga da imagem é assíncrona, então você não tem o tamanho da imagem antes de ela ser carregada.

Se você precisa do retorno em outro lugar, chame essa função que precisa do retorno de dentro do onload ou da sua função teste2.

Abraço.

1 curtida
#7

mas né isso que fiz assim? dentro de onload estou chamando a função teste2.

#8

Se você está executando no console do navegador, a carga da imagem pode estar sendo bloqueada, por ser de um site externo. Por isso, sua img fica como undefined. Adicione o img.onerror para confirmar isso. Algo como:

function ObterDimensao(){
var img = new Image();
img.onload = function() {
  var v =  this.width + 'x' + this.height;
  teste2(v)
}
img.onerror = function(error) {
    console.log('Deu erro ao carregar a imagem');
}
img.src = 'http://www.google.com/intl/en_ALL/images/logo.gif'
}
function teste2 (v){
return(v);
}

ObterDimensao();

Nos meus testes, deu o resultado:

undd

Abraço.