Variant data type |
We can also use variants in external classes. The External classes are the glue between Smart Pascal and the javascript world. It's important to say these external classes are case sensitive, in fact, the external code is only interfaced – this is not a real class, but an external class. This means that we only need the definition while the implementation is done by the external JavaScript code.
The Variants are treated as "unknown" by the smart pascal codegen. Variants are primarily used to transport native values and objects between methods dealing with javascript objects or browser objects. So Smart Mobile Studio compiler deals with variants as unknown values. Use it with care - there are potentials for run time errors and poor code clarity when using variants. For instance, the compiler does not check if a method of an object actually exists.
this |
In JavaScript the value of this is determined mostly by the invocation context of function and where it is called. Se, we can interface with native javascript objects with object pascal and create powerful components.
We can declare this variable using two ways:
{ using external variable } var this external "this" : variant; { or using external function } function this: variant; external 'this' property;
then we can use this external variable, such as:
procedure HandleCallback(a: variant); begin console.log(a); end; procedure InvokeByVariant; var mSrc: variant; begin mSrc := this.document; (* invoke our method *) HandleCallback(mSrc); end;
Variant parameter |
procedure HandleCallback(data: variant); begin // end;
In the sample code, it remains unclear the argument data. I'd call them a better name because that gives you more of a chance of understanding at a glance what your code means. You can customize it, so the method looks like this now:
type TJSONData = Variant; procedure HandleCallback(data: TJSONData); begin // end;
Literal object using the keyword Class |
I'd like to create a JS literal object in smart pascal, like this:
var object1 = { "child" : { "Callback" : function () { console.log(this); return this;
} }
};
As has been said: variants are treated as "unknown" by the smart pascal codegen. The smart compiler does no check if a method f.i. actually exists! Use it with care.
var object1 := CLASS that: variant = class external; child = class Callback := function(): variant begin console.log(this); Result := this; end; end; END; procedure CallMe(unknown: variant); begin unknown.Name := "MyName"; unknown.Age := 102; unknown.Callback(unknown); end; CallMe(Object1.child); CallMe(CLASS Callback := lambda console.log('this is a test'); end; END);
JS Emitted:
function CallMe(unknown) { unknown.Name = "MyName"; unknown.Age = 102; unknown.Callback(unknown); }; var object1 = { "child" : { "Callback" : function () { var Result = undefined; console.log(this); Result = this; return Result } } ,"that" : { } }; CallMe(object1.child); CallMe({ "Callback" : function () { console.log("this is a test"); } });
Array of Array of Integer |
I've got weird result using this approach:
an easy workaround would be defining a local variable like this:
Now I would like to create a JSON object like this:
var preloaded = CLASS values : array [0..4] of array [0..1] of Integer = [ [0, 100],[1000, 200],[2000, 300],[3000, 400],[4000, 500] ]; END; console.log(JSON.stringify(preloaded)); {"values":[[4000,500],[1000,200],[2000,300],[3000,400],[4000,500]]}
an easy workaround would be defining a local variable like this:
var valor : array [0..4] of array [0..1] of Integer = [ [0, 100],[1000, 200],[2000, 300],[3000, 400],[4000, 500] ]; var preloaded2 = CLASS values := valor; END; console.log(JSON.stringify(preloaded2)); {"values":[[0,100],[1000,200],[2000,300],[3000,400],[4000,500]]}
JSON Array Object |
[{"id":1,"name":"Item#1"},{"id":2,"name":"Item#2"},{"id":3,"name":"Item#3"},{"id":4,"name":"Item#4"},{"id":5,"name":"Item#5"},{"id":6,"name":"Item#6"},{"id":7,"name":"Item#7"},{"id":8,"name":"Item#8"},{"id":9,"name":"Item#9"},{"id":10,"name":"Item#10"}]
var obj := CLASS
that: variant = class external; child = class Callback := function(): variant begin Result := this; end; end; "JSONArray1": array of variant; "JSONArray2": array of variant; "JSONArray3": array of variant; "JSArray": array of variant; "name": string = "obj"; "f" : TFunc = function(): variant begin result := this.that; end; END;
for var x:=1 to 10 do begin obj.JSONArray1.add(CLASS name := "Item#" + IntToStr(x); id := x; END); end;
Javascript Array |
["Item#1", "Item#2", "Item#3", "Item#4", "Item#5", "Item#6", "Item#7", "Item#8", "Item#9", "Item#10"]
for var x:=1 to 10 do begin obj.JSArray.add("Item#" + IntToStr(x)); end;
Array of JSON Array |
[[{"age":1,"nome":"Nome#1"},{"cep":"35700-001","address":"Addr#1"},{"country":"Country 1","city":"City#1"}],[{"age":2,"nome":"Nome#2"},{"cep":"35700-002","address":"Addr#2"},{"country":"Country 2","city":"City#2"}],[{"age":3,"nome":"Nome#3"},{"cep":"35700-003","address":"Addr#3"},{"country":"Country 3","city":"City#3"}],[{"age":4,"nome":"Nome#4"},{"cep":"35700-004","address":"Addr#4"},{"country":"Country 4","city":"City#4"}],[{"age":5,"nome":"Nome#5"},{"cep":"35700-005","address":"Addr#5"},{"country":"Country 5","city":"City#5"}],[{"age":6,"nome":"Nome#6"},{"cep":"35700-006","address":"Addr#6"},{"country":"Country 6","city":"City#6"}],[{"age":7,"nome":"Nome#7"},{"cep":"35700-007","address":"Addr#7"},{"country":"Country 7","city":"City#7"}],[{"age":8,"nome":"Nome#8"},{"cep":"35700-008","address":"Addr#8"},{"country":"Country 8","city":"City#8"}],[{"age":9,"nome":"Nome#9"},{"cep":"35700-009","address":"Addr#9"},{"country":"Country 9","city":"City#9"}],[{"age":10,"nome":"Nome#10"},{"cep":"35700-0010","address":"Addr#10"},{"country":"Country 10","city":"City#10"}]]
In my experiments,
for var x:=1 to 10 do begin var objeto := [CLASS nome : string = "Nome#" + IntToStr(x); age : integer = + x; END, CLASS address: string = "Addr#" + IntToStr(x); cep : variant = '35700-00'+ IntToStr(x); END, CLASS city : string = "City#" + IntToStr(x); country: string = "Country " + IntToStr(x); END]; obj.jsonarray2.push(objeto); end;
var obj = null, x$32 = 0; var objeto = [null,null,null]; /// anonymous TClassSymbol /// anonymous TClassSymbol TApplication.InitApp(Self); obj = { "that" : { } ,"name" : "obj" ,"JSONArray3" : [] ,"JSONArray2" : [] ,"JSONArray1" : [] ,"JSArray" : [] ,"f" : function () { var Result = undefined; Result = this.that; return Result } ,"child" : { "Callback" : function () { var Result = undefined; Result = this; return Result } } }; for(x$32=1;x$32<=10;x$32++) { /// anonymous TClassSymbol /// anonymous TClassSymbol /// anonymous TClassSymbol objeto = [{ "age" : x$32 ,"nome" : "Nome#"+x$32.toString() }, { "cep" : "35700-00"+x$32.toString() ,"address" : "Addr#"+x$32.toString() }, { "country" : "Country "+x$32.toString() ,"city" : "City#"+x$32.toString() }]; obj.JSONArray2.pusha(objeto.slice(0)); }
to be continued... |
I ended up spending a decent amount of time trying different things to get this TW3DataSet as in memory dataStore. To save some headaches, I decided to create my own data store, it’s ugly, unfinished, I find it more flexible to use it through the units. I don't know if the right stack, anyway, stay tuned.