cancel
Showing results for 
Search instead for 
Did you mean: 
Read only

UI5 basic concept , sap.ui.define code explanation

BODHISATTWA__20
Participant
0 Likes
1,537

I am new to javascript, hence trying to understand the syntax.

sap.ui.define(['./Helper','sap/m/Bar'],function(Helper,Bar){//create a newclass

varSomeClass=function(){};//addmethodsto its prototype

SomeClass.prototype.foo =function(){// use a functionfrom the dependency 'Helper'in the same package(e.g.'sap/mylib/Helper')

var mSettings =Helper.foo();//createandreturn an sap.m.Bar (using its localname'Bar')returnnewBar(mSettings);}//return the classasmodulevaluereturn SomeClass;});

As per understanding "SAP.UI" is a Namespace and "DEFINE" is a method.

I checked w3 schools,the syntax that they mentioned for calling a method is .

<em>objectName.methodName()</em>

So for the above UI5 code , is my understanding right ?

sap.ui. ------> Namespace

define --------> method

After that there are two arguments that we are passing to the Method placed inside round brackets ()

The first one

['./Helper','sap/m/Bar']

and second one is a Javascript function (which is a parameter)

function(Helper,Bar){//Everything inside the function}

I might be wrong , could you kindly help me if my understanding of the UI5 sytax is right .

Accepted Solutions (0)

Answers (1)

Answers (1)

sergei-u-niq
Active Contributor
0 Likes

you are absolutely correct. define is a function and gets two parameters:

The first one an array

['./Helper','sap/m/Bar']

and second one is a Javascript function :

function(Helper,Bar){//Everything inside the function}

Edit: another interesting question is: what is define doing with the two parameters? a full explanation can be found here: https://sapui5.hana.ondemand.com/#/api/sap.ui%23methods/sap.ui.define

Let me try a simplified version: the array above contains the dependancies (names of dependancies). so define will first load the dependancies (if not already loaded) and then call the second parameter with the loaded dependancies in the same order, so function(Helper,Bar) will be called with the Helper and the Bar as params