Prototype 120102020133-phpapp02
 

Prototype 120102020133-phpapp02

on

  • 213 views

this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, ...

this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality score, this is to check virality scor

Statistics

Views

Total Views
213
Views on SlideShare
213
Embed Views
0

Actions

Likes
0
Downloads
2
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Prototype 120102020133-phpapp02 Prototype 120102020133-phpapp02 Presentation Transcript

  • inheritenceinJavascriptAditya GaurMentor: Apurba Nath, Satya Prakash
  • Why inheritence ?
  •  Creating a hierarchy Code reuse
  • Classical inheritanceObjects are instances of classesA Class inherits from other class
  • Prototypal inheritanceA prototypal language is a class less objectoriented language. OOP without classes – now that’s weirdHere Objects inherit from objects What could be more object oriented than this! Code reuse done via cloning
  • How do we do this?
  • prototypeA prototype is an object used to implementstructure, state, and behaviour inheritance inECMAScript.
  • So, what kind ofobjects contain theprototype object?
  • Each and every object(Except the Object.prototype)
  • What !But when I do { }.prototype, I get null:-/
  • So what is prototype actually?The true prototype of an object is held by theinternal [[Prototype]] property.This is represented as __proto__ in some ofthe browsers like firefox.__proto__oldObjectnewObject
  • Accessing the prototypeMost browsers support the non standardaccessor __proto__ .ECMA 5 introduces the standard accessorObject.getPrototypeOf(object)Use object constructor.object.constructor.prototype
  • Examplevar baseObject = {firstMethod: function () {alert(“first method");},secondMethod: function () {alert(“second method");}};var extendedObject = {};extendedObject.thirdMethod = function () {alert(“third method")};extendedObject.__proto__ = baseObject;extendedObject.firstMethod();extendedObject.thirdMethod();firstMethodsecondMethod__proto__thirdMethod__proto__baseObjectextendedObject
  • Prototype chainingWhen an object is asked to evaluate property foo,JavaScript walks the prototype chain (starting withobject a itself), checking each link in the chain for thepresence of property foo.If and when foo is found it is returned, otherwiseundefined is returned.
  • var baseObject = {name: "FooBarBaz",getModifiedString : function(){return "Hello " + this.name;}};var extendedObject = {age : 10};extendedObject.__proto__ = baseObject;extendedObject.getModifiedString();extendedObject.toString();namegetModifiedString__proto__age__proto__baseObjectextendedObjecttoString__proto__Object.prototypenull
  • OK, So what was the prototype we weretalking about in the last session?
  • Prototype property in functionsvar newClass = function (){var privateVal = 10;this.publicVal = 20;}newClass.prototype.sharedVal = 30;whats this? The functions in JavaScript are objects and theycontain methods and properties. One of property of the function objects is prototype. A function’s prototype property is the object that willbe assigned as the prototype ([[Prototype]] ) to allinstances created when this function is used as aconstructor.
  • examples//function will never be a constructor but it has a prototypeproperty anywayMath.max.prototype; //[object Object]//function intended to be a constructor has a prototype toovar A = function(name) {this.name = name;}A.prototype; //[object Object]//Math is not a function so no prototype propertyMath.prototype; //null Every function has a prototype property, and theobjects which are not function don’t have the prototypeproperty.
  • examplesfunction Foo(name){this.name = name;}Foo.prototype.getName = function(){return this.name;}var obj = new Foo("bar");obj.getName();Fooprototype__proto__constructorgetNameobjname__proto__Function.prototype
  • Examples (augmentation)function Foo(name){this.name = name;}Foo.prototype.getName = function(){return this.name;};var obj = new Foo("bar");obj.getName(); //barFoo.prototype.getFullName = function(){return "Foo" + this.name;};obj.getFullName();// Foobar Note that the prototype is "live". Objects are passed by reference inJavaScript, and therefore the prototype is not copied with every newobject instance. It means that prototype property can be changed at any time andall the instances will reflect the change.
  • A catchfunction Foo(name){this.name = name;}Foo.prototype.getName = function(){return this.name;};var obj = new Foo("bar");obj.getName(); //barFoo.prototype = {getFullName : function (){return "FOO" + this.name;}};obj.getFullName();// ERRORobj.getName(); //barvar obj2 = new Foo("baz");obj2.getFullName(); //FOObaz If the prototype property is completely replaced the object stillpoints to the original prototype ([[Prototype]] )
  • Object.create = function (o) {function F() {}F.prototype = o;return new F();}; Creates a new object with the specified prototype object andproperties Introduced in ECMAscript 5.Object.create
  • var func = function(){alert(this);this.aVar =10;}var aVar = func(); The new keyword. If we forget the new keyword, “this” is bounded to global object. Also gives an impression of classical inheritance Deprecated __proto__Object.create. Why ?
  •  Douglas Crockford’s video lecture on Advancedjavascript Mozilla developer networkReferences
  • Thank you