Oop in java script

{}1'nelm.io'true

undefinednull

new Object();

{}// v.s.new Object();

(function (){ var Object = function () { this.changed = true; } console.log(new Object());}());

// {changed: true}

{}new Object();

var o = new Object(1);console.log(o.constructor);

// function Number() { }// new Number(1);

var o = new Object('1');console.log(o.constructor);

// function String() { }// new String('1');

var o = new Object(true);console.log(o.constructor);

// function Boolean() { }// new Boolean(true);

var a = {};var b = new Object();var c = Object();

new Object();

var Car, myCar;

Car = function (brand) { this.brand = brand;};

myCar = new Car('Fiat');

// {brand: 'Fiat'}

var Car, myCar;

// {brand: 'Fiat'}

var Car, myCar;

// {brand: 'Fiat'}

var Car, myCar;

// {brand: 'Fiat'}

var Car, myCar;

myCar = Car('Fiat');

// undefined

var Car, myCar;

// undefined

var Car, myCar;

// {brand: 'Fiat'}

var Car, myCar;

// {brand: 'Fiat'}

var Car, myCar;

Car = function (brand) { this.brand = brand; console.log( this.constructor === Car ); // true};

var Car, myCar;

Car = function (brand) { this.brand = brand; console.log( this.constructor === Car ); // undefined};

var Car, myCar;

Car = function (brand) { if (this.constructor !== Car) { return new Car(brand); } this.brand = brand;};

var Car, myCar;

Car = function (brand) { if (this.constructor !== Car) { return new Car(brand); } this.brand = brand;};

prototype

{}prototype

var C = function () {};

console.log(C.prototype);

{ constructor: C, __proto__: Object.prototype}

var C = function () {};C.prototype = { a: "A", b: "B", constructor: C};

{ a: "A", b: "B", constructor: C, __proto__: Object.prototype}

var C = function () {};C.prototype = { a: "A", b: "B", constructor: C // !!!};

C.prototype.a = "A";C.prototype.b = "B";

{}prototype

propertyv.s.

attribute

var Car, myCar;

Car.prototype; // { /* ... */ }myCar.prototype; // undefined

var Car, myCar;

propertyv.s.

attribute

var Car, myCar;

Car.prototype.getBrand = function () { return this.brand;};

myCar = new Car('Fiat');myCar.brand;myCar.getBrand();

var Car, myCar;

{}prototype

inheritance

classicalinheritance

modern

classicalinheritance

var Car, ItalianCar, myCar;

Car = function (brand) { this.brand = brand || 'Homemade';}Car.prototype.getBrand = function () { return this.brand;}

ItalianCar = function (brand) {};

inherit(ItalianCar, Car);

myCar = new ItalianCar('Fiat');

ItalianCar = function (brand) {}

classical inheritance1. Default Pattern2. Rent-a-Constructor3. Rent and Set Prototype4. Share Prototype5. Temp. Constructor

var inherit = function (Child, Parent) { Child.prototype = new Parent();}

var inherit = function (Child, Parent) { Child.prototype = new Parent();}myCar = new ItalianCar();

myCar.getBrand();// 'Homemade'

myCar.brand = "Fiat";myCar.getBrand(); // 'Fiat'

myCar.getBrand();// 'Fiat'

myCar = new ItalianCar();myCar.brand = 'Fiat';

myCar = new ItalianCar('Fiat')

myCar = new ItalianCar('Fiat')myCar.getBrand(); // 'Homemade'

inherit(ItalianCar, Car);// ItalianCar.prototype = new Car();

ItalianCar = function (brand) { Car.apply(this, [brand]);}

var Car, ItalianCar, myCar;Car = function (brand) { this.brand = brand || 'Homemade';}Car.prototype.getBrand = function () { return this.brand;}

myCar = new ItalianCar('Fiat');myCar.brand; // 'Fiat';

myCar = new ItalianCar('Fiat');myCar.brand; // 'Fiat';myCar.getBrand; // 'undefined'

ItalianCar = function (brand) { Car.apply(this, [brand]);}ItalianCar.prototype = new Car();

myCar = new ItalianCar('Fiat');myCar.brand; // 'Fiat';myCar.getBrand(); // 'Fiat'delete myCar.brand;myCar.getBrand(); // 'Homemade'

var inherit = function (Child, Parent) { Child.prototype = Parent.prototype;}

var inherit = function (Child, Parent) { var F = function () {}; F.prototype = Parent.prototype; Child.prototype = new F();}

inherit(ItalianCar, Car);myCar = new ItalianCar();myCar.brand; // undefinedmyCar.getBrand; // function

var inherit = function (Child, Parent) { var F = function () {}; F.prototype = Parent.prototype; Child.prototype = new F(); Child.uber = Parent.prototype;}

var inherit = function (Child, Parent) { var F = function () {}; F.prototype = Parent.prototype; Child.prototype = new F(); Child.uber = Parent.prototype; Child.prototype.constructor = Child;}

classical inheritance1. Default Pattern2. Rent-a-Constructor3. Rent and Set Prototype4. Share Prototype5. Temp. Constructorklass

var Parent = klass( null, { __construct: function () {}, someMethod: function () {} });

var Child = klass( Parent, { __construct: function () {}, childMethod: function () {} });

var Man = klass( null, { __construct: function (what) { console.log('man constructor'); this.name = what; }, getName: function () { return this.name; } });

var first = new Man('Adam');// logs 'man constructor'first.getName();// 'Adam'

var SuperMan = klass( Man, { __construct: function (what) { console.log('super man constructor'); }, getName: function () { var name = SuperMan.uber.getName.call(this); return 'I am ' + name; } });

var clark = new SuperMan('Clark Kent');// logs 'man constructor'// and 'super man constructor'clark.getName();// 'I am Clark Kent'

Child = function () { if (Child.uber && Child.uber.hasOwnProperty('__construct')) { Child.uber.__construct.apply(this, arguments); } if (Child.prototype.hasOwnProperty('__construct')) { Child.prototype.__construct.apply(this, arguments); } };

Parent = Parent || Object; F = function () {}; F.prototype = Parent.prototype; Child.prototype = new F(); Child.uber = Parent.prototype; Child.prototype.constructor = Child;

var klass = function (Parent, props) {

/* ... */

for (i in props) { if (props.hasOwnProperty(i)) { Child.prototype[i] = props[i]; } }

return Child;};

/* ... */

return Child;};

/* ... */

return Child;};

/* ... */

return Child;};

/* ... */

return Child;};

/* ... */

return Child;};

Oop in java script

Technology

Transcript of Oop in java script