Obvious Secrets of JavaScript

Post on 06-May-2015

3.351 views 5 download

Tags:

Transcript of Obvious Secrets of JavaScript

JavaScriptobvious secrets of

Monday, 21 December 2009

Monday, 21 December 2009

Every object (including host objects) must implement the

((Prototype)) and ((Class)) properties and the ((Get)), ((Put)),

((CanPut)), ((HasProperty)), ((Delete)), and ((DefaultValue))

methods. (Note, however, that the ((DefaultValue)) method may,

for some objects, simply throw a TypeError exception.) The value

of the ((Prototype)) property must be either an object or null, and

every ((Prototype)) chain must have finite length (that is, starting

from any object, recursively accessing the ((Prototype)) property

must eventually lead to a null value). Whether or not a native

object can have a host object as its ((Prototype)) depends on the

implementation. The value of the ((Class)) property

is defined by this specification for every

kind of built-in object. The value of the

((Class)) property of a host object may

be any value, even a value used by Monday, 21 December 2009

Every object (including host objects) must implement the

((Prototype)) and ((Class)) properties and the ((Get)), ((Put)),

((CanPut)), ((HasProperty)), ((Delete)), and ((DefaultValue))

methods. (Note, however, that the ((DefaultValue)) method may,

for some objects, simply throw a TypeError exception.) The value

of the ((Prototype)) property must be either an object or null, and

every ((Prototype)) chain must have finite length (that is, starting

from any object, recursively accessing the ((Prototype)) property

must eventually lead to a null value). Whether or not a native

object can have a host object as its ((Prototype)) depends on the

implementation. The value of the ((Class)) property

is defined by this specification for every

kind of built-in object. The value of the

((Class)) property of a host object may

be any value, even a value used by

It is a bit “cryptic”

Monday, 21 December 2009

Types

Monday, 21 December 2009

number

boolean

null

string

object

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".lengthtypeof 5typeof "5"typeof {key: value}typeof nulltypeof undefinedtypeof [1, 2, 3]typeof (4 - "px")+!{}[0]

Monday, 21 December 2009

5 + 4 + "px""$" + 1 + 2"4" / "2""$" + 1 - 2"web".lengthtypeof 5typeof "5"typeof {key: value}typeof nulltypeof undefinedtypeof [1, 2, 3]typeof (4 - "px")+!{}[0]

"9px""$12"2NaN3"number""string""object""object""undefined""object""number"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

DontDelete

DontEnum

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); // = 9add(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

1 alert(b);

b = 1;

alert(a);

var a = 1;

(function () {

var x = 1;

})();

alert(x);

(function () {

y = 1;

})();

alert(y);

2

3

4

Monday, 21 December 2009

Function declaration

Monday, 21 December 2009

1

2

3

4

5

function x(a) {

return a && x(--a);

}

var x = function (a) {

return a && x(--a);

};

setTimeout(function (a) {

return a && arguments.callee(--a);

}, 1000);

var x = function y(a) {

return a && y(--a);

};

setTimeout(function y(a) {

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

1

2

3

4

var mouse = {

name: "Mike",

voice: function () { alert("Squik!"); }

};

var o = new Object;

o.name = "Mike";

o.voice = function () { alert("Squik!"); };

var O = function () {

this.name = "Mike";

this.voice = function () { alert("Squik!"); };

};

var o = new O;

var O = function () {};

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

Class

Object Object Object

Class

Object

Classic Model

Monday, 21 December 2009

Object Object Object

Object

Prototypal Model

Monday, 21 December 2009

var A = function () {};

A1

Monday, 21 December 2009

var A = function () {};A.prototype.x = 5;

A1

x: 5

Monday, 21 December 2009

var A = function () {};A.prototype.x = 5;

var b = new A;

b

A1

x: 5

Monday, 21 December 2009

var A = function () {};A.prototype.x = 5;

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

b

A1

x: 5y: 6

Monday, 21 December 2009

var A = function () {};A.prototype.x = 5;

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

b

A1

c

x: 5y: 6

Monday, 21 December 2009

var A = function () {};A.prototype.x = 5;

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

b

A1

c

x: 5y: 6

z: 7

Monday, 21 December 2009

var A = function () {};A.prototype.x = 5;

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

b

A1

c

x: 5y: 6

z: 7 x: 4

Monday, 21 December 2009

var A = function () {};A.prototype.x = 5;

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

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

b

A1

c

2

x: 5y: 6

w: 1u: 2

z: 7 x: 4

Monday, 21 December 2009

var A = function () {};A.prototype.x = 5;

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

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

var d = new A;

b

A1

c

2

d

x: 5y: 6

w: 1u: 2

z: 7 x: 4 —

*

Monday, 21 December 2009

var A = function () {};A.prototype.x = 5;

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

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

var d = new A;

b

A1

c

2

d

x: 5y: 6

w: 1u: 2

z: 7 x: 4 —

*

Monday, 21 December 2009

Thank You

Monday, 21 December 2009