ホームページ > ウェブフロントエンド > フロントエンドQ&A > es6 の 3 つのインポート方法とは何ですか

es6 の 3 つのインポート方法とは何ですか

青灯夜游
リリース: 2022-05-19 17:59:25
オリジナル
2442 人が閲覧しました

方法: 1. ファイルにエクスポートされたすべての変数をオブジェクトにパックし、「import * as from "module"」ステートメントを使用してインポートします。2. 「import * as from "module"」ステートメントを使用します。2. 「import name it as from "module"」を使用します。 module"" ステートメント ;3. "import {指定された名前} from "module"" ステートメントを使用します。

es6 の 3 つのインポート方法とは何ですか

このチュートリアルの動作環境: Windows 7 システム、ECMAScript バージョン 6、Dell G3 コンピューター。

es6 import 3つのインポート方法

import 「モジュール識別子」から任意に名前を付けます

#これは、モジュールにデフォルトのエクスポート構文がある場合にのみ有効です


// A.js
export default 20
// B.js
import A from './A'
上面的代码生效的前提是,只有在A.js中有默认导出的export default语法时才会生效。
这种不使用{}来引用模块的情况下,import模块的命名是随意的,即如下三种引用命名都是正确的:
//B.js
import A from './A'
import B from './A'
import Something from './A'
因为它总是会解析到A.js中默认的export default
ログイン後にコピー

import {指定された名前} from "モジュール識別子"

指定された名前を持つモジュール内に、export name という名前のコードがある場合にのみ有効になります

//A.js
export const A = 21
//B.js
import { A } from './A'

代码生效的前提是,只有在模块A.js中有如下命名导出为A的export name的代码,
而且,在明确声明了命名导出后,那么在另一个js中使用{}引用模块时,import时的模块命名是有意义的,如下:
// B.js
import { A } from './A'                 // 正确,因为A.js中有命名为A的export
import { B } from './A'                 // 错误!因为A.js中没有命名为B的export
ログイン後にコピー

import * as from "module identifier" (オブジェクトにパッケージ化されています)

ファイルにエクスポートされたすべての変数をオブジェクトにパックします。

例:

export const sqrt1 = Math.sqrt;
export const sqrt2= Math.sqrt;



import * as sqrtobj from "....."
sqrtobj.sqrt1
sqrtobj.sqrt2
ログイン後にコピー

[関連する推奨事項:

JavaScript ビデオ チュートリアル Web フロントエンド ]

以上がes6 の 3 つのインポート方法とは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
es6
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート