Was ist der beste Weg, um Daten zu übergeben und ein Objekt zu exportieren?

Question

Hier ist das JSON-Objekt, das ich habe:

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; 

ich Daten in die durch Requisiten in reagieren-redux würde vorbei, aber auf der Suche für den meisten effiencient Weg, um das Objekt zu creat.

Ich habe versucht, erstellen ES6-Klassen und die JSON nach der Formatierung in die richtige Struktur zurück. Die Daten, die ich erhalte, haben nicht dasselbe Format wie das, das ich wie oben an eine API senden muss.

Ich schrieb diese Klasse, die zu funktionieren scheint - aber nicht sicher, ob es der beste Weg nach vorne ist?

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 
    } 

} 

Bitte helfen!

Answer 1

Die Kombination der ES6-Funktionen destructuring assignment und shorthand property assignment kann die Formatierung Ihres Objekts vereinfachen.

Sie können das Destrukturieren von Ihren Parametern aus starten und sogar die Variable umbenennen und den Standardwert hinzufügen.

So für ein Eingabeobjekt, das ungefähr so ​​aussieht ...

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

Statt Ihre Funktion des Schreibens wie dieses

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

Sie Ihre Funktion wie diese schreiben kann ...

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 
     } 
    } 
} 

Der Rückgabewert verwendet Kurzschreibweise zum Zuweisen ...

Sie müssen scheint nicht tun

{ 
    address1: address1, 
    address2: address2 
    ... 
} 

Answer 2

Eine Funktion wäre definitiv besser als eine Klasse, wie in den Kommentaren erwähnt. Auch wenn Ihre Frage ist, was die meisten ES6 Art und Weise zu tun, ist (wie in, kompakteste und sauber), dann schlage vor, dass ich die volle Nutzung der Destrukturierung Merkmale:

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, 
    }, 
    }; 
} 

Natürlich Weg genauso gut funktioniert. Dies ist nur weniger schwer als eine Klasse und einfacher für die Augen. Beachten Sie, dass es nur funktioniert, weil die Namen Ihrer Schlüssel identisch sind, aber leicht geändert werden können, wenn dies nicht der Fall ist.