Я пытаюсь загрузить изображение на холст. Я хочу получить переменную при выполнении функции загрузки.
function getResponse(srcImg){
var img = new Image();
var loaded = false;
img.src = srcImg;
img.onload = function(){
loaded = true;
}
// i want to get loaded variable when the onload function is complete
// wait the return value until the img is not loaded
return loaded;
}
getResponse(imageURL); //loaded is false
Я также пробовал следующий метод. Но у меня это не работает.
Следующим методом возвращается значение undefined.
function getResponse(srcImg,cb){
var img = new Image();
var loaded = false;
img.src = srcImg;
img.onload = function(){
loaded = true;
cb(loaded);
}
// i want to get loaded variable when the onload function is complete
// wait the return value until the img is not loaded
return loaded;
}
getResponse(imageURL,output(load)); //output is undefined
function output(load){
console.info(load);
}



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Это асинхронное поведение. Вы можете использовать обратный вызов или обещание. Смотри ниже:
function getResponse(srcImg,callback){
var img = new Image();
var loaded = false;
img.src = srcImg;
img.onload = function(){
loaded = true;
callback(loaded)
}
// i want to get loaded variable when the onload function is complete
// wait the return value until the img is not loaded
return loaded;
}
getResponse(imageURL,(load)=>{});
используйте обратный вызов, как это
function init(){
var srcImg = "https://cdn.shopify.com/s/files/1/1447/4928/products/large_grande.jpg"
getSource(srcImg,(data)=>{
//do your process here
document.getElementById("demo").textContent = data
});
}
function getSource(src,callback){
var img = new Image();
img.onload = function(){
callback(src);
}
img.src = src;
}<body onload = "init()">
<p id = "demo"></p>
</body>
В приведенном выше коде есть ошибка,
getResponse(imageURL,output(load));должен бытьgetResponse(imageURL,output);, второй параметр должен быть функцией, а не возвращением функции