小編給大家分享一下export和export default的示例分析，希望大家閱讀完這篇文章后大所收獲，下面讓我們一起去探討吧！

專注于為中小企業(yè)提供成都做網(wǎng)站、網(wǎng)站制作服務,電腦端+手機端+微信端的三站合一,更高效的管理,為中小企業(yè)桃山免費做網(wǎng)站提供優(yōu)質(zhì)的服務。我們立足成都，凝聚了一批互聯(lián)網(wǎng)行業(yè)人才，有力地推動了上千家企業(yè)的穩(wěn)健成長，幫助中小企業(yè)通過網(wǎng)站建設實現(xiàn)規(guī)模擴充和轉(zhuǎn)變。

網(wǎng)上有很多關(guān)于export和export default的文章，他們大部門都是只講了用法，但是沒有提到性能，打包等關(guān)鍵的東西。
大家應該應該能理解import * from 'xxx'會把文件中export default的內(nèi)容都打包到文件中，而import {func} from 'xxx' 只會把文件中的func導入，這樣勢必export會比export default打包的少。看例子

utils.js

const func1 = () => {
    console.log('func1');
}

const func2 = () => {
    console.log('func2');
}

export default {
    func1,
    func2
}

index.js

import { render } from "react-dom";
import common from './common';

class Index extends Component {
  render() {
    common.func1();
    return (
      123456
    );
  }
}

render(, document.getElementById('app'));

用這種export default的方法那么打包的文件會是怎么樣的呢？我們看看

我們發(fā)現(xiàn)整個文件被打包了

用另一種方式
utils.js

const func1 = () => {
    console.log('func1');
}

const func2 = () => {
    console.log('func2');
}

export {
    func1,
    func2
}

index.js

import { render } from "react-dom";
import {func1} from './common';

class Index extends Component {
  render() {
    func1();
    return (
      123456
    );
  }
}

render(, document.getElementById('app'));

結(jié)果：

只打包了func1

綜上export default確實可能會打包更多不需要的內(nèi)容，但是在某些場景用export default更好。
所以總結(jié)如下：

1.當文件存放著很多方法，變量不同場景需要引用不同方法，請用export
2.當類只有某幾個方法，并且每次引用都需要用到里面的大部分方法，請用export default，
  畢竟還有方法提示
3.當值導出一個方法，類請用export default
4.如果一個文件只會被某一個其他文件的子文件，不會被其他文件引用，并且其中的方法都會被用到，
  考慮用export default。比如某個業(yè)務文件夾下的action.js，用的時候用import api from './action';
  方便識別，不用重復在import的{}中添加，也可以用方法提示。
4.如果一個文件兼有以上需求 可以同時export和export default

看完了這篇文章，相信你對export和export default的示例分析有了一定的了解，想了解更多相關(guān)知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝各位的閱讀！

另外有需要云服務器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務器15元起步，三天無理由+7*72小時售后在線，公司持有idc許可證，提供“云服務器、裸金屬服務器、高防服務器、香港服務器、美國服務器、虛擬主機、免備案服務器”等云主機租用服務以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務可用性高、性價比高”等特點與優(yōu)勢，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應用場景需求。

網(wǎng)站題目：export和exportdefault的示例分析-創(chuàng)新互聯(lián)
新聞來源：http://weahome.cn/article/dihiei.html