Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- becki:linux:javascript [2010-04-13 08:40]
becki
+++ becki:linux:javascript [2011-03-21 17:04] (aktuell)
becki
@@ Zeile 1: / Zeile 1: @@
-[[:becki:|Home]]
 ====== Javascript ======
+===== Links ==
+[[http://de.selfhtml.org/javascript/objekte/|Selfhtml]] - [[https://developer.mozilla.org/en/Core_JavaScript_1.5_Guide|JavaScript 1.5 Guide]] - [[https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference|JavaScript 1.5 Reference]] - [[https://developer.mozilla.org/en/Gecko_DOM_Reference|Gecko DOM Reference]] - [[http://msdn.microsoft.com/en-us/library/ms533050%28VS.85%29.aspx|M$ HTML and DHTML Reference]] - [[Dojo]] - [[html5]] - [[jrunscript]]
 ===== Variables ==
 ==== var Keyword ==
 Within functions always prefix variables with ''var'', otherwise they become global! See [[http://dojotoolkit.org/book/dojo-book-0-9/part-3-programmatic-dijit-and-dojo/modules-and-namespaces|Avoid Global namespace]]
+===== Strings ==
+A string can be an instance of the ''String'' class or a string literal. [[https://developer.mozilla.org/en/Core_JavaScript_1.5_Guide/Working_with_Objects#String_Object|More]]
+==== String Literals ==
+There is no difference between ''%%'A string'%%'' and ''%%"A string"%%'' [[https://developer.mozilla.org/en/Core_JavaScript_1.5_Guide/Values%2c_Variables%2c_and_Literals#String_Literals|More]]
+A string literal is temporarely converted into a ''String'' object as soon as you apply methods of ''String'' class to the string literal.
+==== Creating Strings ==
+<code javascript>
+var s1 = "foo";             //creates a string literal value
+var s2 = new String("foo"); //creates a String object
+</code>
+[[https://developer.mozilla.org/en/Core_JavaScript_1.5_Guide/Working_with_Objects#String_Object|More]]
+==== String Concatenation ==
+<code javascript>
+var a= "al" + "pha" // a == "alpha"
+a   += "bet"        // a = "alphabet"
+</code>
+==== String Comparison ==
+FIXME Because Strings are ojects, String comparison is the same as object comparison :?:
+==== String Methods/Property ==
+String length: ''var len = mystring.length;''
+[[https://developer.mozilla.org/en/Core_JavaScript_1.5_Guide/Working_with_Objects#String_Object|All string methods]]
+===== Arrays ==
+An Array is an instance of the ''Array'' class. [[https://developer.mozilla.org/en/Core_JavaScript_1.5_Guide/Working_with_Arrays|More]]
+==== Creating Arrays ==
+<code javascript>
+var arr= new Array(element0, element1, ..., elementN);
+var arr= [element0, element1, ..., elementN];
+var arr= new Array(arrayLength);
+var arr= [];
+</code>
+==== Array Methods/Property ==
+Array length: ''var len = myarray.length;''
+[[https://developer.mozilla.org/en/Core_JavaScript_1.5_Guide/Working_with_Arrays#Array_methods|Array Methods]]
 ===== Objects and Inheritance =====
+==== Object creation ==
+=== The classic Java-like way ==
+<code javascript>
+function Point(x, y) {this.x=x; this.y=y;}
+Point.prototype.toString = function() {return "("+this.x+"/"+this.y+")";}
+Point.prototype.shift    = function(dx, dy) {this.x+=dx; this.y+=dy;}
+var p  = new Point(3,4);
+document.write("p:"+p.toString());
+</code>
+=== The closure way ==
+(closures see below)
+<code javascript>
+function makePoint(x, y) { return {
+    toString: function() {return "("+x+"/"+y+")";}
+    shift:    function(dx, dy) {x+=dx; y+=dy;}
+};}
+var p  = makePoint(3,4);
+document.write("p:"+p.toString());
+</code>
+FIXME
+  * This variant is to be verified
+  * Does this cause overhead?
+  * What about inheritance?
+=== Object literals ==
+FIXME
+==== Object cloning ==
+Objects are [[http://www.thescripts.com/forum/thread718427.html|passed by refernce]] => Something like a copy constructor is necessary:
+<code javascript>
+function Point(x, y) {this.x=x; this.y=y;}
+Point.prototype.clone= function() {return new Point(this.x, this.y);}
+Point.prototype.toString= function() {return "("+this.x+"/"+this.y+") ";}
+var p  = new Point(3,4);
+var pr = p;		// a reference to p
+var q  = p.clone();	// a new Point instance with the same coordinates as p
+p.x= 9; p.y=-2;		// change content of p
+document.write("p:"+p.toString()+ "pr:"+pr.toString()+ "q:"+ q.toString());
+// result: p:(9/-2) pr:(9/-2) q:(3/4)
+</code>
+==== Object Comparison ==
+FIXME
 ==== Defining Methods ====
 === Method definition inline inside of the constuctor ===
@@ Zeile 16: / Zeile 128: @@
 </code>
-Seems to cause overhead, see http://phrogz.net/JS/Classes/OOPinJS.html
+  * Seems to cause overhead, see [[http://phrogz.net/JS/Classes/OOPinJS.html|OOP in JS, Part 1 : Public/Private Variables and Methods]]
+  * This is callad a privileged method (which has access to private methods, see below)
 === External method definition and link to object inside of the constructor ==
@@ Zeile 47: / Zeile 160: @@
 Seems to be the **best** solution :-)
-==== Access Types ====
+==== Public Access ==
 <code javascript>
@@ Zeile 82: / Zeile 195: @@
 </code>
-Private methods seem to be only possible as inline constructor functions, but those seem to cause overhead.
+==== Public Access ==
-==== Object creation ==
+Private methods are possible as inline constructor functions:
-The classic Java-like way:
 <code javascript>
-function Point(x, y) {this.x=x; this.y=y;}
+function MyClass() {         // The constructor
-Point.prototype.toString = function() {return "("+this.x+"/"+this.y+")";}
+    var privateVariable= 10; // A private instance variable
-Point.prototype.shift    = function(dx, dy) {this.x+=dx; this.y+=dy;}
+    var privMeth1= function {...} // A private method
+    fuction privMeth2 {...}       // private method (shortcut)
-var p  = new Point(3,4);
+    var that= this;          // To make this available for priv methods
-document.write("p:"+p.toString());
+}
 </code>
-The closure way: (closures see below)
+Notes:
-<code javascript>
+  * Private methods possibly cause overhead, compared to the prototype way of public methods
-function makePoint(x, y) { return {
+  * ''this'' seems only to be accessible in private methods by the ''that'' workaround variable above
-    toString: function() {return "("+x+"/"+y+")";}
+  * Public methods defined with the (recommended) ''prototype''-way doesn't seem to have access to private mehtods. You need privileged methods (see above) for that.
-    shift:    function(dx, dy) {x+=dx; y+=dy;}
-};}
-var p  = makePoint(3,4);
+Sources & more information:
-document.write("p:"+p.toString());
+  * [[http://javascript.crockford.com/private.html|Private Members in JavaScript]]
-</code>
+  * [[http://phrogz.net/JS/Classes/OOPinJS.html|OOP in JS, Part 1 : Public/Private Variables and Methods]]
-FIXME
+==== Inheritance ==
-  * Second variant is to be verified
-  * Does second method cause overhead?
-  * What about inheritance with 2nd method?
-==== Object cloning ==
+FIXME see JS Guide 1.5 and dynWidget.js
-Objects are [[http://www.thescripts.com/forum/thread718427.html|passed by refernce]] => Something like a copy constructor is necessary:
+==== Misc ==
-<code javascript>
+  * [[http://dojotoolkit.org/book/dojo-book-0-4/part-3-dojo-programming-model/global-dojo-objects|Using objects to simulate a namespace]]
-function Point(x, y) {this.x=x; this.y=y;}
-Point.prototype.clone= function() {return new Point(this.x, this.y);}
-Point.prototype.toString= function() {return "("+this.x+"/"+this.y+") ";}
-var p  = new Point(3,4);
+===== Constants ==
-var pr = p;		// a reference to p
-var q  = p.clone();	// a new point whit the same coordinates as p
-p.x= 9; p.y=-2;		// change content of p
-document.write("p:"+p.toString()+ "pr:"+pr.toString()+ "q:"+ q.toString());
-// result: p:(9/-2) pr:(9/-2) q:(3/4)
-</code>
-==== Inheritance ==
+''const'' is mentioned in the [[https://developer.mozilla.org/en/JavaScript/Guide/Values%2c_Variables%2c_and_Literals#Constants|Mozilla guide]] but dosen't work with Rhino version :?: and probabaly neither with IE
-FIXME see JS Guide 1.5 and dynWidget.js
+===== Events ==
-==== Misc ==
+For event handling see: [[https://developer.mozilla.org/en/DOM/element#Event_Handlers|Mozilla]] & [[http://de.selfhtml.org/javascript/sprache/eventhandler.htm|Selfhtml]]
-  * [[http://dojotoolkit.org/book/dojo-book-0-4/part-3-dojo-programming-model/global-dojo-objects|Using objects to simulate a namespace]]
+See also Dojo [[dojo#events]]
-===== Events =====
 ==== Get the Source of the Event ====
 <code javascript>
@@ Zeile 158: / Zeile 255: @@
 </code>
 Event handler for value input fields
-For event handling see: [[http://developer.mozilla.org/en/docs/DOM:element#Event_Handlers|Mozilla]] & [[http://msdn.microsoft.com/workshop/author/dhtml/reference/events/onchange.asp|Micro$oft]]
 ===== Closures ==
@@ Zeile 278: / Zeile 374: @@
 ===== Ajax ==
+==== Links ==
-  * [[http://www-128.ibm.com/developerworks/web/library/wa-ajaxintro1.html|Basic principles]] from [[http://www.ibm.com/developerworks/views/web/libraryview.jsp?search_by=Mastering+Ajax|Mastering Ajax series]] at IBM developerWorks
+[[http://www-128.ibm.com/developerworks/web/library/wa-ajaxintro1.html|Basic principles]] from [[http://www.ibm.com/developerworks/views/web/libraryview.jsp?search_by=Mastering+Ajax|Mastering Ajax series]] at IBM developerWorks - [[http://www.twilightuniverse.com/projects/sack/|Simple AJAX Code-Kit]] - [[http://www.jibbering.com/2002/4/httprequest.html|Raw cross browser code]]
-  * [[http://www.jibbering.com/2002/4/httprequest.html|Raw cross browser code]]
-  * [[http://www.twilightuniverse.com/projects/sack/|Simple AJAX Code-Kit]]
 ==== Sending JSON to Server ==
@@ Zeile 287: / Zeile 382: @@
 To convert any javscript value to a JSON string, use json2.js at [[http://www.json.org/js.html|json.org]]
-FIXME look in http://www.ibm.com/developerworks/views/web/libraryview.jsp?search_by=Mastering+Ajax
+==== Todo / Pending ==
+  * Check [[ibm>web/library/wa-aj-ajaxcomm/|Various client-server communication mechanisms in an Ajax-based web application]]
+  * Comet allows a web server to push data to a browser. [[wp>Comet_(programming)|Wikpedia article]] Introduction: [[http://www.developer.com/java/ent/article.php/3756841|Pushing Data to the Browser with Comet]] Manual: [[http://www.webreference.com/programming/javascript/rg28/|Comet Programming: Using Ajax to Simulate Server Push]]
 ===== Cookies ==
@@ Zeile 297: / Zeile 395: @@
 See [[dojo]]
-===== Further Reading ==
+===== Using Javascript from the Command Line ==
+See [[jrunscript]]
-  * [[ibm>library/x-svgclientside/|Create client-side diagrammatic interaction in Web applications with SVG]]: Include and animate external SVG images, with example code!
-  * [[ibm>web/library/wa-html5webapp/|Build Web applications with HTML 5]]
-  * [[ibm>web/tutorials/wa-html5/|Create modern Web sites using HTML5 and CSS3]]

In Becki sei Wiki

Benutzer-Werkzeuge

Webseiten-Werkzeuge

Unterschiede

Seiten-Werkzeuge