ES6な破壊と、私はこの構文という印象の下にあったモジュールの輸入

Question

：

import Router from 'react-router'; 
var {Link} = Router; 

は、これと同じ最終結果があります。

import {Link} from 'react-router'; 

は、誰かが違いとは何かを説明できますか？

（私はもともとそれがReact Router Bugだと思った。）

Answer 1

import {Link} from 'react-router'; 

は

export const Link = 42; 

---

import Router from 'react-router'; 
const {Link} = Router; 

のようなものは、財産を引き出しすなわち、react-routerからという名前の輸出をインポートLinkデフォルトのエクスポートは、それがオブジェクトであると仮定します。

export default { 
    Link: 42 
}; 

（デフォルトのエクスポートは、名前が「デフォルト」の標準化された名前付きエクスポートだけです）。

export on MDNも参照してください。

コンプリート例：バベル5とし、以下の

// react-router.js 
export const Link = 42; 
export default { 
    Link: 21, 
}; 


// something.js 
import {Link} from './react-router'; 
import Router from './react-router'; 
const {Link: Link2} = Router; 

console.log(Link); // 42 
console.log(Link2); // 21 

---

は、私は、彼らがためES6モジュールはCommonJSにtranspiledされている方法で交換されていると信じています。しかし、それらは言語が進む限り、2つの異なる構成要素です。これを行うために

Answer 2

：シンボルごとexport constを繰り返すことなく

import {purple, grey} from 'themeColors'; 

は、単に実行します。

export const 
    purple = '#BADA55', 
    grey = '#l0l', 
    gray = grey, 
    default = 'this line actually causes an error';