ホームページ >ウェブフロントエンド >フロントエンドQ&A >es6 でのエクスポートと同様の使用法は何ですか

es6 でのエクスポートと同様の使用法は何ですか

WBOY
WBOYオリジナル
2022-03-31 14:50:144276ブラウズ

es6 では、export キーワードを使用して変数、関数、オブジェクトをモジュール化し、それらを外部から参照して外部呼び出しインターフェイスを提供できるようにします。構文は "export var a = 'name';"; です。 as key この単語は変数名を変更するために使用され、構文は「export {新しい変数名を古い変数名として}」となります。

es6 でのエクスポートと同様の使用法は何ですか

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

エクスポートと es6 の場合の使用法

エクスポートの使用:

エクスポートを使用すると、変数、関数、オブジェクトはモジュール化されており、外部参照用の外部呼び出しインターフェイスを提供します。まず、変数をモジュール化する最も単純な例を見てみましょう。新しい temp.js ファイルを作成し、ファイル内にモジュール変数を出力します。

export var a = 'jspang';

そうするとindex.jsにimportという形で導入できます。

import {a} from './temp.js';
console.log(a);

cmdコマンドモジュール入力

babel-nodeindex.jsディレクトリに注意してください

複数変数出力(temp.js)

var a ='jspang';
var b ='技术胖';
var c = 'web';
export {a,b,c} //包装成对象{}

関数 (temp.js) のモジュール出力

export function add(a,b){
    return a+b;
}

使用法として

公開したくない場合もありますモジュール変数名の内部を変更し、モジュールによりセマンティックな名前を付けると、as を使用して操作できるようになります。

var a ='jspang';
var b ='技术胖';
var c = 'web';
export {
    x as a,
    y as b,
    z as c
}

開発中に変数名が重複する場合、または変数名を変更する必要がある場合、ES6 ではキーワード as を使用してワンクリックで名前を変更できます。

es6 でのエクスポートと同様の使用法は何ですか

[関連する推奨事項: JavaScript ビデオ チュートリアル Web フロントエンド ]

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

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。