I changed the Human Prototype and now I am still getting undefined when I check a property:
function Human() {
this.name = "Default Human";
this.age = "Default Age";
this.height = 122;
}
function humanExtend() {
this.address = "Updated Address Sun";
this.power = "ShowBoat";
}
var banmeet = new Human();
console.log(banmeet.name);
Human.prototype = humanExtend;
var bradPitt = new Human();
console.log(bradPitt.power);
But I am getting an undefined for bradPitt.power..
Why is that?
you should have been assigned instance of HumanExtend as below -
function Human() {
this.name = "Default Human";
this.age = "Default Age";
this.height = 122;
}
function humanExtend() {
this.address = "Updated Address Sun";
this.power = "ShowBoat";
}
var banmeet = new Human();
console.log(banmeet.name);
//Assign instance of HumanExtend here
Human.prototype = new humanExtend();
var bradPitt = new Human();
console.log(bradPitt.power);
Related
I created a person constructor and I take a firstname = fn, and lastname = ln, and dateofbirth = dob.
That Code is :
function Person(fn, ln, dob){
this.fn = fn;
this.ln = ln;
this.dob = new Date(dob);
}
and also I added prototype
Person.prototype.calcAge = function(){
const diff = Date.now() - this.dob.getTime();
const age = new Date(diff);
return Math.abs(age.getUTCFullYear() - 1970);
}
This is my first Person constructor.
and second constructor i am taken as a customer constructor and that code is :
function Customer(fn,ln,phone,membership){
Person.call(this,fn,ln);
this.phone = phone;
this.membership = membership;
}
And I am inheriting prototype from person to customer
//Inheriting Person Prototype
Customer.prototype = Object.create(Person.prototype);
// Making Customer Prototype
Customer.prototype.constructor = Customer;
And i am console logging :
const Customer1 = new Customer('Sairam', 'Gudiputis', '790-139-7848', 'Premium');
console.log(Customer1)
but in console i am getting invalid date of birth that i am not used in customer..
function Person(fn, ln, dob){
this.fn = fn;
this.ln = ln;
this.dob = new Date(dob);
}
Person.prototype.calcAge = function(){
const diff = Date.now() - this.dob.getTime();
const age = new Date(diff);
return Math.abs(age.getUTCFullYear() - 1970);
}
function Customer(fn,ln,phone,membership){
Person.call(this,fn,ln);
this.phone = phone;
this.membership = membership;
}
//Inheriting Person Prototype
Customer.prototype = Object.create(Person.prototype);
// Making Customer Prototype
Customer.prototype.constructor = Customer;
const Customer1 = new Customer('Sairam', 'Gudiputis', '790-139-7848', 'Premium');
console.log(Customer1)
If you don't want dob in Customer, add:
if (!(this instanceof Customer)) {
this.dob = new Date(dob);
}
in Person constructor:
function Person(fn, ln, dob){
this.fn = fn;
this.ln = ln;
if (!(this instanceof Customer)) {
this.dob = new Date(dob);
}
}
Person.prototype.calcAge = function(){
const diff = Date.now() - this.dob.getTime();
const age = new Date(diff);
return Math.abs(age.getUTCFullYear() - 1970);
}
function Customer(fn,ln,phone,membership){
Person.call(this,fn,ln);
this.phone = phone;
this.membership = membership;
}
//Inheriting Person Prototype
Customer.prototype = Object.create(Person.prototype);
// Making Customer Prototype
Customer.prototype.constructor = Customer;
const Customer1 = new Customer('Sairam', 'Gudiputis', '790-139-7848', 'Premium');
console.log(Customer1)
Getting undefined value while inheritance in JavaScript OOPS. Student object doesn't inheritance the Person Object
function person(name, age) {
this.name = name;
this.age = age;
this.say = function() {
return this.name + " says Hi..";
}
}
var p1 = new person("Mahesh", "33");
var p2 = new person("Girish", "30");
console.log(p1.say());
console.log(p2.say());
// Inheritance
function student() {};
student.prototype = new person();
var stud1 = new student("Nakktu", "32");
console.log(stud1.say());
You still have to call your super class from within the constructor of the sub class. See this MDN link for more information.
function person(name, age) {
// When no name is provided, throw an error.
if (name === undefined) {
throw 'Unable to create instance of person. Name is required.';
}
this.name = name;
this.age = age;
this.say = function() {
return this.name + " says Hi..";
}
}
var p1 = new person("Mahesh", "33");
var p2 = new person("Girish", "30");
console.log(p1.say());
console.log(p2.say());
// Inheritance
function student(name, age) {
// You need to call your super class.
person.call(this, name, age);
};
// Don't use "new person()", your code will stop working when person() throws
// an error when the 'name' param is required and missing.
student.prototype = Object.create(person.prototype);
var stud1 = new student("Nakktu", "32");
console.log(stud1.say());
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);
I want to call the super method in an extended javascript 'class' by applying classical inheritance.
function Person(name, age) {
this._name = name;
this._age = age;
}
Person.prototype.exposeInfo = function() {
alert(this._name + ' - ' + this._age);
}
function Employee(name, age) {
this.parent.constructor.call(this, name, age);
}
Employee.prototype.exposeInfo = function() {
alert('Call employee');
this.parent.exposeInfo();
}
Employee.prototype = Object.create(Person.prototype);
Employee.prototype.constructor = Employee;
Employee.prototype.parent = Person.prototype;
var p1 = new Person('John Doe', 30);
p1.exposeInfo();
var p2 = new Employee('John Foobar (empl.)', 35);
p2.exposeInfo();
JS Fiddle
The problem is that the method is not being called in the extended class, but only in the parent (Person).
That's because the overriding exposeInfo is being attached to the former prototype object, which is then replaced:
Employee.prototype = Object.create(Person.prototype);
You'll want to reverse the order, attaching methods after creating the prototype:
Employee.prototype = Object.create(Person.prototype);
Employee.prototype.constructor = Employee;
Employee.prototype.parent = Person.prototype;
Employee.prototype.exposeInfo = function() {
// ...
}
You'll also need to use .call() or .apply() with exposeInfo as you did with the constructor:
Employee.prototype.exposeInfo = function() {
alert('Call employee');
this.parent.exposeInfo.apply(this, arguments);
}
Otherwise, the value of this will be determined by the last member operator:
// so, calling:
this.parent.exposeInfo();
// is equivalent to:
alert(this.parent._name + ' - ' + this.parent._age);
// ...
Employee.prototype = Object.create(Person.prototype);
Employee.prototype.constructor = Employee;
Employee.prototype.parent = Person.prototype;
Employee.prototype.exposeInfo = function() {
this.parent.exposeInfo.apply(this, arguments);
// ...
}
It's not going to work.
Example:
// ...
Employee.prototype = Object.create(Person.prototype);
Employee.prototype.constructor = Employee;
Employee.prototype.parent = Person.prototype;
Employee.prototype.exposeInfo = function() {
this.parent.exposeInfo.apply(this, arguments);
// ...
}
ParttimeEmployee = Object.create(Employee.prototype);
ParttimeEmployee.prototype.constructor = ParttimeEmployee;
ParttimeEmployee.prototype.parent = Employee.prototype;
ParttimeEmployee.prototype.exposeInfo = function() {
this.parent.exposeInfo.apply(this, arguments);
// ...
}
var p1 = new Person('Jack', 30);
p1.exposeInfo(); // ok
var p2 = new Employee('Jane', 25);
p2.exposeInfo(); // ok
var p3 = new ParttimeEmployee('John', 20);
p3.exposeInfo(); // infinite recursion !!!
Correct version:
// Person
function Person(name, age) {
this._name = name;
this._age = age;
}
Person.prototype.exposeInfo = function() {
alert(this._name + ' - ' + this._age);
}
// Employee
Employee.prototype = Object.create(Person.prototype);
Employee.prototype.constructor = Employee;
Employee.parent = Person.prototype; // <--
Employee.prototype.exposeInfo = function() {
Employee.parent.exposeInfo.apply(this, arguments); // <--
// ...
}
// ParttimeEmployee
ParttimeEmployee = Object.create(Employee.prototype);
ParttimeEmployee.prototype.constructor = ParttimeEmployee;
ParttimeEmployee.parent = Employee.prototype; // <--
ParttimeEmployee.prototype.exposeInfo = function() {
ParttimeEmployee.parent.exposeInfo.apply(this, arguments); // <--
// ...
}
var p1 = new Person('Jack', 30);
p1.exposeInfo(); // ok
var p2 = new Employee('Jane', 25);
p2.exposeInfo(); // ok
var p3 = new ParttimeEmployee('John', 20);
p3.exposeInfo(); // ok
var setAge = function (newAge) {
this.age = newAge;
};
// now we make bob
var bob = new Object();
bob.age = 30;
bob.setAge = setAge;
bob.setAge(50);
console.log(bob.age);
This works, but when I try to do this
var setAge = function (newAge) {
this.age = newAge;
};
var bob = new Object();
bob.age = 30;
bob.setAge(50);
console.log(bob.age);
it returns "bob.setAge() is not a function" in the compiler?
The second example doesn't work because you haven't defined setAge, as you have here bob.setAge = setAge;. You created a new Object(), not a new custom-defined object. You're using sorta hybrid code... this is how you could do "classes"
var MyObject = function (age) {
this.age = age;
var that = this;
this.setAge = function (newAge) {
that.age = newAge;
}
};
var foo = new MyObject(10);
alert(foo.age);
foo.setAge(20);
alert(foo.age);
You have created an object 'Bob', but that object does not have the method 'setAge' until you assign it.
You may want to look into doing something like this in your design:
function Person(){
this.age = 30;
this.setAge = function(age){
this.age = age;
return this;
}
}
var bob = new Person;
bob.setAge(20);
console.log(bob.age);