Dear SAPLearners, in this blog post i would like share most commonly used Javascript tips for UI5 developers used during UI5 application development.
Tip #1: Best way to use filter() function
In SAP, we know that address of sold-to or ship-to party is stored in multiple fields of a table. For example Street2, Street, City, Region, Country and Postal Code.
In most test cases, data may be available in some fields and other fields are blank.
When displaying the full address in UI5 applications with these fields, usually we will check for emptiness and concatenate these fields; something like below.
The above code perfectly works fine but with many lines of code. Lets look a simplified code using filter() function.
The above code is more cleaner and simplified. Aslo displays formatted address, if any of the field is empty.
Tip #2: Using find() (or) findIndex() function
This tip is to find an element in an array that satisfies the condition. Most of the UI5 developers use for loop like below.
But there is a cleaner way of doing the same using array function find(). Check the code below.
The above code returns an element that matches the condition. If you need index of it use findIndex().
Tip #3: Use of push() and unshift()
To add one or more elements at the end of an array we use push() method. Sample code below.
But if want an element to be added at beginning of the an array, unshift() method can be used. Sample code below.
Tip #4: Use of filter()
filter() method is used to create a new array with elements that satisfies given condition from an existing array. Sample code below
Most of UI5 developers uses for loop in the above case, which can be replaced using filter() method.
Tip #5: Use of reduce()
reduce() method is used to return a single value by performing reducer function on each element of an array. Sample code below.
In the above code we are calculating total net price of all items.
Conclusion
Congrats!! you have learned Top 5 Java Scripts tips and tricks for UI5 developers. Hope you liked it.
Please feel free to comment and let us know your feedback. Subscribe for more updates
If you liked it, please share it! Thanks!
