{"id":4350,"date":"2025-12-07T19:17:28","date_gmt":"2025-12-07T10:17:28","guid":{"rendered":"https:\/\/dennie.tokyo\/it\/?p=4350"},"modified":"2025-12-08T14:15:00","modified_gmt":"2025-12-08T05:15:00","slug":"%e3%80%90javascript%e3%80%91import%e3%80%81export","status":"publish","type":"post","link":"https:\/\/dennie.tokyo\/it\/?p=4350","title":{"rendered":"\u3010JavaScript\u3011import\u3001export"},"content":{"rendered":"\n<p>import\u3001export\u306b\u3064\u3044\u3066\u3002<\/p>\n\n\n\n<!--more-->\n\n\n\n<h1 class=\"wp-block-heading\">\u524d\u63d0<\/h1>\n\n\n\n<p>\u4eca\u56de\u306f2\u3064\u306e\u30d5\u30a1\u30a4\u30eb\u3092\u4f7f\u3044\u307e\u3059\u3002<br>\u4ee5\u4e0b\u306e\u69cb\u6210\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>.\n\u251c\u2500\u2500 index.js\n\u2514\u2500\u2500 test.mjs<\/code><\/pre>\n\n\n\n<p>index.js \u304c test.mjs \u3092\u8aad\u307f\u8fbc\u3080\u4e8b\u3092\u60f3\u5b9a\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<h1 class=\"wp-block-heading\">\u57fa\u672c<\/h1>\n\n\n\n<h2 class=\"wp-block-heading\">\u30d1\u30bf\u30fc\u30f31<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">export<\/h3>\n\n\n\n<p>\u51fa\u529b\u5074 test.mjs \u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p>export \u3059\u308b\u5bfe\u8c61\u3092 { } \u3067\u56f2\u307f\u307e\u3059\u3002<\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-js\" data-lang=\"JavaScript\"><code>function sample(){\n    return &#39;hello!!&#39;\n}\n\nexport {sample};<\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">import<\/h3>\n\n\n\n<p>\u8aad\u307f\u8fbc\u307f\u5074 index.js \u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p>import \u3059\u308b\u5bfe\u8c61\u3092  { } \u3067\u56f2\u307f\u307e\u3059\u3002\u306a\u304a\u3001\u8aad\u307f\u8fbc\u307f\u306f export \u3055\u308c\u305f\u540d\u79f0\u3068\u540c\u3058\u306b\u3059\u308b\u5fc5\u8981\u304c\u3042\u308a\u307e\u3059\u3002<br><strong>\u4eca\u56de\u306f &#8220;sample&#8221; \u3068\u3044\u3046\u540d\u79f0\u306e\u95a2\u6570\u304c export \u3055\u308c\u3066\u3044\u308b\u306e\u3067\u3001import \u3082 &#8220;sample&#8221; \u306b\u3057\u3066\u3044\u307e\u3059\u3002<\/strong><\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-js\" data-lang=\"JavaScript\"><code>import {sample} from &#39;.\/test.mjs&#39;\nconsole.info(sample());<\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u7d50\u679c<\/h3>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>node index.js\nhello!!<\/code><\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">\u30d1\u30bf\u30fc\u30f32<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">export<\/h3>\n\n\n\n<p>test.mjs \u3092\u4fee\u6b63\u3057\u307e\u3059\u3002\u95a2\u6570\u306e\u524d\u306b export \u3092\u8a18\u8f09\u3057\u3066\u3082\u540c\u3058\u7d50\u679c\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-js\" data-lang=\"JavaScript\"><code>export function sample(){\n    return &#39;hello!!&#39;\n}<\/code><\/pre><\/div>\n\n\n\n<h1 class=\"wp-block-heading\">\u8907\u6570\u30d1\u30bf\u30fc\u30f3<\/h1>\n\n\n\n<p>\u540c\u3058\u95a2\u6570\u540d\u306e\u3082\u306e\u3092\u540c\u6642\u306bexport\u51fa\u6765\u307e\u305b\u3093\u3002\u95a2\u6570\u3092\u5909\u6570\u306b\u683c\u7d0d\u3057\u3001\u5225\u3005\u306e\u5909\u6570\u540d\u3067export\u3059\u308b\u4e8b\u304c\u51fa\u6765\u307e\u3059\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">export<\/h2>\n\n\n\n<p>test.mjs<\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-js\" data-lang=\"JavaScript\"><code>const func_01 = function sample(){\n    return &#39;hello!!&#39;\n}\n\nconst func_02 = function sample(){\n    return &#39;hello000!!&#39;\n}\n\nexport {func_01, func_02};<\/code><\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">import<\/h2>\n\n\n\n<p>index.js<\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-js\" data-lang=\"JavaScript\"><code>import {func_01, func_02} from &#39;.\/test.mjs&#39;\nconsole.info(func_01());\nconsole.info(func_02());<\/code><\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">\u7d50\u679c<\/h2>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>node index.js\nhello!!\nhello000!!<\/code><\/pre><\/div>\n\n\n\n<h1 class=\"wp-block-heading\">\u30a8\u30af\u30b9\u30dd\u30fc\u30c8\u30c7\u30d5\u30a9\u30eb\u30c8<\/h1>\n\n\n\n<p>\u3088\u304f\u898b\u308b &#8220;export default&#8221; \u306b\u3064\u3044\u3066\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u30d1\u30bf\u30fc\u30f31<\/h2>\n\n\n\n<p>\u57fa\u672c\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">export<\/h3>\n\n\n\n<p>test.mjs\u3002<strong>&#8220;export default&#8221; \u3092\u4f7f\u3046\u5834\u5408\u3001{ } \u306f\u4e0d\u8981\u3067\u3059\u3002<\/strong><\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-js\" data-lang=\"JavaScript\"><code>function default_func(){\n    return &#39;default_func!!!&#39;\n}\n\nexport default default_func;<\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">import<\/h3>\n\n\n\n<p>index.js\u3002<strong>&#8220;export default&#8221; \u3092\u4f7f\u3046\u5834\u5408\u3001{ } \u306f\u4e0d\u8981\u3067\u3059\u3002<\/strong><\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-js\" data-lang=\"JavaScript\"><code>import default_func from &#39;.\/test.mjs&#39;\nconsole.info(default_func());<\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u7d50\u679c<\/h3>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>node index.js\ndefault_func!!!<\/code><\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">\u30d1\u30bf\u30fc\u30f32<\/h2>\n\n\n\n<p>import\u306e\u540d\u524d\u3092\u5909\u66f4\u3059\u308b\u4e8b\u304c\u53ef\u80fd\u3067\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">import<\/h3>\n\n\n\n<p>index.js\u3002\u8aad\u307f\u8fbc\u307f\u540d\u3092\u4efb\u610f\u306b\u5909\u3048\u3066\u3082\u7d50\u679c\u306f\u540c\u3058\u306b\u306a\u308a\u307e\u3059\u3002test.mjs\u306e\u5185\u5bb9\u306f\u5909\u3048\u3066\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-js\" data-lang=\"JavaScript\"><code>import my_func from &#39;.\/test.mjs&#39;\nconsole.info(my_func());<\/code><\/pre><\/div>\n\n\n\n<h1 class=\"wp-block-heading\">\u30df\u30c3\u30af\u30b9\u30d1\u30bf\u30fc\u30f3<\/h1>\n\n\n\n<p>&#8220;export default&#8221; \u3068\u901a\u5e38\u306eexport\u3092\u4e21\u65b9\u884c\u3046\u4e8b\u304c\u51fa\u6765\u307e\u3059\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">export<\/h2>\n\n\n\n<p>test.mjs<\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-js\" data-lang=\"JavaScript\"><code>function default_func(){\n    return &#39;default_func!!!&#39;\n}\n\nexport function func(){\n    return &#39;func!!!&#39;\n}\n\nexport default default_func;<\/code><\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">import<\/h2>\n\n\n\n<p>index.js<\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-plain\"><code>import my_func, {func} from &#39;.\/test.mjs&#39;\nconsole.info(my_func());\nconsole.info(func());<\/code><\/pre><\/div>\n\n\n\n<p>\u901a\u5e38\u306e export \u306b\u5bfe\u3059\u308b import\u306f { } \u3042\u308a\u3067\u3001export default \u306f { } \u306a\u3057\u3068\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u7d50\u679c<\/h2>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-plain\"><code>node index.js\ndefault_func!!!\nfunc!!!<\/code><\/pre><\/div>\n\n\n\n<h1 class=\"wp-block-heading\">\u30a2\u30b9\u30bf\u30ea\u30b9\u30af<\/h1>\n\n\n\n<p>&#8221; * &#8221; (\u30a2\u30b9\u30bf\u30ea\u30b9\u30af)\u3092\u4f7f\u3046\u3068\u5168\u3066\u306e export \u3092 import \u51fa\u6765\u307e\u3059\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">export<\/h2>\n\n\n\n<p>test.mjs<\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-js\" data-lang=\"JavaScript\"><code>export function func(){\n    return &#39;func!!&#39;\n}\n\nexport const sample = &#39;sample!!&#39;;<\/code><\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">import<\/h2>\n\n\n\n<p>index.js<\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-js\" data-lang=\"JavaScript\"><code>import * as my_module from &#39;.\/module\/test.mjs&#39;\n\nconsole.info(my_module.func());\nconsole.info(my_module.sample);<\/code><\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">\u7d50\u679c<\/h2>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>node index.js\nfunc!!\nsample!!<\/code><\/pre><\/div>\n\n\n\n<h1 class=\"wp-block-heading\">\u6700\u5f8c\u306b<\/h1>\n\n\n\n<p>export \u306e\u5834\u5408\u306f { } \u3092\u3064\u3051\u3066import\u3059\u308b\u3002export default \u306e\u5834\u5408\u3001{ } \u306f\u4e0d\u8981\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"<p>import\u3001export\u306b\u3064\u3044\u3066\u3002<\/p>\n","protected":false},"author":1,"featured_media":4348,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[22],"tags":[],"class_list":["post-4350","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-javascript"],"_links":{"self":[{"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/posts\/4350","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=4350"}],"version-history":[{"count":18,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/posts\/4350\/revisions"}],"predecessor-version":[{"id":4407,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/posts\/4350\/revisions\/4407"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=\/wp\/v2\/media\/4348"}],"wp:attachment":[{"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=4350"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=4350"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/dennie.tokyo\/it\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=4350"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}