<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns:m="http://schemas.microsoft.com/office/2004/12/omml" xmlns="http://www.w3.org/TR/REC-html40">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="Generator" content="Microsoft Word 15 (filtered medium)">
<style><!--
/* Font Definitions */
@font-face
{font-family:"Cambria Math";
panose-1:2 4 5 3 5 4 6 3 2 4;}
@font-face
{font-family:Calibri;
panose-1:2 15 5 2 2 2 4 3 2 4;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
{margin:0cm;
margin-bottom:.0001pt;
font-size:12.0pt;
font-family:"Times New Roman",serif;}
a:link, span.MsoHyperlink
{mso-style-priority:99;
color:#0563C1;
text-decoration:underline;}
a:visited, span.MsoHyperlinkFollowed
{mso-style-priority:99;
color:#954F72;
text-decoration:underline;}
pre
{mso-style-priority:99;
mso-style-link:"HTML Preformatted Char";
margin:0cm;
margin-bottom:.0001pt;
font-size:10.0pt;
font-family:"Courier New";}
p.msonormal0, li.msonormal0, div.msonormal0
{mso-style-name:msonormal;
mso-margin-top-alt:auto;
margin-right:0cm;
mso-margin-bottom-alt:auto;
margin-left:0cm;
font-size:12.0pt;
font-family:"Times New Roman",serif;}
span.EmailStyle18
{mso-style-type:personal-reply;
font-family:"Calibri",sans-serif;
color:windowtext;}
span.HTMLPreformattedChar
{mso-style-name:"HTML Preformatted Char";
mso-style-priority:99;
mso-style-link:"HTML Preformatted";
font-family:"Courier New";
mso-fareast-language:DE-AT;}
.MsoChpDefault
{mso-style-type:export-only;
font-family:"Calibri",sans-serif;
mso-fareast-language:EN-US;}
@page WordSection1
{size:612.0pt 792.0pt;
margin:70.85pt 70.85pt 2.0cm 70.85pt;}
div.WordSection1
{page:WordSection1;}
--></style><!--[if gte mso 9]><xml>
<o:shapedefaults v:ext="edit" spidmax="1026" />
</xml><![endif]--><!--[if gte mso 9]><xml>
<o:shapelayout v:ext="edit">
<o:idmap v:ext="edit" data="1" />
</o:shapelayout></xml><![endif]-->
</head>
<body lang="DE-AT" link="#0563C1" vlink="#954F72">
<div class="WordSection1">
<p class="MsoNormal"><font size="2" face="Calibri"><span style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US">Hi Steve,<o:p></o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US"><o:p> </o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US">to your first question: the `Value value` you expect returned here is the result of the `var` statement
in JavaScript. That statement, by definition, does not return anything (in ECMASCript semantics: it returns `NormalCompletion(Empty)` ). You would be able to access the value if you changed the code to `var w = 5; w;` as the second statement would return `w`’s
value.<o:p></o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US"><o:p> </o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US">What you actually want to do is to access the global scope, where the variable (`w` in your case) is stored
and available. For this, you can access the bindings of the global object (the variable `jBindings` thus represents the global object):<o:p></o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US"><o:p> </o:p></span></font></p>
<p class="MsoNormal" style="background:white"><font size="2" color="#474747" face="Courier New"><span lang="EN-US" style="font-size:10.5pt;font-family:"Courier New";color:#474747">Context.eval("js", "var w = 5; ");<o:p></o:p></span></font></p>
<p class="MsoNormal" style="background:white"><font size="2" color="#474747" face="Courier New"><span lang="EN-US" style="font-size:10.5pt;font-family:"Courier New";color:#474747">Value jsBindings = context.getBindings("js")<o:p></o:p></span></font></p>
<p class="MsoNormal" style="background:white"><font size="2" color="#474747" face="Courier New"><span lang="EN-US" style="font-size:10.5pt;font-family:"Courier New";color:#474747">jsBindings.getMember("w").asInt() == 5;<o:p></o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US"><o:p> </o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US">See
<a href="https://www.graalvm.org/truffle/javadoc/org/graalvm/polyglot/Context.html">
https://www.graalvm.org/truffle/javadoc/org/graalvm/polyglot/Context.html</a> as you might need additional methods of `Value`, like `isNumber` etc.<o:p></o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US"><o:p> </o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US">You could also return an object explicitly, and again use Value’s methods to access the content, e.g.
<o:p></o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US"><o:p> </o:p></span></font></p>
<p class="MsoNormal" style="background:white"><font size="2" color="#474747" face="Courier New"><span lang="EN-US" style="font-size:10.5pt;font-family:"Courier New";color:#474747">Value valueO = Context.eval("js", "</span></font><span lang="EN-US">
</span><font size="2" color="#474747" face="Courier New"><span lang="EN-US" style="font-size:10.5pt;font-family:"Courier New";color:#474747">var o = {foo:42, bar:'test'}; o;");<o:p></o:p></span></font></p>
<p class="MsoNormal" style="background:white"><font size="2" color="#474747" face="Courier New"><span lang="EN-US" style="font-size:10.5pt;font-family:"Courier New";color:#474747">System.out.println(valueO.getMember("bar").asString());<o:p></o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US"><o:p> </o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US"><o:p> </o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US">For your second question, yes, the origin language an object is coming from is something you need to consider.
With our Polyglot Interop protocol, you can access objects from different languages as if they were defined in your guest language (meaning: you can do things like `var x = window.w; windows.newVar = 42;` in JavaScript, when `window` actually is a host object
defined in Java). However, while this is valid JavaScript syntax, the object’s origin language might reject some operations – you suspect correctly that Java won’t be able to create a `newVar` field if it was not already there in the first place. You will
get a similar error message and behavior as if `window` was a frozen JavaScript object, where you can’t define new properties either. A similarly problematic case is that Java arrays can’t grow and thus you cannot access them out-of-bounds, as you can do in
JavaScript by default.<o:p></o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US"><o:p> </o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US">To work around this, you can use a `org.graalvm.polyglot.proxy.ProxyObject` on the Java side. Instead
of using a POJO to define `window`, you create a Proxy, which allows you to react to property to such cases (and e.g. store the new field in a Map) – see the getMember, hasMember and putMember methods in ProxyObject.<o:p></o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US"><o:p> </o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US"><a href="https://www.graalvm.org/truffle/javadoc/org/graalvm/polyglot/proxy/ProxyObject.html">https://www.graalvm.org/truffle/javadoc/org/graalvm/polyglot/proxy/ProxyObject.html</a><o:p></o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US"><o:p> </o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US">In your nightmare case, you will just have to next those Proxies; you might also need ProxyArray and ProxyExecutable
(for the lambda).<o:p></o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US"><o:p> </o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US">Best,<br>
Christian<o:p></o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US"><o:p> </o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US"><o:p> </o:p></span></font></p>
<p class="MsoNormal"><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;mso-fareast-language:EN-US"><o:p> </o:p></span></font></p>
<p class="MsoNormal"><b><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif;font-weight:bold">From:</span></font></b><font size="2" face="Calibri"><span lang="EN-US" style="font-size:11.0pt;font-family:"Calibri",sans-serif">
graalvm-users-bounces@oss.oracle.com <graalvm-users-bounces@oss.oracle.com> <b><span style="font-weight:bold">On Behalf Of
</span></b>Steve Brenneis<br>
<b><span style="font-weight:bold">Sent:</span></b> Montag, 4. Oktober 2021 05:49<br>
<b><span style="font-weight:bold">To:</span></b> graalvm-users@oss.oracle.com<br>
<b><span style="font-weight:bold">Subject:</span></b> [graalvm-users] Javascript Questions<o:p></o:p></span></font></p>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
<div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">Hello.<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">I have a project to analyze how scripts on web pages interact with the browser window and document objects. I can only analyze them. I can't modify them. Most things are
fairly obvious, but I have come up against a couple of items that I can't find answers for anywhere. If there is documentation that I have missed, I would be eternally grateful if someone could point me in the right direction. The project will be written in
Java.<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">Given this evaluation:<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">Value value = context.eval("js", "var w = 5;");<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">value will be of type undefined and value.hasMembers will return false;<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">Is there any way to bring the value of w back to Java?<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">This leads into the second question.<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">In a browser, the window object is actually a pseudonym for the global scope. Therefore<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">var w = 5;<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">can be functionally equivalent to<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">window.w = 5;<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">How does the javascript polyglot line things up between a weakly typed language like javascript and a strongly typed one like Java?<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">I can define a Window class in Java and give it a member variable w<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">class Window {<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"> public int w;<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">}<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">But then, because this is perfectly valid javascipt<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">window.w = 'hello';<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">w obviously can't be typed as an integer.<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">And how would I handle this case?<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">window.x = {<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"> number: 4,<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"> letter: '6',<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"> string: "hello",<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"> method: (() => a = b)<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">}<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">I could define x of type Object, but I would have no idea how to access the members. And obviously if I don't know what variables will be created beforehand, I can't declare
them.<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">I have also run into nightmares like this<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">if (window.z === undefined) {<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"> window.z = [];<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"> window.z.a = { variableOne: "something", variableTwo: "something else"};<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"> window.z.push({variableThree: "another thing", variableFour: "yet another thing"});<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">}<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt">There may be (I hope) a simple solution and I just haven't been able to find it. Any help is appreciated.<o:p></o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
<div>
<p class="MsoNormal"><font size="3" face="Times New Roman"><span style="font-size:12.0pt"><o:p> </o:p></span></font></p>
</div>
</div>
</div>
</body>
</html>