We Keep Coding

how to implement javascript inheritance

I'm looking into javascript inheritance for the first time, and I don't seem to be able to get it to work, or perhaps I'm not understanding it correctly.
So I have some code here, let's have a look at it:
<script language="javascript" type="text/javascript">
//object and prototype
function cat(name){//object constructor
this.name = name;//property
this.talk = function(){//method
console.log(this.name + " say meeow");
}
}
cat1 = new cat("Cat 1 Felix")
cat1.talk();
cat2 = new cat("cat 2 Joy")
cat2.talk()
//inheritance
function isleManCat(name){
cat.call(this,name)
this.feature = "no tail"
this.detail = function(){
console.log(this.name + " has " + this.feature);
}
}
isleManCat.prototype = new cat();
cat3 = new isleManCat("isle of Man cat")
cat3.talk();
cat3.detail();
</script>
So I have 2 cats objects here and cat1 and cat2 prints the expected results:
Cat 1 Felix say meeow
cat 2 Joy say meeow
. Then cat3 is a isleOfMan() cat which should inherit from cat(), and I would have thought that it would inherit the name property from cat() but it prints undefined:
undefined say meeow
undefined has no tail
Can somebody kindly let me know why it doesn't work and what i'm doing wrong please as I don't seem to understand that?
Thanks

Your third kitten deriving cat won't produce your expected result because the cat constructor won't be called by isleManCat's constructor auto-magically! And your third kitten has no name at all!
// You need to pass the name of the whole cat to this constructor
// to later give it as argument to base constructor (i.e. cat())
function isleManCat(name){
// This is calling cat constructor function setting the "this"
// keyword to the "this" of isleManCat
cat.call(this, name);
this.feature = "no tail"
this.detail = function(){
console.log(this.name + " has " + this.feature);
}
}
In ECMA-Script 5.x you can also use Function.prototype.apply and arguments reserved keyword to pass isleOfMan constructor's arguments as an array to cat:
function isleManCat(){
cat.apply(this, arguments);
this.feature = "no tail"
this.detail = function(){
console.log(this.name + " has " + this.feature);
}
}
And, in ECMA-Script 2015 and above, you can use rest parameters:
function isleManCat(...args){
// This is calling cat constructor function setting the "this"
// keyword to the "this" of isleManCat
cat.apply(this, args);
this.feature = "no tail"
this.detail = function(){
console.log(this.name + " has " + this.feature);
}
}

syntax error but coudn't debug javascript prototype

// create your Animal class here
function Animal(name, numLegs){
this.name = name;
this.numLegs = numLegs;
}
// create the sayName method for Animal
Animal.prototype.sayName(){
console.log("Hi my name is " + this.name);
}
// provided code to test above constructor and method
var penguin = new Animal("Captain Cook", 2);
penguin.sayName();
not working, cannot find what's wrong. Any tool to debug besides chrome console? sometime it can't tell which line has problem.

You have to create prototype methods like this
Animal.prototype.sayName = function(){
console.log("Hi my name is " + this.name);
}

Try this:
// create your Animal class here
function Animal(name, numLegs){
this.name = name;
this.numLegs = numLegs;
}
Animal.prototype.sayName = function(){
console.log("Hi my name is " + this.name);
}
var penguin = new Animal("Captain Cook", 2);
penguin.sayName();

JavaScript Puzzle I can't figure out

This is a kata for code wars, and I can't seem to figure it out. I have never worked with JavaScript before.
I know the answer is probably simple, but I just can't seem to figure out what they are looking for even after many hours of searching. I know that name in the greet function is not defined, but when I define it, it says it's not the value it's looking for.
function Person(name){
this.name = name;
}
Person.prototype.greet = function(otherName){
return "Hi " + otherName + ", my name is " + name;
}
Please help and an explanation would be greatly appreciated.

Don't really understand what you are looking for but hope this will shed some light : (try on your console)
function Person(name){
this.name = name;
}
Person.prototype.greet = function(otherName){
return "Hi " + otherName + ", my name is " + this.name;
}
var p = new Person('jack');
p.greet('sparrow');

Tyagi gave you an explanation of how to call it but did not show what the actual problem with the code is:
Here's my (very similar) example:
function Person(name) {
this.name = name;
}
Person.prototype.greet = function (otherName) {
return "Hi " + otherName + ", my name is " + this.name;
}
var john = new Person("John");
$("#result").text(john.greet("Mike"));
and if you click through to this JSFiddle then you can see it actually working. The difference between the two is simply the change of "name" to "this.name" in the greet() function. You're attaching a new function to every Person object but it doesn't automatically look for the name variable on the object within that function the way it's defined.

I don't get your question but i will try to explain how it works:
// define a function (or class) called 'Person'
function Person(name){
// add data members 'name' to 'this' pointer which points to current context
this.name = name;
}
// define a method in 'Person' class
Person.prototype.greet = function(otherName){
//'othername' is an argument which you passed while calling 'greet' method
//'name' is an data memeber which you declared while creating 'Person' class
// will return value when you call this method
return "Hi " + otherName + ", my name is " + this.name;
}
// create a class object
var person = new Person('Mohit');
// call its 'greet' method
// will show an alert 'Hi Bekk, my name is Mohit'
alert(person.greet('Bekk'));
JSFiddle Link: http://jsfiddle.net/QqnL5/

New Object Creation issues

Ok so the following function acts as a constructor to create an Employee object(no problem with that). But when I use this function to create 3 new employees I am messing up somewhere.
I know I'm supposed to set the properties and print the employee's name and phone number, but I am missing something or something is in the wrong place.
Thanks in advance for your help.
function Employe() {
var = name;
var = phone;
this.getName = function () {
return this.name;
}
this.setName = function (name, phone) {
this.name = name;
this.phone = phone;
};
}
var emp1 = newEmployee;
this.Name = 'jo';
this.Phone = ' 555-5551'
document.write(Employee.name Employee.phone);
var emp2 = newEmployee;
this.Name = 'jim';
this.Phone = '555-5552';
document.write(Employee.name Employee.phone);
var emp3 = newEmployee;
this.Name = 'jon';
this.Phone = '555-5553';
document.write(Employee.name Employee.phone);

In the following:
> var emp1 = newEmployee;
The variable on the left will be assigned the result of evaluating the expression on the right. There is no identifier newEmployee, so you will get an error. What you probably meant to write is:
var emp1 = new Employee();
That will call the constructor, which will return a new instance, a reference to which will be assigned to emp1.
Then you have:
> this.Name = 'jo';
The value of this is set when entering an execution context. For global code, it always references the global object (which is equivalent to window in a browser). So the above line creates a Name property of the global object and assigns the value 'jo';
What you wanted is probably:
emp1.setName('jo','555-5551');
The name of that method seems inappropriate given that it sets both the name and phone number.
> document.write(Employee.name Employee.phone);
Since you added the properties to the instance (emp1), likely that's the properties you want to read:
document.write(emp1.name + ' ' + emp1.phone);
or to use the getName method:
document.write(emp1.getName() + ' ' + emp1.phone);
and so on.

There's a lot wrong with your code example. The constructor is misspelled. The employee instances should be created like:
var emp1 = new Employee();
The instance properties should be set like:
emp1.setName('John');
You've also combined two setters into one, which is confusing.
To access the instance properties, you should use:
emp1.getName();
Not:
Employee.Name

Yes you have a lot of errors I think this is basically what you want to achieve.
function Employee(){
this.name;
this.phone;
this.getName = function(){
return this.name;
};
this.setName = function(name, phone){
this.name = name;
this.phone = phone;
};
}
function employ(){
var emp1 = new Employee();
emp1.name = 'jo';
emp1.phone = ' 555-5551' ;
alert(emp1.getName());
}
http://jsfiddle.net/umNTs/

Why does the greet function not return the expected value?

Question:
Why does the greet function not return the expected value?
Code:
function Person(name){
this.name = name;
}
Person.prototype.greet = function(otherName){
return "Hi" + otherName + ", my name is " + name;
}
How do I answer this? I create a new person then what do I do?
var John = new Person("John");

Wrong access method. the variable name isn't defined, only this.name is defined. So it's looking for a variable in the function scope called name instead of a property of the object called name.
To access an object's property from within the object we use the this keyword. Thus we'll need to use this.name to access the name property in the implementation below.
Person.prototype.greet = function(otherName){
return "Hi" + otherName + ", my name is " + this.name;
}

In your code:
> function Person(name) {
> this.name = name;
> }
When called as a constructor, the above will create a named property of an instance called name and assign it the value of the name parameter.
> Person.prototype.greet = function(otherName){
> return "Hi" + otherName + ", my name is " + name;
> }
Here the identifier name is used as a variable, but the identifier you are looking for is a named property of the instance, so you need to access it at as such. Typically, this function will be called as a method of the instance so this within the function will be a reference to the instance. So you want:
return "Hi" + otherName + ", my name is " + this.name;
So now when you can do (note that variables starting with a capital letter are, by convention, reserved for construtors):
> var john = new Person("John");
and then:
john.greet('Fred');
because greet is called as a method of john, it will return:
Hi Fred, my name is John

Alternatively, since this is an issue of scope inheritance (second function not having access to the variable "name"), we can rephrase the code to look like this to include it all under the Person function:
function Person(name){
this.name = name;
this.greet = function(otherName){
return "Hi" + otherName + ", my name is " + name;
}
}
Works as well.

You need to change the greet function to use the object's name with the this keyword:
Person.prototype.greet = function(otherName){
return "Hi" + otherName + ", my name is " + this.name;
}
after that, just call John.greet("other name");

Try the following:
function Person(name){
this.name = name;
this.greet = function(otherName){
return "Hi " + otherName + ", my name is " + name;
}
}
Person("Joe")
greet("Kate")