KEMBAR78
Obvious Secrets of JavaScript | PDF
obvious secrets of

                           JavaScript



Monday, 21 December 2009
Monday, 21 December 2009
E very object (including host       objects) must implement the
                              e)) and ((Class)) propertie      s and the ((Get)), ((Put)),
                   ((Prototyp
                              t)), ((HasProperty)), ((Dele      te)), and ((DefaultValue))
                   ((CanPu
                              . (Note, however, that the ((D       efaultValue)) method may,
                   methods                                                  exception.) The value
                    for some objects    , simply throw a TypeError
                               Prototype)) property must be      either an object or null, and
                    of the ((
                               Prototype)) chain must have       finite length (that is, starting
                    every ((
                                y object, recursively access     ing the ((Prototype)) property
                     from an
                               entually lead to a null val         ue). Whether or not a native
                     must ev
                               an have a host object as its       ((Prototype)) depends on the
                     object c
                     implementation.
                          The value      of the ((Class)) property
                      is defined by        this specification for every
                      kind of built-i   n object. The value of the
                       ((Class)) prop    erty of a host object may
                       be any value     , even a value used by
Monday, 21 December 2009
E very object (including host       objects) must implement the
                              e)) and ((Class)) propertie      s and the ((Get)), ((Put)),
                   ((Prototyp
                              t)), ((HasProperty)), ((Dele      te)), and ((DefaultValue))
                   ((CanPu
                              . (Note, however, that the ((D       efaultValue)) method may,
                   methods                                                  exception.) The value
                    for some objects    , simply throw a TypeError
                               Prototype)) property must be      either an object or null, and
                    of the ((
                               Prototype)) chain must have       finite length (that is, starting
                    every ((
                                                                 ing the ((Prototype)) property
                     from an       It is a bit “cryptic”
                                y object, recursively access
                               entually lead to a null val         ue). Whether or not a native
                     must ev
                               an have a host object as its       ((Prototype)) depends on the
                     object c
                     implementation.
                          The value      of the ((Class)) property
                      is defined by        this specification for every
                      kind of built-i   n object. The value of the
                       ((Class)) prop    erty of a host object may
                       be any value     , even a value used by
Monday, 21 December 2009
Types




Monday, 21 December 2009
number      string

                           boolean    object

                             null    undefined



Monday, 21 December 2009
typeof
                           undefined      "undefined"

                              null         "object"

                            number         "number"

                           boolean         "boolean"

                             string        "string"

                            object         "object"


Monday, 21 December 2009
to Number
                           undefined         NaN

                              null            0

                            number            —

                           boolean     true→1, false→0

                             string        parsing

                            object       .valueOf()


Monday, 21 December 2009
to String
                           undefined       "undefined"

                              null           "null"

                            number             "5"

                           boolean           "true"

                             string              —

                            object         .toString()


Monday, 21 December 2009
to Boolean
                           undefined      FALSE

                              null        FALSE

                            number     0||NaN→false

                           boolean          —

                             string      ""→false

                            object         TRUE


Monday, 21 December 2009
to Object
                           undefined      exception!

                              null        exception!

                            number       new Number(5)

                           boolean     new Boolean(true)

                             string    new String("js")

                            object          object


Monday, 21 December 2009
5 + 4 + "px"
               "$" + 1 + 2
               "4" / "2"
               "$" + 1 - 2
               "web".length
               typeof 5
               typeof "5"
               typeof {key: value}
               typeof null
               typeof undefined
               typeof [1, 2, 3]
               typeof (4 - "px")
               +!{}[0]



Monday, 21 December 2009
5 + 4 + "px"          "9px"
               "$" + 1 + 2           "$12"
               "4" / "2"             2
               "$" + 1 - 2           NaN
               "web".length          3
               typeof 5              "number"
               typeof "5"            "string"
               typeof {key: value}   "object"
               typeof null           "object"
               typeof undefined      "undefined"
               typeof [1, 2, 3]      "object"
               typeof (4 - "px")     "number"
               +!{}[0]               1



Monday, 21 December 2009
Object Properties




Monday, 21 December 2009
for in




Monday, 21 December 2009
var a = {
                 x: 12,
                 y: 23,
                 r: 10,
                 draw: function () {/*...*/}
             };


             for (var property in a) {
                 alert("a." + property + " = " +
             a[property]);
             }




Monday, 21 December 2009
var a = {
                 x: 12,
                 y: 23,
                 r: 10,
                 draw: function () {/*...*/}
             };


             for (var property in a) {
                 alert("a." + property + " = " +
             a[property]);
             }




Monday, 21 December 2009
ReadOnly    DontEnum

                           DontDelete    Internal




Monday, 21 December 2009
Function




Monday, 21 December 2009
var y = 1;
             function x() {
                 var y = 2;
                 return ++y;
             }

             var z = function () {
                 return ++y;
             };




Monday, 21 December 2009
function x() {
                 var y = 2;
                 return function () {
                     return ++y;
                 };
             }

             var a = x();
             a();
             a();




Monday, 21 December 2009
typeof function (){} == "function"




Monday, 21 December 2009
Arguments




Monday, 21 December 2009
function add(a, b) {
                 return a + b;
             }

             add(4, 5); // = 9
             add(4, 5, 6, 7, 8, 9) // = 39

             function add() {
                 var sum = 0;
                 for (var i = 0, ii = arguments.length; i <
             ii; i++) {
                     sum +=+ arguments[i];
                 }
                 return sum;
             }


Monday, 21 December 2009
Scope, Context & “this”




Monday, 21 December 2009
function is(it) {
                 alert(this + " is " + it);
             }

             is("global");

             is.call(5, "number");

             is.apply("A", ["string"]);

             alert.is = is;

             alert.is("function");



Monday, 21 December 2009
Variable declaration




Monday, 21 December 2009
alert(b);
     1       b = 1;

             alert(a);
     2       var a = 1;

             (function () {
     3           var x = 1;
             })();
             alert(x);

             (function () {
     4           y = 1;
             })();
             alert(y);




Monday, 21 December 2009
Function declaration




Monday, 21 December 2009
function x(a) {
     1           return a && x(--a);
             }

             var x = function (a) {
     2           return a && x(--a);
             };

             setTimeout(function (a) {
     3           return a && arguments.callee(--a);
             }, 1000);

             var x = function y(a) {
     4           return a && y(--a);
             };

             setTimeout(function y(a) {
     5           return a && y(--a);
             }, 1000);



Monday, 21 December 2009
Array declaration




Monday, 21 December 2009
var a = new Array;

             var a = new Array(3);

             var a = [];

             var a = [undefined, undefined, undefined];

             var a = [1, 2, 3, 4];




Monday, 21 December 2009
Object declaration (JSON)




Monday, 21 December 2009
var a = new Object;

             var a = {};

             var a = {x: 10, y: 15};

             var a = {
                 x: 10,
                 name: "object",
                 "font-style": "italic",
                 getHeight: function () {/*...*/},
                 points: [1, 2, 3],
                 child: {x: 10, y: 15}
             };



Monday, 21 December 2009
OOP




Monday, 21 December 2009
Object Owns Prototype




Monday, 21 December 2009
var mouse = {
     1           name: "Mike",
                 voice: function () { alert("Squik!"); }
             };

             var o = new Object;
     2       o.name = "Mike";
             o.voice = function () { alert("Squik!"); };

             var O = function () {
     3           this.name = "Mike";
                 this.voice = function () { alert("Squik!"); };
             };
             var o = new O;

             var O = function () {};
     4       O.prototype.name = "Mike";
             O.prototype.voice = function () { alert("Squik!"); };
             var o = new O;



Monday, 21 December 2009
Inheritance




Monday, 21 December 2009
Delegation




Monday, 21 December 2009
Classic Model


                                         Class




                                                    Object
                                         Class




                           Object       Object      Object




Monday, 21 December 2009
Prototypal Model




                                                       Object




                           Object         Object       Object




Monday, 21 December 2009
var A = function () {};



                                1   A




Monday, 21 December 2009
var A = function () {};   x: 5
      A.prototype.x = 5;


                                 1     A




Monday, 21 December 2009
var A = function () {};   x: 5
      A.prototype.x = 5;

      var b = new A;
                                 1         A




                                       b




Monday, 21 December 2009
x: 5
      var A = function () {};   y: 6
      A.prototype.x = 5;

      var b = new A;
      A.prototype.y = 6;         1         A




                                       b




Monday, 21 December 2009
x: 5
      var A = function () {};   y: 6
      A.prototype.x = 5;

      var b = new A;
      A.prototype.y = 6;         1         A
      var c = new A;




                                       b   c




Monday, 21 December 2009
x: 5
      var A = function () {};   y: 6
      A.prototype.x = 5;

      var b = new A;
      A.prototype.y = 6;         1            A
      var c = new A;
      b.z = 7;




                                        b     c


                                       z: 7




Monday, 21 December 2009
x: 5
      var A = function () {};   y: 6
      A.prototype.x = 5;

      var b = new A;
      A.prototype.y = 6;         1            A
      var c = new A;
      b.z = 7;
      c.x = 4;



                                        b      c


                                       z: 7   x: 4




Monday, 21 December 2009
x: 5                 w: 1
      var A = function () {};   y: 6                 u: 2
      A.prototype.x = 5;

      var b = new A;
      A.prototype.y = 6;         1            A       2
      var c = new A;
      b.z = 7;
      c.x = 4;

      A.prototype = {
          w: 1,
          u: 2                          b      c
      };

                                       z: 7   x: 4




Monday, 21 December 2009
x: 5                         w: 1
      var A = function () {};   y: 6                         u: 2
      A.prototype.x = 5;

      var b = new A;
      A.prototype.y = 6;         1            A               2
      var c = new A;
      b.z = 7;
      c.x = 4;
                                                     *
      A.prototype = {
          w: 1,
          u: 2                          b      c         d
      };

      var d = new A;                   z: 7   x: 4       —




Monday, 21 December 2009
x: 5                         w: 1
      var A = function () {};   y: 6                         u: 2
      A.prototype.x = 5;

      var b = new A;
      A.prototype.y = 6;         1            A               2
      var c = new A;
      b.z = 7;
      c.x = 4;
                                                     *
      A.prototype = {
          w: 1,
          u: 2                          b      c         d
      };

      var d = new A;                   z: 7   x: 4       —




Monday, 21 December 2009
Thank You




Monday, 21 December 2009

Obvious Secrets of JavaScript

  • 1.
    obvious secrets of JavaScript Monday, 21 December 2009
  • 2.
  • 3.
    E very object(including host objects) must implement the e)) and ((Class)) propertie s and the ((Get)), ((Put)), ((Prototyp t)), ((HasProperty)), ((Dele te)), and ((DefaultValue)) ((CanPu . (Note, however, that the ((D efaultValue)) method may, methods exception.) The value for some objects , simply throw a TypeError Prototype)) property must be either an object or null, and of the (( Prototype)) chain must have finite length (that is, starting every (( y object, recursively access ing the ((Prototype)) property from an entually lead to a null val ue). Whether or not a native must ev an have a host object as its ((Prototype)) depends on the object c implementation. The value of the ((Class)) property is defined by this specification for every kind of built-i n object. The value of the ((Class)) prop erty of a host object may be any value , even a value used by Monday, 21 December 2009
  • 4.
    E very object(including host objects) must implement the e)) and ((Class)) propertie s and the ((Get)), ((Put)), ((Prototyp t)), ((HasProperty)), ((Dele te)), and ((DefaultValue)) ((CanPu . (Note, however, that the ((D efaultValue)) method may, methods exception.) The value for some objects , simply throw a TypeError Prototype)) property must be either an object or null, and of the (( Prototype)) chain must have finite length (that is, starting every (( ing the ((Prototype)) property from an It is a bit “cryptic” y object, recursively access entually lead to a null val ue). Whether or not a native must ev an have a host object as its ((Prototype)) depends on the object c implementation. The value of the ((Class)) property is defined by this specification for every kind of built-i n object. The value of the ((Class)) prop erty of a host object may be any value , even a value used by Monday, 21 December 2009
  • 5.
  • 6.
    number string boolean object null undefined Monday, 21 December 2009
  • 7.
    typeof undefined "undefined" null "object" number "number" boolean "boolean" string "string" object "object" Monday, 21 December 2009
  • 8.
    to Number undefined NaN null 0 number — boolean true→1, false→0 string parsing object .valueOf() Monday, 21 December 2009
  • 9.
    to String undefined "undefined" null "null" number "5" boolean "true" string — object .toString() Monday, 21 December 2009
  • 10.
    to Boolean undefined FALSE null FALSE number 0||NaN→false boolean — string ""→false object TRUE Monday, 21 December 2009
  • 11.
    to Object undefined exception! null exception! number new Number(5) boolean new Boolean(true) string new String("js") object object Monday, 21 December 2009
  • 12.
    5 + 4+ "px" "$" + 1 + 2 "4" / "2" "$" + 1 - 2 "web".length typeof 5 typeof "5" typeof {key: value} typeof null typeof undefined typeof [1, 2, 3] typeof (4 - "px") +!{}[0] Monday, 21 December 2009
  • 13.
    5 + 4+ "px" "9px" "$" + 1 + 2 "$12" "4" / "2" 2 "$" + 1 - 2 NaN "web".length 3 typeof 5 "number" typeof "5" "string" typeof {key: value} "object" typeof null "object" typeof undefined "undefined" typeof [1, 2, 3] "object" typeof (4 - "px") "number" +!{}[0] 1 Monday, 21 December 2009
  • 14.
  • 15.
    for in Monday, 21December 2009
  • 16.
    var a ={ x: 12, y: 23, r: 10, draw: function () {/*...*/} }; for (var property in a) { alert("a." + property + " = " + a[property]); } Monday, 21 December 2009
  • 17.
    var a ={ x: 12, y: 23, r: 10, draw: function () {/*...*/} }; for (var property in a) { alert("a." + property + " = " + a[property]); } Monday, 21 December 2009
  • 18.
    ReadOnly DontEnum DontDelete Internal Monday, 21 December 2009
  • 19.
  • 20.
    var y =1; function x() { var y = 2; return ++y; } var z = function () { return ++y; }; Monday, 21 December 2009
  • 21.
    function x() { var y = 2; return function () { return ++y; }; } var a = x(); a(); a(); Monday, 21 December 2009
  • 22.
    typeof function (){}== "function" Monday, 21 December 2009
  • 23.
  • 24.
    function add(a, b){ return a + b; } add(4, 5); // = 9 add(4, 5, 6, 7, 8, 9) // = 39 function add() { var sum = 0; for (var i = 0, ii = arguments.length; i < ii; i++) { sum +=+ arguments[i]; } return sum; } Monday, 21 December 2009
  • 25.
    Scope, Context &“this” Monday, 21 December 2009
  • 26.
    function is(it) { alert(this + " is " + it); } is("global"); is.call(5, "number"); is.apply("A", ["string"]); alert.is = is; alert.is("function"); Monday, 21 December 2009
  • 27.
  • 28.
    alert(b); 1 b = 1; alert(a); 2 var a = 1; (function () { 3 var x = 1; })(); alert(x); (function () { 4 y = 1; })(); alert(y); Monday, 21 December 2009
  • 29.
  • 30.
    function x(a) { 1 return a && x(--a); } var x = function (a) { 2 return a && x(--a); }; setTimeout(function (a) { 3 return a && arguments.callee(--a); }, 1000); var x = function y(a) { 4 return a && y(--a); }; setTimeout(function y(a) { 5 return a && y(--a); }, 1000); Monday, 21 December 2009
  • 31.
  • 32.
    var a =new Array; var a = new Array(3); var a = []; var a = [undefined, undefined, undefined]; var a = [1, 2, 3, 4]; Monday, 21 December 2009
  • 33.
  • 34.
    var a =new Object; var a = {}; var a = {x: 10, y: 15}; var a = { x: 10, name: "object", "font-style": "italic", getHeight: function () {/*...*/}, points: [1, 2, 3], child: {x: 10, y: 15} }; Monday, 21 December 2009
  • 35.
  • 36.
  • 37.
    var mouse ={ 1 name: "Mike", voice: function () { alert("Squik!"); } }; var o = new Object; 2 o.name = "Mike"; o.voice = function () { alert("Squik!"); }; var O = function () { 3 this.name = "Mike"; this.voice = function () { alert("Squik!"); }; }; var o = new O; var O = function () {}; 4 O.prototype.name = "Mike"; O.prototype.voice = function () { alert("Squik!"); }; var o = new O; Monday, 21 December 2009
  • 38.
  • 39.
  • 40.
    Classic Model Class Object Class Object Object Object Monday, 21 December 2009
  • 41.
    Prototypal Model Object Object Object Object Monday, 21 December 2009
  • 42.
    var A =function () {}; 1 A Monday, 21 December 2009
  • 43.
    var A =function () {}; x: 5 A.prototype.x = 5; 1 A Monday, 21 December 2009
  • 44.
    var A =function () {}; x: 5 A.prototype.x = 5; var b = new A; 1 A b Monday, 21 December 2009
  • 45.
    x: 5 var A = function () {}; y: 6 A.prototype.x = 5; var b = new A; A.prototype.y = 6; 1 A b Monday, 21 December 2009
  • 46.
    x: 5 var A = function () {}; y: 6 A.prototype.x = 5; var b = new A; A.prototype.y = 6; 1 A var c = new A; b c Monday, 21 December 2009
  • 47.
    x: 5 var A = function () {}; y: 6 A.prototype.x = 5; var b = new A; A.prototype.y = 6; 1 A var c = new A; b.z = 7; b c z: 7 Monday, 21 December 2009
  • 48.
    x: 5 var A = function () {}; y: 6 A.prototype.x = 5; var b = new A; A.prototype.y = 6; 1 A var c = new A; b.z = 7; c.x = 4; b c z: 7 x: 4 Monday, 21 December 2009
  • 49.
    x: 5 w: 1 var A = function () {}; y: 6 u: 2 A.prototype.x = 5; var b = new A; A.prototype.y = 6; 1 A 2 var c = new A; b.z = 7; c.x = 4; A.prototype = { w: 1, u: 2 b c }; z: 7 x: 4 Monday, 21 December 2009
  • 50.
    x: 5 w: 1 var A = function () {}; y: 6 u: 2 A.prototype.x = 5; var b = new A; A.prototype.y = 6; 1 A 2 var c = new A; b.z = 7; c.x = 4; * A.prototype = { w: 1, u: 2 b c d }; var d = new A; z: 7 x: 4 — Monday, 21 December 2009
  • 51.
    x: 5 w: 1 var A = function () {}; y: 6 u: 2 A.prototype.x = 5; var b = new A; A.prototype.y = 6; 1 A 2 var c = new A; b.z = 7; c.x = 4; * A.prototype = { w: 1, u: 2 b c d }; var d = new A; z: 7 x: 4 — Monday, 21 December 2009
  • 52.
    Thank You Monday, 21December 2009