« mysqlのgeneral_log | メイン | centos7 ファイル共有 »
2019年04月13日
promiseとかのがくしゅう
<!DOCTYPE html><html>
<head>
<meta charset="utf-8">
<script src="kanri/js/jquery-3.3.1.min.js"></script>
<title>通常の非同期</title>
</head>
<body>
6.jpgが
非常に大きい状態でテストすると最後に6.jpgの読み込み完了と当然なる
<script type="text/javascript">
function loadImg(url){
var img = new Image();
img.onload = function(){
console.log(img.src + " end");
};
img.onerror=function(){
console.log("err");
};
img.src = url;
}
loadImg("6.jpg");
loadImg("4.jpg");
loadImg("5.jpg");
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="kanri/js/jquery-3.3.1.min.js"></script>
<title>通常の非同期</title>
</head>
<body>
6.jpgが
非常に大きい状態でテストしても順番によみこまれる
<script type="text/javascript">
function loadImg(url){
return new Promise(function(resolve, reject){
var img = new Image();
img.onload = function(){
console.log(url+" loadend");
resolve(img);
};
img.onerror = function(e){reject(e)};
/*
これは
img.onerror = (e) => reject(e);
とも省略できるようだ。わかりにくい。
*/
img.src = url;
});
};
async function poge(){
var img1 = await loadImg("6.jpg?22").catch(function(e){console.log(e)});
var img2 = await loadImg("4.jpg?22").catch(function(e){console.log(e)});
var img3 = await loadImg("5.jpg?22").catch(function(e){console.log(e)});
};
poge();
</script>
</body>
</html>
投稿者 muuming : 2019年04月13日 11:54