Purpose : Arrow functions allow us to write simple and shorter function Syntax.
***ES6's Arrow functions are now supported in Liquid UI WS
Pre-requisites :
Liquid UI Desktop with version 1.2.365
Syntax:
Test= () => {
return "Hello World";
}
pushbutton ([1,1],"Click Me!", {"process": Test});
Note:
If the function consists of a single line statement and it is returning a value, then skip the return keyword, as Arrow function returns value by default
Test= () => {
"Hello World";
}
pushbutton ([1,1],"Click Me!", {"process": Test});
If the Function has only one parameters, then skip the brackets ().
Example:
Below Example Illustrate the use of Arrow Function, please follow the below steps.
Step-1: Create a script file "SAPLSMTR_NAVIGATION.E0100.sjs" with the following code and save it in your WS scripts directory as configured in guixt.sjs" file.
Liquid UI Code:
// Screen Script
del("X[IMAGE_CONTAINER]");
inputfield ([1,0],{ "name":"z_username", "size":21, "nolabel":true});
z_date = Date();
pushbutton ([1,23], "@0V@Submit ",{ "process":Test, "using":{"user":z_username,"day":z_date}});
// Arrow Function
Test=param=>{
"S: "+"Welcome"+param.user;
"S: "+"Today's date is "+param.day;
}
Step-2: Login to your SAP Server, On the SAP Easy Access Screen Enter some text in the inputfield and Click on "Submit" Pushbutton it will display a Success Message on the Status Bar.
this Keyword in Arrow Function:
this keyword is different in Arrow functions as compared to regular functions.
this keyword represents the object that define the arrow function.
There is no binding of this with arrow function.
Example
Step -1: Create a script file "SAPLSMTR_NAVIGATION.E0100.sjs with the following code and save it in your WS scripts directory as configured in "guixt.sjs" file.
Liquid UI Code:
// Screen Script
del("X[IMAGE_CONTAINER]");
// New implementation of "this" keyword
Test= ()=>this;
pushbutton ([1,1],"Test Arrow function this keyword ",{"process": Test});
// regular function with "this" keyword
function thiskeyword(){
return(this);
}
pushbutton ([3,1],"Test regular function this keyword",{"process":thiskeyword});
Step-2: Login to your SAP Server, On the SAP Easy Access Screen Click on "Test regular function this keyword" Pushbutton it will display "[Object Screen]" on the status bar.
Step-3: Login to your SAP Server, On the SAP Easy Access Screen Click on "Test Arrow function this keyword" Pushbutton it will display "[Object global]" on the status bar.
Refer to the Attachment for further Reference.....
