4

Here is the JSON object that I have:

  const json = {
        "itemDetails": itemsArray,
        "paymentDetails": [{
            "billingAddress": {
                "address": {
                    "address1": billingAddress.address1,
                    "address2": billingAddress.address2,
                    "zipCode": billingCityStateZip.zipCode,
                    "city": billingCityStateZip.city,
                    "type": "US",
                    "addressType": billingAddress.addressType,
                    "stateCode": billingCityStateZip.stateCode,
                    "country": "US"
                },
                "contactInfo": {
                    "dayPhoneNumber": billingPhone,
                    "companyName": billingAddress.companyName
                },
                "personalInfo": {
                    "firstName": billingAddress.firstName,
                    "lastName": billingAddress.firstName
                }
            },
            "cardType": paymentDetails.cctype,
            "cardNumber": paymentDetails.ccnumber,
            "expirationMonth": paymentDetails.ccmonth,
            "expirationYear": paymentDetails.ccyear,
            "cvv": paymentDetails.cvv,
            "type": "creditCard"
        }],
        "shippingDetails": [{
            "shippingAddress": {
                "address": {
                    "address1": shippingAddress.address1,
                    "address2": shippingAddress.address2,
                    "zipCode": shippingCityStateZip.zipCode,
                    "city": shippingCityStateZip.city,
                    "type": "US",
                    "addressType": shippingAddress.addressType,
                    "stateCode": shippingCityStateZip.stateCode,
                    "country": "US"
                },
                "contactInfo": {
                    "email": email.emailAddress,
                    "dayPhoneNumber": shippingPhone,
                    "companyName": shippingAddress.companyName
                },
                "personalInfo": {
                    "firstName": shippingAddress.firstName,
                    "lastName": shippingAddress.lastName
                }
            },
            "unlimitedDetails": {
                "unlimitedFlag": "",
                "unlimitedSKU": "",
                "unlimiteProductId": ""
            },
            "shippingLabelMessages": {
                "labelMessage1": "",
                "labelMessage2": "",
                "labelMessage3": "",
                "labelMessage4": ""
            },
            "itemDetails": itemsArray,
            "type": "hardGoodShippingType"
        }],
        "couponDetails": [],
        "userDetails": {
            "userCheckoutPreferences": {
                "payViaPaypal": "false",
                "payByVouchersOnly": "false"
            },
            "userDateOfBirth": {
                "day": dob.dobDay,
                "month": dob.dobMonth,
                "year": dob.dobYear
            },
            "password": "",
            "emailFlag": "false",
            "userBusinessPartner": {
                "businessPartner": null,
                "businessPartnerNumber": null
            }
        },
        "offerDetails":{
          "responseCode":responseCode
        },
        "webRedirectDetails": {
        }
    }
    return json;

I would be passing data into this through props in react-redux, but looking for the most effiencient way to creat the object.

I have been looking at creating ES6 classes and returning the JSON after formatting it into the right structure. The data I'm getting in, isnt the same format as that I need to submit to an API as above.

I wrote this class, which seems to work - but not sure if its the best way forward?

class AddressObject {
  constructor(object) {

    // Create Address
    this.address = {};
    this.address.address1 = object.address1;
    this.address.address2 = object.address2;
    this.address.zipCode = object.zipCode;
    this.address.city = object.city;
    this.address.state = object.state;
    this.address.type = object.type;
    this.address.addressType = object.addressType;
    this.address.country = object.country;

    // Create contactInfo
    this.contactInfo = {};
    this.contactInfo.dayPhoneNumber = object.dayPhoneNumber;
    this.contactInfo.companyName = object.companyName;

    // Create personalInfo
    this.personalInfo = {};
    this.personalInfo.firstName = object.firstName;
    this.personalInfo.lastName = object.lastName;
  }

  getAddress() {
   return this
  }

}

Please help!

1
  • seems like a function would be simpler than a class. function transformData (object) { return { // do transformations } }
    – azium
    Nov 22, 2016 at 1:00

2 Answers 2

0

Combination of ES6 features destructuring assignment and shorthand property assignment can simplify formatting your object.

You can start destructuring from your parameters and even renaming the variable and adding default value.

So for an input object that looks something like this...

{
  address_1: 'my address line 1',
  address_2: 'my address line 2',
  city: '...',
  contact: {
    firstName: 'John',
    lastName: 'Smith',
    phone: '1234'
  }
}

Instead of writing your function like this

function formatData(data) {
   return {
      address1: data.address_1,
      ...
   }
}

You can write your function like this...

function formatData({
   address_1: address1, 
   address_2: address2 = '', 
   city, 
   zipCode, 
   state, 
   contact: { 
       firstName, 
       lastName, 
       phone: dayPhoneNumber 
   }
}) {
   return {
      addressData: {
          address1,
          address2,
          city,
          zipCode,
          state
      },
      contactInfo: {
         companyName,
         dayPhoneNumber
      }
   }
}

The return value uses shorthand notation of assigning...

You don't have to do

{
   address1: address1,
   address2: address2
   ...
}
1
  • Thank you jpdelatorre, this definitely will help me to clean this up. So could I setup that as a module export, then just include it and pass in the params, and it would return a structured object for me?
    – jrutter
    Nov 22, 2016 at 4:28
0

A function would definitely be better than a class, as mentioned in the comments. Also, if your question is what the most ES6 way of doing is (as in, most compact and clean) then I suggest making full use of the destructuring features:

function formatDataForAPI(data) {
  const {
    address1,
    address2,
    zipCode,
    city,
    state,
    type,
    addressType,
    country,
    dayPhoneNumber,
    companyName,
    firstName,
    lastName,
  } = data;

  return {
    addressData: {
      address1,
      address2,
      zipCode,
      city,
      state,
      type,
      addressType,
      country,
    },
    contactInfo: {
      dayPhoneNumber,
      companyName,
    },
    personalInfo: {
      firstName,
      lastName,
    },
  };
}

Of course your way works just as well. This is just less heavy than a class and easier on the eyes. Note that it only works because the names of your keys are the same, but can be easily changed if they were not.

1
  • Thank you ZekeDroid - this is exactly the help and guidance I was looking for!
    – jrutter
    Nov 22, 2016 at 4:26

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.