{"id":3856,"date":"2023-07-06T10:09:56","date_gmt":"2023-07-06T01:09:56","guid":{"rendered":"http:\/\/attacktube.com\/?p=3856"},"modified":"2023-08-01T21:36:35","modified_gmt":"2023-08-01T12:36:35","slug":"%e3%80%90javascript%e3%80%91%e3%80%8cpromise%e3%81%a8then%e3%80%8d%e3%82%92%e4%bd%bf%e3%81%a3%e3%81%9f%e3%82%b3%e3%83%bc%e3%83%89%e3%82%92%e3%80%8cpromise%e3%81%a8async%e3%81%a8await%e3%80%8d%e3%82%92","status":"publish","type":"post","link":"https:\/\/attacktube.com\/?p=3856","title":{"rendered":"\u3010JavaScript\u3011\u300cPromise\u3068then\u300d\u3092\u4f7f\u3063\u305f\u30b3\u30fc\u30c9\u3092\u300cPromise\u3068async\u3068await\u300d\u3092\u4f7f\u3063\u305f\u30b3\u30fc\u30c9\u306b\u66f8\u304d\u63db\u3048\u308b"},"content":{"rendered":"\n<p>\u300cPromise\u3068then\u300d\u3092\u4f7f\u3063\u305f\u30b3\u30fc\u30c9\u3092\u300cPromise\u3068async\u3068await\u300d\u3092\u4f7f\u3063\u305f\u30b3\u30fc\u30c9\u306b\u66f8\u304d\u63db\u3048\u308b\u3002<br>\u30b5\u30f3\u30d7\u30eb\u306f\u6b21\u304c\u3088\u3046\u306b\u306a\u308b\u3002<br>\u91cd\u8981\u306a\u3068\u3053\u306f\u300cnew Promise\u300d\u306b\u306f\u30b3\u30fc\u30eb\u30d0\u30c3\u30af\u95a2\u6570\u300cresolve\u300d\u3068\u30b3\u30fc\u30eb\u30d0\u30c3\u30af\u95a2\u6570\u300creject\u300d\u3092\u6e21\u3059\u3053\u3068\u3002\u300cPromise\u3068then\u300d\u3092\u4f7f\u3063\u305f\u30b3\u30fc\u30c9\u306fthen\u3092\u4f7f\u308f\u305a\u306b\u300cPromise\u3068async\/await\u300d\u3092\u4f7f\u3063\u305f\u30b3\u30fc\u30c9\u306b\u66f8\u304d\u63db\u3048\u308b\u3053\u3068\u304c\u3067\u304d\u308b\u3053\u3068\u3002<br>\u300cPromise\u3068then\u300d\u3068\u300cPromise\u3068async\/await\u300d\u306f\u9023\u7d9a\u3059\u308b\u975e\u540c\u671f\u51e6\u7406\u306e\u30c1\u30a7\u30fc\u30f3\u3092\u7c21\u5358\u306b\u6271\u3046\u305f\u3081\u306e\u4ed5\u7d44\u307f\u3067\u3042\u308b\u3002\u306a\u306e\u3067\u3001\u975e\u540c\u671f\u51e6\u7406\u306e\u30c1\u30a7\u30fc\u30f3\u306e\u30b5\u30f3\u30d7\u30eb\u3092\u7528\u610f\u3057\u305f\u3002<\/p>\n\n\n\n<!--more-->\n\n\n\n<br>\n<script async=\"\" src=\"https:\/\/pagead2.googlesyndication.com\/pagead\/js\/adsbygoogle.js?client=ca-pub-3461056110605997\" crossorigin=\"anonymous\"><\/script>\n<ins class=\"adsbygoogle\" style=\"display:block; text-align:center;\" data-ad-layout=\"in-article\" data-ad-format=\"fluid\" data-ad-client=\"ca-pub-3461056110605997\" data-ad-slot=\"3137443461\"><\/ins>\n<script>\n     (adsbygoogle = window.adsbygoogle || []).push({});\n<\/script>\n<br>\n\n\n\n<pre><code>\n\/\/Promise\u3068then\u3092\u4f7f\u3063\u305f\u30b5\u30f3\u30d7\u30eb\u30b3\u30fc\u30c91\nconst promise = new Promise((resolve, reject) =&gt; resolve(&quot;Hello 1&quot;)); \/\/ Promise\u3092\u4f5c\u6210\u3057\u3001\u7d42\u4e86\u3059\u308b\npromise.then((msg) =&gt; console.log(msg+&#039; done!&#039;)); \/\/ Promise\u304c\u7d42\u4e86\u3057\u305f\u3089\u300cdone!\u300d\u3068\u8868\u793a\u3059\u308b\n\n\/\/Promise\u3068async\u3068await\u3092\u4f7f\u3063\u305f\u30b5\u30f3\u30d7\u30eb\u30b3\u30fc\u30c91\nconst example =async function(){\n  const ret = await new Promise((resolve, reject) =&gt; resolve(&quot;Hello 2&quot;)); \/\/ Promise\u3092\u4f5c\u6210\u3057\u3001\u7d42\u4e86\u3059\u308b\n  console.log(ret+&#039; done2!&#039;); \/\/ \u300cdone!\u300d\u3068\u8868\u793a\u3059\u308b\n}\n\nexample();\n\n\/\/Promise\u3068then\u3092\u4f7f\u3063\u305f\u30b5\u30f3\u30d7\u30eb\u30b3\u30fc\u30c92\nconst promise2 = new Promise((resolve, reject) =&gt; {let obj = {message:&#039;hello world!&#039;,number:42};resolve(obj)}); \/\/ Promise\u3092\u4f5c\u6210\u3057\u3001\u7d42\u4e86\u3059\u308b\npromise2.then((msg) =&gt; console.log(msg.message+&#039;, &#039;+msg.number+&#039;, &#039;+&#039;done!&#039;)); \/\/ Promise\u304c\u7d42\u4e86\u3057\u305f\u3089\u300cdone!\u300d\u3068\u8868\u793a\u3059\u308b\n\n\/\/Promise\u3068async\u3068await\u3092\u4f7f\u3063\u305f\u30b5\u30f3\u30d7\u30eb\u30b3\u30fc\u30c92\nconst example2 = async function(){\n  const ret = await new Promise((resolve, reject) =&gt; {let obj = {message:&#039;hello world!2&#039;,number:100};resolve(obj)}); \/\/ Promise\u3092\u4f5c\u6210\u3057\u3001\u7d42\u4e86\u3059\u308b\n  console.log(ret.message+&#039;, &#039;+ret.number+&#039;, &#039;+&#039;done!2&#039;)\n}\n\nexample2();\n\n\/*\nHello 1 done!\nHello 2 done2!\nhello world!, 42, done!\nhello world!2, 100, done!2\n*\/\n\n<\/code><\/pre>\n\n\n\n<pre><code>\nconst printAsync = function(text, delay) {\n  return new Promise((resolve, reject) =&gt; {\n    setTimeout(() =&gt; {\n        console.log(text);\n        resolve(text);\n    }, delay);\n  });\n}\nconst printTexts = function(){\n  printAsync(&#039;hello&#039;, 1000)\n    .then((a) =&gt; {\n      console.log(&quot;\u623b\u308a\u5024(1)  a=&quot; + a);\n      a += &quot; world&quot;;\n      return printAsync(a, 500);\n    })\n    .then((a) =&gt; {\n      console.log(&quot;\u623b\u308a\u5024(2)  a=&quot; + a);\n      a += &quot; JavaScript&quot;;\n      return printAsync(a, 2000);\n    })\n    .then((a) =&gt; {\n      console.log(&quot;\u623b\u308a\u5024(3)  a=&quot; + a);\n      a += &quot; 2023&quot;;\n      return printAsync(a, 500);\n    })\n    .then((a) =&gt; {\n      console.log(&quot;\u623b\u308a\u5024(4) a=&quot; + a);\n    })\n    .catch((error) =&gt; {\n      console.error(&quot;\u30a8\u30e9\u30fc:&quot;, error);\n    });\n}\n\nprintTexts();\n\nconst  printTexts2 = async function(){\n  let a = await printAsync(&#039;hello&#039;, 1000);\n  console.log(&quot;2 \u623b\u308a\u5024(1)  a=&quot;+a);\n  a +=&quot; world&quot;;\n  a=await printAsync(a, 500);\n\n  a +=&quot; JavaScript&quot;;\n  console.log(&quot;2 \u623b\u308a\u5024(2)  a=&quot;+a);\n  a=await printAsync(a, 2000);\n\n  a +=&quot; 2023&quot;;\n  console.log(&quot;2 \u623b\u308a\u5024(3)  a=&quot;+a);\n  a=await printAsync(a, 500);\n\n  console.log(&quot;2 \u623b\u308a\u5024(4) a=&quot;+a);\n\n}\n\nprintTexts2();\n\n\/*\nhello\n\u623b\u308a\u5024(1)  a=hello\nhello\n2 \u623b\u308a\u5024(1)  a=hello\nhello world\n\u623b\u308a\u5024(2)  a=hello world\nhello world\n2 \u623b\u308a\u5024(2)  a=hello world JavaScript\nhello world JavaScript\n\u623b\u308a\u5024(3)  a=hello world JavaScript\nhello world JavaScript\n2 \u623b\u308a\u5024(3)  a=hello world JavaScript 2023\nhello world JavaScript 2023\n\u623b\u308a\u5024(4) a=hello world JavaScript 2023\nhello world JavaScript 2023\n2 \u623b\u308a\u5024(4) a=hello world JavaScript 2023\n\n*\/\n\n<\/code><\/pre>\n\n\n\n<pre><code>\n\/\/Promise\u3068then\u3092\u4f7f\u3063\u305f\u30b5\u30f3\u30d7\u30eb\u30b3\u30fc\u30c93\nconst buy = async function(pay) {\n  return new Promise(function(resolve, reject) {\n    setTimeout(function() {\n        if (pay &gt;= 100) {\n            console.log(&quot;100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f&quot;);\n            resolve(pay);\n        } else {\n            reject(&quot;\u304a\u91d1\u304c\u8db3\u308a\u306a\u3044\u3088 pay = &quot; + pay);\n        }\n    }, 500);\n});\n}\n\nbuy(200).then(function(change) {\n  console.log(`\u304a\u91e3\u308a\u306f${change}\u5186\u3067\u3059`)\n}).catch((e) =&gt; console.log(&quot;e=&quot; + e));\n\nbuy(30).then(function(change) {\n  console.log(`\u304a\u91e3\u308a\u306f${change}\u5186\u3067\u3059`)\n}).catch((e) =&gt; console.log(&quot;e=&quot; + e));\n\n\/\/Promise\u3068async\u3068await\u3092\u4f7f\u3063\u305f\u30b5\u30f3\u30d7\u30eb\u30b3\u30fc\u30c93\nconst purchase = async function (pay) {\n  try {\n    const change = await buy(pay);\n    console.log(`\u304a\u91e3\u308a\u306f${change}\u5186\u3067\u3059`);\n  } catch (e) {\n    console.log(&quot;e=&quot; + e);\n  }\n};\n\npurchase(200);\npurchase(30);\n\nconst hoge2 = function() {\n\n  const recursiveBuy = function(a) {\n    return buy(a).then(function(newA) {\n        console.log(&quot;while\u306e\u4e2d \u6b8b\u91d1 a=&quot; + newA);\n        return recursiveBuy(newA - 100);\n    });\n  };\n\n  recursiveBuy(1000).catch(function(error) {\n    console.error(&quot;\u30a8\u30e9\u30fc:&quot;, error);\n  });\n\n}\n\nhoge2();\n\nconst hoge3 = async function() {\n\n  try {\n\n    let a = await buy(1000);\n    console.log(&quot;2 \u6b8b\u91d1 a=&quot; + a);\n\n    while(1){\n      a = a - 100;\n      a = await buy(a);\n      console.log(&quot;2 while\u306e\u4e2d \u6b8b\u91d1 a=&quot; + a);\n    }\n    \n  } catch (error) {\n    console.error(&quot;2 \u30a8\u30e9\u30fc:&quot;, error);\n  }\n\n}\n\nhoge3();\n\n\/*\n\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\n\u304a\u91e3\u308a\u306f200\u5186\u3067\u3059\ne=\u304a\u91d1\u304c\u8db3\u308a\u306a\u3044\u3088 pay = 30\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\n\u304a\u91e3\u308a\u306f200\u5186\u3067\u3059\ne=\u304a\u91d1\u304c\u8db3\u308a\u306a\u3044\u3088 pay = 30\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\nwhile\u306e\u4e2d \u6b8b\u91d1 a=1000\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\n2 \u6b8b\u91d1 a=1000\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\nwhile\u306e\u4e2d \u6b8b\u91d1 a=900\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\n2 while\u306e\u4e2d \u6b8b\u91d1 a=900\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\nwhile\u306e\u4e2d \u6b8b\u91d1 a=800\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\n2 while\u306e\u4e2d \u6b8b\u91d1 a=800\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\nwhile\u306e\u4e2d \u6b8b\u91d1 a=700\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\n2 while\u306e\u4e2d \u6b8b\u91d1 a=700\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\nwhile\u306e\u4e2d \u6b8b\u91d1 a=600\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\n2 while\u306e\u4e2d \u6b8b\u91d1 a=600\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\nwhile\u306e\u4e2d \u6b8b\u91d1 a=500\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\n2 while\u306e\u4e2d \u6b8b\u91d1 a=500\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\nwhile\u306e\u4e2d \u6b8b\u91d1 a=400\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\n2 while\u306e\u4e2d \u6b8b\u91d1 a=400\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\nwhile\u306e\u4e2d \u6b8b\u91d1 a=300\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\n2 while\u306e\u4e2d \u6b8b\u91d1 a=300\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\nwhile\u306e\u4e2d \u6b8b\u91d1 a=200\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\n2 while\u306e\u4e2d \u6b8b\u91d1 a=200\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\nwhile\u306e\u4e2d \u6b8b\u91d1 a=100\n100\u5186\u306e\u5546\u54c1\u3092\u8cfc\u5165\u3057\u307e\u3057\u305f\n2 while\u306e\u4e2d \u6b8b\u91d1 a=100\n\u30a8\u30e9\u30fc: \u304a\u91d1\u304c\u8db3\u308a\u306a\u3044\u3088 pay = 0\n2 \u30a8\u30e9\u30fc: \u304a\u91d1\u304c\u8db3\u308a\u306a\u3044\u3088 pay = 0\n*\/\n\n<\/code><\/pre>\n\n\n\n<p><a href=\"https:\/\/rightcode.co.jp\/blog\/information-technology\/javascript-promise\">\u3010JavaScript\u3011Promise \u3067\u975e\u540c\u671f\u51e6\u7406\u3092\u8a18\u8ff0\u3059\u308b \u2013 \u682a\u5f0f\u4f1a\u793e\u30e9\u30a4\u30c8\u30b3\u30fc\u30c9 (rightcode.co.jp)<\/a> ExternalLink<br><a href=\"https:\/\/rightcode.co.jp\/blog\/information-technology\/javascript-async-await#asyncawait\">\u3010JavaScript\u3011 async\/await \u3067\u975e\u540c\u671f\u51e6\u7406\u3092\u308f\u304b\u308a\u3084\u3059\u304f\u8a18\u8ff0\u3059\u308b \u2013 \u682a\u5f0f\u4f1a\u793e\u30e9\u30a4\u30c8\u30b3\u30fc\u30c9 (rightcode.co.jp)<\/a> ExternalLink<\/p>\n\n\n\n<script type=\"text\/javascript\">\njQuery(function($){\n$(\".jp-video\").hide();\n});\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>\u300cPromise\u3068then\u300d\u3092\u4f7f\u3063\u305f\u30b3\u30fc\u30c9\u3092\u300cPromise\u3068async\u3068await\u300d\u3092\u4f7f\u3063\u305f\u30b3\u30fc\u30c9\u306b\u66f8\u304d\u63db\u3048\u308b\u3002\u30b5\u30f3\u30d7\u30eb\u306f\u6b21\u304c\u3088\u3046\u306b\u306a\u308b\u3002\u91cd\u8981\u306a\u3068\u3053\u306f\u300cnew Promise\u300d\u306b\u306f\u30b3\u30fc\u30eb\u30d0\u30c3\u30af\u95a2\u6570\u300cresolve\u300d\u3068\u30b3 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[3],"tags":[],"class_list":["post-3856","post","type-post","status-publish","format-standard","hentry","category-javascript"],"jetpack_featured_media_url":"","jetpack-related-posts":[],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/attacktube.com\/index.php?rest_route=\/wp\/v2\/posts\/3856","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/attacktube.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/attacktube.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/attacktube.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/attacktube.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=3856"}],"version-history":[{"count":24,"href":"https:\/\/attacktube.com\/index.php?rest_route=\/wp\/v2\/posts\/3856\/revisions"}],"predecessor-version":[{"id":4265,"href":"https:\/\/attacktube.com\/index.php?rest_route=\/wp\/v2\/posts\/3856\/revisions\/4265"}],"wp:attachment":[{"href":"https:\/\/attacktube.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=3856"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/attacktube.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=3856"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/attacktube.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=3856"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}