检查并从响应分配给对象的最佳方法？

Question

With my angular2 application, i am getting the response and assigning to object as follows,

 seatingConcession: {
                        parking: data.concession.extras.parking ? data.concession.extras.parking : null,
                        restrictedview: data.concession.extras.restrictedview ? data.concession.extras.restrictedview : null,
                        wheelchair: data.concession.extras.wheelchair ? data.concession.extras.wheelchair : null
                    }

sometimes extras does not have value. sometimes restrictedview inside extras does not have value. what is the best way to check and assign the default value . Whole code:

 this.eventService.getListingsByEventId(this.eventId).subscribe(listresults => {
            this.bindListing(listresults);
        }, error => this.errorMessage = error);
    }
    bindListing(listres: any[]) {
        let price_table = {};
        let section_table = {};
        listres.forEach((data) => {
            data.ticket.seating.forEach((seat: any) => {
                // tslint:disable-next-line:max-line-length
                this.listings.push({
                    section: seat.section, selling: data.price.selling, amount: data.ticket.amount, type: data.ticket.type, row: seat.row, category: seat.category,
                    seatingConcession: {
                        parking: data.concession.extras ? (data.concession.extras.restrictedview || null) : null,
                        restrictedview: data.concession.extras.restrictedview || null,
                        wheelchair: data.concession.extras.wheelchair  || null
                    },
                    deliveryconcession: {
                        instantdownload: data.delivery.instantdownload || null,
                        readytoship: data.delivery.readytoship  || null,
                        unespecifiedshipment: data.delivery.unspecifiedshipment  || null
                    }
                });
                // this.listings.push({ section: seat.section, selling: data.price.selling, amount: data.ticket.amount, type: data.ticket.type, row: seat.row, category: seat.category});
                // tslint:disable-next-line:curly
                if (!price_table.hasOwnProperty(data.price.selling))
                    price_table[data.price.selling] = [];
                price_table[data.price.selling].push(data);
                // tslint:disable-next-line:curly
                if (!section_table.hasOwnProperty(seat.section))
                    section_table[seat.section] = [];
                section_table[seat.section].push(data);
            });
        });

Service js:

 getListingsByEventId(EventID: string): Observable<ListingSeller[]> {
        let apiurl = this.appConfig.getAPIUrl() + '/getListingsByEventId';

        return this.http
            .get(apiurl + queryString)
            .map(this.extractData)
            .catch(this.handleErrors);
    }

Answer 1

You can use the following function to achieve what you want.

function getSafe(fn) {
    try {
        return fn();
    } catch (e) {
        return null;
    }
}

Then use it like this

seatingConcession: {
    parking: getSafe(() => data.concession.extras.parking),
    restrictedview: getSafe(() => data.concession.extras.restrictedview),
    wheelchair: getSafe(() => data.concession.extras.wheelchair),
}

See details .

Another approach would be to execute data.concession.extras = data.concession.extras || {} data.concession.extras = data.concession.extras || {} before actually creating your object.

Answer 2

You mentioned,

" sometimes extras does not have value. sometimes restrictedview inside extras does not have value "

so, this condition will help you.

data.concession.extras ? (data.concession.extras.restrictedview || data.concession.extras ) : null

Here is an example:

The first example has restrictedview and the second example doesn't.

 data = {} data.concession = { 'extras' : {} } data.concession.extras = { 'restrictedview' : 'restrictedview value'} data2 = {} data2.concession = { 'extras' : 'extras value' } var output = data.concession.extras ? (data.concession.extras.restrictedview || data.concession.extras ) : null var output2 = data2.concession.extras ? (data2.concession.extras.restrictedview || data2.concession.extras ) : null console.log(output) console.log(output2) 

PLEASE RUN THE ABOVE SNIPPET

Answer 3

Observables do try...catch , so for data structures it is possible to follow the pattern:

data$
.map(data => data.complex.path || null)
.catch(() => Observable.of(null))

But for nested structures this will result in complex observable hierarchy which is hard to comprehend.

So basically it is possible to treat complex paths to values with this recipe:

parking: ((data.concession || {}).extras || {}).parking  || null

This case is conveniently treated by Lodash/Underscore get or a similar helper function:

parking: _.get(data, 'concession.extras.parking', null)