lwc:programming:javascript [wiki]

This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong.
  * you don't have to use var but if you don't the variable is defined globally (although it still can be deleted.) Seems like bad practice.
  * everything appears to be call-by-value except for arrays and other objects, like functions. So if you wanted to change variable a you could make a an array and send the array.
  * you can read the properties associated with an object with "Object.keys($(this))"

 
| find all elements ids with class "buttonClass"| var elements = document.getElementsByClassName("buttonClass");\\ for (var i = 0, len = elements.length; i < len; i++) {\\ \\     console.log(elements[i].id);\\ \\ }|
| callback function when mouse leaves button_8  | $( document ).on( "vmouseout", "#button_8", function(){                                                                                                                     |
| set style of myPath2                          | document.getElementById("myPath2").setAttribute('style',"animation:fade 500ms infinite; -webkit-animation:fade 500ms infinite;");                                           |
| get caller of function                        | alert("caller is " + arguments.callee.caller.toString());                                                                                                                   |
| find all methods of an object                 | var methods = []; for (var m in obj) { if (typeof obj[m] == "function") { methods.push(m); } } alert(methods.join(","));                                                    |
| loop through a set of values                  | [1,2,3,4].map(function(item) { <code>      alert(item); }) </code>                                                                                                  |



Sockets seem to work (in Firefox at least) with [[http://stephengware.com/proj/javasocketbridge/|this Java bridge]]. [[https://docs.google.com/file/d/0B373EJKafYovMlVnUG9IaWJwZE0/edit?usp=sharing|Python script to work with js sockets]]
Load data using ajax and json. stringify? json.parse? It would be possible to interpret even svg files in the browser using json.
  * when using ajax with Phonegap it might be necessary to say in config.xml that you trust 127.0.0.1.

JSON:
  * to save a JSON file, either print it to the screen or send it to a server as explained [[http://stackoverflow.com/questions/17027101/how-to-write-json-files-in-javascript|here]].

Ajax:
  * great example: http://www.tutorialspoint.com/json/json_ajax_example.htm
  * nice tutorial: http://www.w3schools.com/ajax/ajax_intro.asp
  * this slide lays it out: http://www.webstepbook.com/supplements-2ed/slides/chapter12-ajax-xml-json.shtml#slide50

singleton objects: do them with a "lazy initializer" i.e. this way:
  * 
  * MyApp.getInstance = function(){
  *     if(MyApp.instance == null){
  * MyApp.instance = new MyApp();
  * }
  *     return MyApp.instance;
  * };
  * Then in the window environment create the instance:  myApp = MyApp.getInstance();

wrapping a function:

<code>
If you have a function call and you need to send it parameters (such as 

$(document).on("vmousedown", myFunction) you can wrap the function inside an anonymous function i.e.\\
$(document).on("vmousedown", function() {\\
    myFunction(parameter)});
</code>

Garbage Collection:

  * you can call Garbage Collection yourself in Chrome by [[https://www.mail-archive.com/crosswalk-help@lists.crosswalk-project.org/msg00282.html|using flags]]. Also note [[https://code.google.com/p/v8/source/browse/branches/bleeding_edge/src/flag-definitions.h|this]] and [[http://create.tpsitulsa.com/wiki/V8/Garbage_Collection|this]]

==== Console Fun ====
  * to see all the event messages flying around: ''monitorEvents(window);''
  * then to unsee: ''unmonitorEvents(window);''

==== Promises ====
Promises are always async and often used to prevent UI blocking when waiting for something like an I/O interface. If a function has a ''.then'' then it is definitely calling a promise (or a "thenable" object but yeah that doesn't happen)
=== Creating the promise (producing) ===
<code>
myPromise = Promise(success, failure) {
  // do something that takes some time here
  if (succeeded) {
    success() { // what to return on success i.e. "3" or "hello"}; // this is not a function. It's just a return value
  else
    failure() { // what to return on failure }; // this is not a function but only a return value
} 
</code>
=== Calling or running the promise (consuming) ===
== Using .then(onFulfilled, onRejected) ==
//this is the less preferred method//
<code>
myPromise.then(
  successFunction(value) { // do stuff here with value which was returned by 'success' above }
  failFunction(value) { // do stuff here with value returned by 'failure' above })
</code>
== Using .catch ==
// this is best practice in general //
<code>
myPromise.then(
  successFunction(value) { // do stuff here with value returned by 'success' when declaring promise })
  .catch(failFunction(value) { // do stuff here with value returned by 'failure' above. also called if an error in successFunction })
</code>
==== Arrow Notation ====
^ Category ^ Old Skool       ^ Arrow Function          ^
| No Parameter    | function fred() = {}     | () => {}       |
| One Parameter   | function fred(a) = {} | (a) => {} or a => {} (parens are optional when only 1 argument)|
| Two Parameters  | function fred(a,b) = {}     | (a,b) => {}        |