如何在ES6中访问和使用导入功能

Question

I'm having trouble accessing the imported labelsForCountryCode function. When passing 'US' into this function, I'm expecting to have the US object returned. I'm new to ES6 and not exactly sure what I'm doing wrong here. Appreciate any help!

billing-address-labels-lookup.js

export default function billingAddressLabelsLookup() {

const labelsLookup = {
  'US': {
    addressLineOne: 'Street/Address',
    city: 'City',
    provinceCode: 'State',
    postalCode: 'Zip Code'
  },
  'CA': {
    addressLineOne: 'Street/Address',
    city: 'City',
    provinceCode: 'Province',
    postalCode: 'Postal Code'
  }
};

return {
  labelsForCountryCode(countryCode) {
    return labelsLookup[countryCode];
  }
};

};

test.js

 import billingAddressLabelsLookup from '../utils/billing-address-labels-lookup.js';

 var labels = billingAddressLabelsLookup.labelsForCountryCode('US');

Answer 1

Just replace:

var labels = billingAddressLabelsLookup.labelsForCountryCode('US');

with:

var labels = billingAddressLabelsLookup().labelsForCountryCode('US');
                                       ^^------ function call

Otherwise, you're trying to access the function reference's property , while you need to access the function's result .

About import and exports, please take a look at this chapter specifically: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export#Using_the_default_export