Develop Reference

JavaScript OOP: Uncaught TypeError: is not a function

Have trouble with object creation. Console says that something wrong in the last line. Please tell how it should be, I more familar with Java, so this is little bit confusing for me.
var dog = {
name:"Dog",
age:"11",
getName : function() {
alert(this.name);
}
}
function Dog(name, age) {
this.name = name;
this.age = age;
}
var d1 = new Dog("Rex", 8);
d1.getName();

Your dog is just a simple Object literal,
that means that your getName is bound to it, not to your Dog class.
You can make that function a method of Dog instead:
/*var dog = {
name:"Dog",
age:"11",
getName : function() {
alert(this.name);
}
}*/
function Dog(name, age) {
this.name = name;
this.age = age;
}
Dog.prototype.getName = function() {
console.log( this.name );
}
var d1 = new Dog("Rex", 8);
d1.getName(); // "Rex"
Here's a variant that uses your settings "defaults"
function Dog() {
this.name = "Dog"; // Default name
this.age = 11; // Default age
}
Dog.prototype.getName = function() {
console.log( this.name );
}
var d1 = new Dog();
d1.name = "Rex"; // Override default name
d1.getName(); // "Rex"

You can use class with syntaxic sugar to properly create objects in ES6.
In your exemple that would write like this :
'use strict';
class Dog{
constructor(name, age){
this.name = name;
this.age = age;
}
getName(){
console.log(this.name);
}
}
let doggy = new Dog("krypto", 125);
doggy.getName();

Traditional OO in JavaScript
function Dog(name, age) {
this.name = name || "Dog";// if the name is not given, it defaults to "Dog"
this.age = age || "11";
}
Dog.prototype.getName = function() {
alert(this.name);
}
var d1 = new Dog("Rex", 8);
d1.getName();
More Explicit OO in JavaScript
function createDog(name, age) {
// create a new dog and return it
var dog = {
name: name || "Dog",// if the name is not given, it defaults to "Dog"
age: age || "11"
};
return dog;
}
createDog.getName = function(dog) {
// explicit dog as 1st parameter
alert(dog.name);
}
//createDog is a normal function that returns something, no "new" needed
var d1 = createDog("Rex", 8);
createDog.getName(d1);

How to put functionality into abstract function in JavaScript

I am trying to make it so that I can have some methods in a JavaScript object be inheritable by a child class, but I don't want to allow the parent class to be instantiated. Here is some code that I wrote to illustrate this:
/**
* Shows how basic abstraction works with JavaScript
*/
//Define the person object with a first name, last name, and an age
function Person(firstName, lastName, age) {
//Make it so that this object cannot be instantiated by identifying its constructor
if(this.constructor === Person) {
throw new Error("Can't instantiate an abstract class of type Person!");
}
//Assign instance variables
this.firstName = firstName;
this.lastName = lastName;
this.age = age;
//Create simple get methods
this.getName = function(){
return this.firstName + " " + this.lastName;
}
this.getFirstName = function() {
return this.firstName;
}
this.getLastName = function() {
return this.lastName;
}
this.getAge = function() {
return this.age;
}
}
//Define the student constructor
function Student(firstName, lastName, age, subject) {
//Assign the instance variables including the new subject variable
this.firstName = firstName;
this.lastName = lastName;
this.age = age;
this.subject = subject;
//Add a new function to get the subject from Student
this.getSubject = function() {
return this.subject;
}
}
Student.prototype = Object.create(Person.prototype);
Student.prototype.constructor = Student;
//Testing the inheritance
var joe = new Student("Joe", "Shmo", 33, "Computer Science");
console.log("First Name: " + joe.getFirstName()); //The getFirstName() function is defined in the superclass
console.log("Subject: " + joe.getSubject()); //The getSubject() function is defined in the subclass
With this code I get an error when trying to call getFirstName on the Student object joe. It seems that it would be very useful to have getFirstName be inheritable by the subclass.
I really want to be able to define the getName function in the parent class so that I can then just have that functionality inherited by the subclasses such as Student. Is there any way to do that? I would really appreciate any help!

You need to define your methods in the Person prototype, not in an instance of Person. That way they will be copied when you do Object.create(Person.prototype):
/**
* Shows how basic abstraction works with JavaScript
*/
//Define the person object with a first name, last name, and an age
function Person(firstName, lastName, age) {
//Make it so that this object cannot be instantiated by identifying its constructor
if(this.constructor === Person) {
throw new Error("Can't instantiate an abstract class of type Person!");
}
//Assign instance variables
this.firstName = firstName;
this.lastName = lastName;
this.age = age;
}
Person.prototype.getName = function(){
return this.firstName + " " + this.lastName;
}
Person.prototype.getFirstName = function() {
return this.firstName;
}
Person.prototype.getLastName = function() {
return this.lastName;
}
Person.prototype.getAge = function() {
return this.age;
}
//Define the student constructor
function Student(firstName, lastName, age, subject) {
//Assign the instance variables including the new subject variable
this.firstName = firstName;
this.lastName = lastName;
this.age = age;
this.subject = subject;
//Add a new function to get the subject from Student
this.getSubject = function() {
return this.subject;
}
}
Student.prototype = Object.create(Person.prototype);
Student.prototype.constructor = Student;
//Testing the inheritance
var joe = new Student("Joe", "Shmo", 33, "Computer Science");
console.log("First Name: " + joe.getFirstName()); //The getFirstName() function is defined in the superclass
console.log("Subject: " + joe.getSubject()); //The getSubject() function is defined in the subclass

Create an instance of object internally

I have tried to create an instance of object internally like the following:
var oo = function(){
return new func();
}
var func = function(){
this.name;
this.age;
};
func.prototype = {
setData: function(name, age){
this.name = name;
this.age = age;
},
getData: function (){
return this.name + " " + this.age;
}
}
When usage, I got an error oo.setData is not a function.
oo.setData("jack", 15);
console.log(oo.getData());
What's wrong in my code?

This happens because oo is not a "func", oo returns a new func. You could set the data using
oo().setData('jack',15);
But then you have no way of accessing it.
You could also use
var newfunc = oo();
newfunc.setData('jack',15);
newfunc.getData();

oo is a function to create a object.
var oo = function(){ //the oo variable is used to create func() objects
return new func();
}
var func = function(){ //function
this.name;
this.age;
};
func.prototype = { //define properties to func
setData: function(name, age){
this.name = name;
this.age = age;
},
getData: function (){
return this.name + " " + this.age;
}
}
//create instance
var myObject = oo();
//or
var myObject = new func();
//Use
myObject.setData("jack", 12);
//Get a property
console.log(myObject.getData())

Object prototypes and Inheritance

// the original Animal class and sayName method
function Animal(name, numLegs) {
this.name = name;
this.numLegs = numLegs;
}
Animal.prototype.sayName = function() {
console.log("Hi my name is " + this.name);
};
// define a Penguin class
function Penguin() {
this.name = "penguin";
this.numLegs = 2;
}
// set its prototype to be a new instance of Animal
var penguin = new Animal("Penguin", 2);
penguin.sayName();
The compiler asks me to "Create a new Penguin instance called penguin"...
not sure what I'm doing wrong here

Here's how to make a Penguin object that inherits from Animal using prototypal inheritance in javascript:
// the original Animal class and sayName method
function Animal(name, numLegs) {
this.name = name;
this.numLegs = numLegs;
}
Animal.prototype.sayName = function() {
console.log("Hi my name is " + this.name);
};
// define a Penguin class
function Penguin() {
this.name = "penguin";
this.numLegs = 2;
}
// set its prototype to be a new instance of Animal
Penguin.prototype = new Animal();
// Create new Penguin
var penguin = new Penguin();
penguin.sayName(); // outputs "Hi my name is penguin"
var legCount = penguin.numLegs; // outputs 2
Here's an article that explains JavaScript Prototypal Inheritance in detail:
http://pietschsoft.com/post/2008/09/JavaScript-Prototypal-Inheritence-Explained-in-Simple-Terms

Add new property to Prototype using contructor argument

If I have:
function Person(name, age){
this.name = name;
this.whoIs = function(){
alert('I am ' + this.name);
}
}
var john = new Person('John');
john.whoIs();
all will work and I will get a nice alert with: "I am John".
Is there a way to add method to the prototype after the constructor and that will have access to the constructor arguments?
Something like:
function Person(name, age){
this.name = name;
this.whoIs = function(){
alert('I am ' + this.name);
}
}
Person.prototype.age = Person.arguments[1];
var john = new Person('John', 20);
john.age; // would give 20
Is there a way to do this? Ie: being able to add a property or method to a prototype that will have access to the arguments when a new instance is created?

It doesn't make sense to have a dynamic property in the prototype. See the prototype as the blueprint of your object.
You can do this:
function Person(name, age){
this.name = name;
this.whoIs = function(){
alert('I am ' + this.name);
}
this.age = age;
}
var john = new Person('John', 20);
john.age; // would give 20
Also, the whoIs function is added for each Person object. You can add it to the prototype instead:
function Person(name, age){
this.name = name;
this.age = age;
}
Person.prototype.whoIs = function () {
return 'I am ' + this.name;
}
var john = new Person('John', 20);
john.whoIs(); // would give "I am John"