2017-12-31 56 views
-1

定数を宣言してデフォルトとしてエクスポートするか、デフォルトのエクスポートとして直接宣言するかの違いはありますか? 2番目のコードはより洗練されたコードになりますが、最初のケースとまったく同じように扱われているのか、インポート時に別のファイルからリクエストされるたびに作成されたのか分かりません。JS ES6:constを宣言してデフォルトとしてエクスポートするか、デフォルトのエクスポートとして直接宣言するかの違い

const myFunction = (a) => { … } 
export default myFunction 

そして:

export default (a) => { … } 
機能を使用して

export default { … } 

、または同じ:例えば

、このコード:この1対

const myValue = { … } 
export default myValue 

答えて

0

実装がES6モジュールの仕様に完全に準拠している場合、大きな違いになります。モジュールは、バインディングをエクスポートします。これは、ここで説明されています(ほぼ)すべての他の局面において

https://ponyfoo.com/articles/es6-modules-in-depth#bindings-not-values

、Javascriptが純粋に参照を使用しています。変数はメモリ内の実際のデータへのポインタです。ある変数を別の変数にコピーすると、値ではなくポインタがコピーされます。新しい値を変数に代入すると、新しいデータチャンクが作成され、変数のポインタが新しいデータに移動し、古いデータがガベージコレクションされます。プリミティブは、値によって関数やオブジェクトに参照渡しされるという一般的な誤解があります。実際にはすべて参照渡しであり、プリミティブは変更不可能なため値渡しされているように見えます。プリミティブを変更すると、元の値をインプレースで変更するのではなく、新しい値を優先して古い値を破棄します。

ただし、バインディングはと同じです。何かをエクスポートすると、ITへの参照ではなくITをエクスポートします。エクスポートされた値が元のモジュールの後半で変更された場合、この変更はモジュールを消費するモジュールに反映されます。さらに悪いことに、別のモジュールがバインディングを変更すると、元のモジュールと他のすべてのモジュールを反映します。

サードパーティのモジュールインポーターまたはロールアップツールを使用している場合は、エンジン自体の外部に複製するのが非常に難しいため、この動作が発生しない可能性があります。だから、あなたはこれから何か何年にもわたって影響を受けることはないかもしれませんが、将来的には問題になるでしょう。

したがって、不快な驚きを防ぐために常にコンストレインをエクスポートすることをお勧めします。

+0

ありがとう!それから私はこのパターンを使用します。 – adrianhurt

0

まず、constが特定の変数に適用されることを覚えておいてください。その変数に異なる値を代入するのを防ぎます。値自体はconstではありません。 constアスペクトは、constと宣言されている変数自体に適用され、その値はどのような値を保持します。したがって、あなたの例では、そのモジュール内の実際のmyValue変数にのみ適用され、変数には何の値も適用されません。これでそう

、:constあるとconst側面は、あなたがmyValue変数に別の何かを割り当てることができないことを意味し

const myValue = { … } 
export default myValue 

それはmyValue変数(ないその値)です。その同じ値を別の非const変数にコピーすると、他の変数に自由に任意のものを割り当てることができます。

変数の値をエクスポートすると、その変数はインポートする変数に割り当てられますが、constと宣言されていない限り、constではありません。このモジュールのconstは、それをインポートする他のモジュールの他の変数には何の影響も与えません。

あなたは論理的に(インポートモジュール内の)別の変数に値を割り当てるような種類のこのようエクスポートとインポートを考えることができます:私はあなたがすでに実現推測として、constとして

// exported value 
const myValue = { … };  // exporting makes it available so others can import it 

// imported value 
let importedValue = myValue; // importing assigns the exported value to a new variable 

// further assignment 
importedValue = "foo";  // this is allowed because importedValue is not 
           // declared as const 

そして、 -nessの値がmyValueの場合、importedValueはまったくありません。 myValueimportedValueにあるもののコピーが含まれていて、他の値を割り当てることができます。 const自体ではないので、constではありません。

定数を宣言してからデフォルトとしてエクスポートするか、デフォルトの書き出しとして直接宣言するかの違いはありますか?

エクスポートされた値に違いはありません。値自体は、JavaScriptのconstではないため、変数のみです。違いはconstと宣言されているローカル変数のみであり、インポートするモジュールがアクセスできるものではないため、インポートするモジュールと違いはありません。

変数の値が何であるかは重要ではありません機能を使用して

か、同じ(機能、オブジェクト、プリミティブ、等...)。すべてのタイプで同じです。変数がconstと宣言されている場合、その変数に別の値を代入することはできません。しかし、その値をconstと宣言されていない別の変数にコピーすると、その非const変数に必要なものをさらに割り当てることができます。それは値ではなくconstの変数です。 constは、読み取り専用変数の宣言と同じように考えることができます。

+0

ありがとうございます。非常に完全ですが、私は私の質問では十分正確ではないと思います。定数についてではなく、エクスポートする前にそれを宣言していた。私は 'const'を最も一般的なパターンなので使用しましたが、' let'や 'var'を使うことができます。ありがとう! – adrianhurt

関連する問題