{"id":2752,"date":"2015-03-19T12:15:57","date_gmt":"2015-03-19T10:15:57","guid":{"rendered":"http:\/\/www.webcodegeeks.com\/?p=2752"},"modified":"2018-06-19T22:45:10","modified_gmt":"2018-06-19T19:45:10","slug":"javascript-inheritance-example","status":"publish","type":"post","link":"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/","title":{"rendered":"JavaScript Inheritance Example"},"content":{"rendered":"

EDITORIAL NOTE<\/strong>: In this post, we feature a comprehensive JavaScript Inheritance Example. In object-oriented programming, inheritance enables new objects to take on the properties of existing objects. A class that is used as the basis for inheritance is called a super-class or base class. A class that inherits from a super-class is called a subclass or derived class.<\/p>\n

JavaScript is a very popular object-oriented language. We use it every day in our web applications, it is also supported on many user interface (UI) frameworks like QT, and on server side applications (node.js).<\/p>\n

However this language is prototype based and does not implement a traditional class system. This is often confusing for developers whose are familiar with languages that support the concept of classes like Java or PHP.<\/p>\n

In this article, we will discuss inheritance in JavaScript.<\/p>\n

[ulp id=’tCIwOngQUb3zSUuF’]<\/p>\n

\n

<\/a>Table Of Contents<\/h3>\n
\n
1. Introduction<\/a><\/dt>\n
2. Tools we are going to use<\/a><\/dt>\n
3. Inheritance and the prototype chain<\/a><\/dt>\n
\n
\n
3.1 Inheriting properties<\/a><\/dt>\n<\/dl>\n<\/dd>\n
\n
\n
3.2 Inheriting methods<\/a><\/dt>\n<\/dl>\n<\/dd>\n
4. The complete example<\/a><\/dt>\n
5. Download<\/a><\/dt>\n<\/dl>\n<\/div>\n

<\/a>1. Introduction<\/h2>\n

Most languages have classes which are like blueprints to create object instances. Those classes can inherit from other classes and the only way to create a new kind of object is by defining a new class.<\/p>\n

JavaScript’s prototype-based inheritance means that an object inherits from another object. This is known as the prototype chain and also means that objects are dynamic “bags” of properties (referred to as own properties), in other words objects in JavaScript behave like dictionaries in other languages so you can “add” new items to the dictionary at any time.<\/p>\n

The prototype chain works as follows: each object has an internal link to another object called its [[Prototype]]. That prototype object has a [[Prototype]] of its own, and so on until an object is reached with null as its [[Prototype]]. null, is the end of the chain and by definition has no [[Prototype]] property.<\/p>\n

Tip<\/strong>
\nFollowing the ECMAScript standard, the notation someObject.[[Prototype]] is used to designate the prototype of someObject. This is equivalent to the JavaScript property __proto__ (now deprecated). Since ECMAScript 5, the [[Prototype]]<\/strong> is accessed using the accessors Object.getPrototypeOf()<\/code> and Object.setPrototypeOf()<\/code>.<\/div>\n

TOC<\/a><\/sub><\/p>\n

<\/a>2. Tools we are going to use<\/h2>\n

I am using the following tools:<\/p>\n

    \n
  1. sublime text 3<\/a><\/li>\n
  2. node.js v0.10.33<\/a><\/li>\n
  3. GNU\/Linux distro (Ubuntu)<\/a><\/li>\n<\/ol>\n

    So lets create a new project:<\/p>\n

    \r\nmkdir -p ~\/Projects\/js-inheritance-example\r\ncd ~\/Project\/js-inheritance-example\r\nnpm init # follow the on screen instructions and don't forget add "private": true to the package.json so that your project is not globally distributed as a npm app.\r\n<\/pre>\n
    Here is how my package.json file looks like:<\/p>\n
    \r\n{\r\n  "name": "js-inheritance-example",\r\n  "version": "1.0.0",\r\n  "description": "JavaScript inheritance example",\r\n  "main": "index.js",\r\n  "scripts": {\r\n    "test": "echo \\"Error: no test specified\\" && exit 1"\r\n  },\r\n  "author": "Eivar Montenegro <e.mont01 at gmail.com>",\r\n  "license": "MIT",\r\n  "private": true\r\n}\r\n\r\n<\/pre>\n
    You can execute any .js file from your console using the following command:<\/p>\n
    \r\nnode file_name.js\r\n<\/pre>\n
    TOC<\/a><\/sub><\/p>\n
    <\/a>3. Inheritance and the prototype chain<\/h2>\n
    At the end of any prototype chain, we normally find an Object whose prototype is null. Null, as mentioned before, marks the end of our prototype chain, now lets see some examples:<\/p>\n
    Let’s create a new file and name it objects.js, then add the following code:<\/p>\n
    \r\n\/**\r\n * Syntax constructs: myObject is created and its [[Prototype]] is defined as Object.prototype, so it inherits the method hasOwnProperty among others.\r\n * Prototype chain: myObject --> Object.prototype --> null\r\n *\r\n * @type {Object}\r\n *\/\r\nvar myObject = {\r\n\tprop1: 1,\r\n\tprop2: "Hello world"\r\n};\r\n\r\n\/**\r\n * Syntax construct: myArray is an array object that inherits from Array.prototype which has methods like indexOf, forEach, etc.\r\n * Prototype chain: myArray --> Array.prototype --> Object.prototype --> null\r\n *\r\n * @type {Array}\r\n *\/\r\nvar myArray = ['Hello', 'world'];\r\n\r\n\/**\r\n * Syntax constructs: myFunction inherits from Function.prototype, which has methods like call, bind, etc.\r\n * Property chain: myFunction --> Function.prototype --> Object.prototype --> null\r\n *\r\n * @type {Function}\r\n * @return {string}\r\n *\/\r\nfunction myFunction() {\r\n\treturn 'Hello world';\r\n}\r\n\r\n\/**\r\n * Constructor: As seen before Triangle itself is an function object but in this case we are using that function as a constructor.\r\n * Prototype chain: t --> Triangle.prototype --> Object.prototype --> null\r\n * @param {number} a\r\n * @param {number} b\r\n * @param {number} c\r\n *\/\r\nfunction Triangle(a, b, c) {\r\n\tthis.a = a;\r\n\tthis.b = b;\r\n\tthis.c = c;\r\n}\r\n\r\n\/**\r\n * Triangle prototype (anonymous object)\r\n * @type {Object}\r\n *\/\r\nTriangle.prototype = {\r\n\tperimeter: function () {\r\n\t\treturn this.a + this.b + this.c;\r\n\t}\r\n}\r\n\r\n\/**\r\n * When new Triangle() is executed, t gets its own properties 'a', 'b' and 'c' and t.[[Prototype]] is the value of Triangle.prototype so we can use: t.perimeter()\r\n * @type {Triangle}\r\n *\/\r\nvar myVar = new Triangle();\r\n\r\n\/**\r\n * ECMAScript 5 Object.create(): calling this method creates a new object, setting the prototype of the new object as the first argument of the function.\r\n * Prototype chain: mySecondObject --> myObject --> Object.prototype --> null\r\n *\r\n * @type {Object}\r\n *\/\r\nvar mySecondObject = Object.create(myObject);\r\n<\/pre>\n
    This code illustrates the 3 ways to create objects in JavaScript, using the syntax constructs like {} or [], you can also create a function that you can use as a constructor or you can use the Object.create method.<\/p>\n
    My personal recommendation is to use the constructor function.<\/p>\n
    You can create an object that does not inherit from object using Object.create<\/code>, as seen in the following example:<\/p>\n
    \r\n\/**\r\n * Prototype chain: o --> null;\r\n * @type {object}\r\n *\/\r\nvar o = Object.create(null);\r\n<\/pre>\n
    TOC<\/a><\/sub><\/p>\n
    <\/a>3.1 Inheriting properties<\/h3>\n
    In JavaScript almost everything is an object, and you can think of as a sort of associative arrays or dictionaries, whose properties can be accessed with obj.propertyName<\/code> or obj['propertyName']<\/code>. When you request a property, the instance object will be checked if it does not contain such property, then JavaScript will go through the prototype chain until it either finds the property, or the end of the chain is reached.<\/p>\n
    Let’s illustrate this using probably the most common example of inheritance: “Living Beings”.<\/p>\n
    \r\n'use strict';\r\n\r\n\/**\r\n * Constructor for any living being\r\n * Prototype chain: LivingBeing --> Object.prototype --> null\r\n *\/\r\nfunction LivingBeing () {\r\n\tthis.isAlive = true;\r\n\tthis.birthday = new Date();\r\n\tthis.legs = 0;\r\n\tthis.diet = '-';\r\n}\r\n\r\n\/**\r\n * Mammals\r\n * Prototype chain: Mammal --> LivingBeing.prototype --> Object.prototype --> null\r\n *\/\r\nfunction Mammal() {\r\n\tLivingBeing.call(this);\r\n\tthis.bodyTemperature = 30;\r\n}\r\n\r\n\/\/ Mammals inherit from LivingBeing\r\nMammal.prototype = Object.create(LivingBeing.prototype);\r\nMammal.prototype.constructor = Mammal;\r\n\r\n\/**\r\n * Felines\r\n * Prototype chain: Feline --> Mammal.prototype --> LivingBeing.prototype --> Object.prototype --> null\r\n *\/\r\nfunction Feline() {\r\n\tMammal.call(this);\r\n\tthis.diet = 'Meat';\r\n\tthis.legs = 4\r\n}\r\n\r\nFeline.prototype = Object.create(Mammal.prototype);\r\nFeline.prototype.constructor = Feline;\r\n<\/pre>\n
    Tip<\/strong>
    \nThe “use strict” directive is new in JavaScript 1.8.5 (ECMAScript version 5). It is not an statement, but a literal expression, ignored by earlier versions of the language, its purpose is to indicate that the code should be executed in     “strict mode”<\/a>.<\/div>\n
    At this point our Feline function inherits from Mammal whose in turn inherits from LivingBeing, in other words all the properties of LivingBeing and Mammal are present in Feline. One important thing to notice is that you can make Feline to inherit from many other objects doing something like:<\/p>\n
    \r\nfunction Feline() {\r\n\tMammal.call(this);\r\n\tCarnivore.call(this); \/\/ lets assume that you have a function named Carnivore\r\n\tthis.legs = 4;\r\n}\r\n<\/pre>\n
    TOC<\/a><\/sub><\/p>\n
    <\/a>3.2 Inheriting methods<\/h3>\n
    JavaScript does not have “methods” in the form that class-based languages define them. In JavaScript a method can be added to an object just like any normal property, and if you have two properties with the same name in the prototype chain the first one found will be used and any other one upper in the chain will be ignored, this is called “property shadowing”.<\/p>\n
    Let’s update the previous example to add a few methods:<\/p>\n
    \r\n'use strict';\r\n\r\n\/**\r\n * Constructor for any living being\r\n * Prototype chain: LivingBeing --> Object.prototype --> null\r\n *\/\r\nfunction LivingBeing () {\r\n\tthis.isAlive = true;\r\n\tthis.birthday = new Date();\r\n\tthis.legs = 0;\r\n\tthis.diet = '-';\r\n}\r\n\r\nLivingBeing.prototype.move = function (distance, direction) {\r\n\tconsole.error('Sorry this living being can\\'t move');\r\n}\r\n\r\n\/**\r\n * Mammals\r\n * Prototype chain: Mammal --> LivingBeing.prototype --> Object.prototype --> null\r\n *\/\r\nfunction Mammal() {\r\n\tLivingBeing.call(this);\r\n\tthis.bodyTemperature = 30;\r\n}\r\n\r\n\/\/ Mammals inherit from LivingBeing\r\nMammal.prototype = Object.create(LivingBeing.prototype);\r\nMammal.prototype.constructor = Mammal;\r\nMammal.prototype.move = function (distance, direction) {\r\n\tconsole.log('Walking ' + distance + ' ' + direction);\r\n}\r\nMammal.prototype.walk = function (distance, direction) {\r\n\tthis.move(distance, direction);\r\n}\r\n\r\n\/**\r\n * Felines\r\n * Prototype chain: Feline --> Mammal.prototype --> LivingBeing.prototype --> Object.prototype --> null\r\n *\/\r\nfunction Feline() {\r\n\tMammal.call(this);\r\n\tthis.diet = 'Meat';\r\n\tthis.legs = 4\r\n}\r\n\r\nFeline.prototype = Object.create(Mammal.prototype);\r\nFeline.prototype.constructor = Feline;\r\n<\/pre>\n
    Now we added the ability to move around in our LivingThing. However, many living creatures don’t actually move but stay in the same place or perhaps they just drift on a current, so the default implementation just print an error message.<\/p>\n
    Let’s create a quick test of our code:<\/p>\n
    \r\nvar grumpyCat = new Feline();\r\ngrumpyCat.walk('1 meter', 'north');\r\n\r\nvar coralReef = new LivingBeing();\r\ncoralReef.move('1 meter', 'south');\r\n<\/pre>\n
    The previous code will print the following:<\/p>\n
    \r\nWalking 1 meter north\r\nSorry this living being can't move\r\n<\/pre>\n
    TOC<\/a><\/sub><\/p>\n
    <\/a>4. The Complete example<\/h2>\n
    So here is the full code for this example:<\/p>\n
    \r\n'use strict';\r\n\r\n\/**\r\n * Constructor for any living being\r\n * Prototype chain: LivingBeing --> Object.prototype --> null\r\n *\/\r\nfunction LivingBeing () {\r\n\tthis.isAlive = true;\r\n\tthis.birthday = new Date();\r\n\tthis.legs = 0;\r\n\tthis.diet = '-';\r\n}\r\n\r\nLivingBeing.prototype.move = function (distance, direction) {\r\n\tconsole.error('Sorry this living being can\\'t move');\r\n}\r\n\r\n\/**\r\n * Mammals\r\n * Prototype chain: Mammal --> LivingBeing.prototype --> Object.prototype --> null\r\n *\/\r\nfunction Mammal() {\r\n\tLivingBeing.call(this);\r\n\tthis.bodyTemperature = 30;\r\n}\r\n\r\n\/\/ Mammals inherit from LivingBeing\r\nMammal.prototype = Object.create(LivingBeing.prototype);\r\nMammal.prototype.constructor = Mammal;\r\nMammal.prototype.move = function (distance, direction) {\r\n\tconsole.log('Walking ' + distance + ' ' + direction);\r\n}\r\nMammal.prototype.walk = function (distance, direction) {\r\n\tthis.move(distance, direction);\r\n}\r\n\r\n\/**\r\n * Felines\r\n * Prototype chain: Feline --> Mammal.prototype --> LivingBeing.prototype --> Object.prototype --> null\r\n *\/\r\nfunction Feline() {\r\n\tMammal.call(this);\r\n\tthis.diet = 'Meat';\r\n\tthis.legs = 4\r\n}\r\n\r\nFeline.prototype = Object.create(Mammal.prototype);\r\nFeline.prototype.constructor = Feline;\r\n\r\nfunction Bird () {\r\n\tLivingBeing.call(this);\r\n\tthis.legs = 2;\r\n\tthis.wings = 2;\r\n}\r\n\r\nBird.prototype = Object.create(LivingBeing.prototype);\r\nBird.prototype.constructor = Bird;\r\nBird.prototype.move = function(distance, direction) {\r\n\tconsole.log('Flying ' + distance + ' ' + direction);\r\n}\r\nBird.prototype.fly = Bird.prototype.move;\r\n\r\nfunction Parrot () {\r\n\tBird.call(this);\r\n\tthis.diet = 'Birdseed';\r\n}\r\n\r\nParrot.prototype = Object.create(Bird.prototype);\r\nParrot.prototype.constructor = Parrot;\r\n\r\nvar grumpyCat = new Feline();\r\ngrumpyCat.walk('1 meter', 'north');\r\n\r\nvar coralReef = new LivingBeing();\r\ncoralReef.move('1 meter', 'south');\r\n\r\nvar blue = new Parrot();\r\nblue.fly('1 Km', 'east');\r\n\r\nfunction printPrototypeChain(name, object)\r\n{\r\n\tconsole.log('Prototype chain:\\n');\r\n\tvar prototypeObject = Object.getPrototypeOf(object);\r\n\tdo {\r\n\t\tconsole.log('--');\r\n\t\tObject.getOwnPropertyNames(prototypeObject).forEach(function(propertyName, idx, array) {\r\n\t\t\tconsole.log(propertyName + ' -> ' + prototypeObject[propertyName]);\r\n\t\t});\r\n\t\tprototypeObject = Object.getPrototypeOf(prototypeObject);\r\n\t} while (prototypeObject !== null);\r\n\tconsole.log('\\n');\r\n}\r\n\r\n\/**\r\n * Let's just print the entire prototype chain\r\n *\/\r\nprintPrototypeChain('LivingBeing', coralReef);\r\nprintPrototypeChain('Feline', grumpyCat);\r\nprintPrototypeChain('Parrot', blue);\r\n<\/pre>\n
    We have added two more constructors namely: Bird and Parrot and a new implementation of move, in this case for birds and also we created an new property called fly to which we just assigned the value of move property so fly can be called like any other method.<\/p>\n
    There is also a new function named ‘printPrototypeChain’ that you can use to see the entire prototype chain for any given object.
    \n    TOC<\/a><\/sub><\/p>\n
    <\/a>5. Download<\/h2>\n
    Download<\/strong>
    \nYou can download the full source code of this example here:     JavaScript Inheritance Example<\/strong><\/a><\/div>\n
    TOC<\/a><\/sub><\/p>\n","protected":false},"excerpt":{"rendered":"
    EDITORIAL NOTE: In this post, we feature a comprehensive JavaScript Inheritance Example. In object-oriented programming, inheritance enables new objects to take on the properties of existing objects. A class that is used as the basis for inheritance is called a super-class or base class. A class that inherits from a super-class is called a subclass …<\/p>\n","protected":false},"author":60,"featured_media":920,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[9],"tags":[116],"class_list":["post-2752","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-javascript","tag-inheritance"],"yoast_head":"\nJavaScript Inheritance Example - Web Code Geeks - 2026<\/title>\n<meta name=\"description\" content=\"Interested to learn about JavaScript Inheritance? Check our Example on how JS is a prototype based language & doesn't implement a traditional class system.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"JavaScript Inheritance Example - Web Code Geeks - 2026\" \/>\n<meta property=\"og:description\" content=\"Interested to learn about JavaScript Inheritance? Check our Example on how JS is a prototype based language & doesn't implement a traditional class system.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/\" \/>\n<meta property=\"og:site_name\" content=\"Web Code Geeks\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/webcodegeeks\" \/>\n<meta property=\"article:published_time\" content=\"2015-03-19T10:15:57+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2018-06-19T19:45:10+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"150\" \/>\n\t<meta property=\"og:image:height\" content=\"150\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Eivar Montenegro\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@eivar\" \/>\n<meta name=\"twitter:site\" content=\"@webcodegeeks\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Eivar Montenegro\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"10 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/\"},\"author\":{\"name\":\"Eivar Montenegro\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/18d7d44386645295c47c2ec290933d9e\"},\"headline\":\"JavaScript Inheritance Example\",\"datePublished\":\"2015-03-19T10:15:57+00:00\",\"dateModified\":\"2018-06-19T19:45:10+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/\"},\"wordCount\":1926,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg\",\"keywords\":[\"inheritance\"],\"articleSection\":[\"JavaScript\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/\",\"url\":\"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/\",\"name\":\"JavaScript Inheritance Example - Web Code Geeks - 2026\",\"isPartOf\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg\",\"datePublished\":\"2015-03-19T10:15:57+00:00\",\"dateModified\":\"2018-06-19T19:45:10+00:00\",\"description\":\"Interested to learn about JavaScript Inheritance? Check our Example on how JS is a prototype based language & doesn't implement a traditional class system.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/#primaryimage\",\"url\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg\",\"contentUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg\",\"width\":150,\"height\":150},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.webcodegeeks.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"JavaScript\",\"item\":\"https:\/\/www.webcodegeeks.com\/category\/javascript\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"JavaScript Inheritance Example\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#website\",\"url\":\"https:\/\/www.webcodegeeks.com\/\",\"name\":\"Web Code Geeks\",\"description\":\"Web Developers Resource Center\",\"publisher\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.webcodegeeks.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\",\"name\":\"Exelixis Media P.C.\",\"url\":\"https:\/\/www.webcodegeeks.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png\",\"contentUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png\",\"width\":864,\"height\":246,\"caption\":\"Exelixis Media P.C.\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/webcodegeeks\",\"https:\/\/x.com\/webcodegeeks\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/18d7d44386645295c47c2ec290933d9e\",\"name\":\"Eivar Montenegro\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/1ff696bedb18703e02a60709ee36bcf7edfaeeadd58281929f36d39076cfd1ce?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/1ff696bedb18703e02a60709ee36bcf7edfaeeadd58281929f36d39076cfd1ce?s=96&d=mm&r=g\",\"caption\":\"Eivar Montenegro\"},\"description\":\"Eivar has graduated from the Faculty of Computer Systems Engineering from the technological University of Panama. During his career he has been involved in numerous projects ranging from programming and design of information systems, billing platforms, social networks, mobile applications and web applications. He works as an independent software consultant and is mainly involved with projects based on web technologies like Wordpress, Laravel, Servlets (Java), HTML5, CSS3 and Javascript.\",\"sameAs\":[\"https:\/\/x.com\/eivar\"],\"url\":\"https:\/\/www.webcodegeeks.com\/author\/eivar-montenegro\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"JavaScript Inheritance Example - Web Code Geeks - 2026","description":"Interested to learn about JavaScript Inheritance? Check our Example on how JS is a prototype based language & doesn't implement a traditional class system.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/","og_locale":"en_US","og_type":"article","og_title":"JavaScript Inheritance Example - Web Code Geeks - 2026","og_description":"Interested to learn about JavaScript Inheritance? Check our Example on how JS is a prototype based language & doesn't implement a traditional class system.","og_url":"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/","og_site_name":"Web Code Geeks","article_publisher":"https:\/\/www.facebook.com\/webcodegeeks","article_published_time":"2015-03-19T10:15:57+00:00","article_modified_time":"2018-06-19T19:45:10+00:00","og_image":[{"width":150,"height":150,"url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg","type":"image\/jpeg"}],"author":"Eivar Montenegro","twitter_card":"summary_large_image","twitter_creator":"@eivar","twitter_site":"@webcodegeeks","twitter_misc":{"Written by":"Eivar Montenegro","Est. reading time":"10 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/#article","isPartOf":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/"},"author":{"name":"Eivar Montenegro","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/18d7d44386645295c47c2ec290933d9e"},"headline":"JavaScript Inheritance Example","datePublished":"2015-03-19T10:15:57+00:00","dateModified":"2018-06-19T19:45:10+00:00","mainEntityOfPage":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/"},"wordCount":1926,"commentCount":0,"publisher":{"@id":"https:\/\/www.webcodegeeks.com\/#organization"},"image":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/#primaryimage"},"thumbnailUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg","keywords":["inheritance"],"articleSection":["JavaScript"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/","url":"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/","name":"JavaScript Inheritance Example - Web Code Geeks - 2026","isPartOf":{"@id":"https:\/\/www.webcodegeeks.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/#primaryimage"},"image":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/#primaryimage"},"thumbnailUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg","datePublished":"2015-03-19T10:15:57+00:00","dateModified":"2018-06-19T19:45:10+00:00","description":"Interested to learn about JavaScript Inheritance? Check our Example on how JS is a prototype based language & doesn't implement a traditional class system.","breadcrumb":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/#primaryimage","url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg","contentUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg","width":150,"height":150},{"@type":"BreadcrumbList","@id":"https:\/\/www.webcodegeeks.com\/javascript\/javascript-inheritance-example\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.webcodegeeks.com\/"},{"@type":"ListItem","position":2,"name":"JavaScript","item":"https:\/\/www.webcodegeeks.com\/category\/javascript\/"},{"@type":"ListItem","position":3,"name":"JavaScript Inheritance Example"}]},{"@type":"WebSite","@id":"https:\/\/www.webcodegeeks.com\/#website","url":"https:\/\/www.webcodegeeks.com\/","name":"Web Code Geeks","description":"Web Developers Resource Center","publisher":{"@id":"https:\/\/www.webcodegeeks.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.webcodegeeks.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.webcodegeeks.com\/#organization","name":"Exelixis Media P.C.","url":"https:\/\/www.webcodegeeks.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png","contentUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png","width":864,"height":246,"caption":"Exelixis Media P.C."},"image":{"@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/webcodegeeks","https:\/\/x.com\/webcodegeeks"]},{"@type":"Person","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/18d7d44386645295c47c2ec290933d9e","name":"Eivar Montenegro","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/1ff696bedb18703e02a60709ee36bcf7edfaeeadd58281929f36d39076cfd1ce?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/1ff696bedb18703e02a60709ee36bcf7edfaeeadd58281929f36d39076cfd1ce?s=96&d=mm&r=g","caption":"Eivar Montenegro"},"description":"Eivar has graduated from the Faculty of Computer Systems Engineering from the technological University of Panama. During his career he has been involved in numerous projects ranging from programming and design of information systems, billing platforms, social networks, mobile applications and web applications. He works as an independent software consultant and is mainly involved with projects based on web technologies like Wordpress, Laravel, Servlets (Java), HTML5, CSS3 and Javascript.","sameAs":["https:\/\/x.com\/eivar"],"url":"https:\/\/www.webcodegeeks.com\/author\/eivar-montenegro\/"}]}},"_links":{"self":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts\/2752","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/users\/60"}],"replies":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/comments?post=2752"}],"version-history":[{"count":0,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts\/2752\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/media\/920"}],"wp:attachment":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/media?parent=2752"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/categories?post=2752"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/tags?post=2752"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}