JavaScript构造函数没有执行？

Question

我正在尝试实现我在JavaScript继承中找到的示例，并且子对象似乎没有按预期构建。在下面的示例中，创建jill实例不会返回Jill对象，并且无法调用子节点或父节点中的方法。

var Person = function() {
  this.name = "unnamed";
}
Person.prototype.sayName = function() {
  console.log("My name is " + this.name);
}
var Jill = function() {
  var jill = function() {
    Person.call(this);
    this.name = "Jill";
  };
  jill.prototype = Object.create(Person.prototype);
  jill.prototype.constructor = jill;
  jill.prototype.expressJoy = function() {
    console.log("Huray!");
  };
  return jill;
}
var jill = new Jill();
console.log(jill instanceof Jill); // false
jill.expressJoy(); // error, is not a function
jill.sayName(); // error, seen if comment out previous line

Answer 1

在你的情况下，var Jill就像一个常规函数，而不像构造函数 更改您的代码，如下所示：

var Jill = (function () {
    function Jill() {
        Person.call(this);
        this.name = "Jill";
    };
    Jill.prototype = Object.create(Person.prototype);
    Jill.prototype.constructor = Jill;
    Jill.prototype.expressJoy = function () {
        console.log("Huray!");
    };
    return Jill;
})();

var jill = new Jill();
console.log(jill);   // Jill {name: "Jill"}
console.log(jill instanceof Jill); // true
jill.expressJoy(); // Huray!
jill.sayName();    // My name is Jill

现在Jill是一个“真正的”构造函数，它将按预期生成对象。 （顺便说一句，根据良好做法，构造函数名称应以大写字母开头）

Answer 2

你错误地启动了这个对象，

var jill = Jill();
var obj = new jill();

函数Jill返回的函数reference不是object。最重要的是，返回函数引用我们必须为您的需求创建object。

Answer 3

这是更正后的代码，将进行详细说明编辑：

JSBIN Example

// This is your Person class, all "people" will inherit from this object

var Person = function() {
  this.name = "unnamed";
};
// add the sayName function to this prototype
Person.prototype.sayName = function() {
  console.log("My name is " + this.name);
};

// now we make a 'Jill' constructor;
var Jill = function() {
  Person.call(this); // bind this (Jill) to Person
  this.name = 'jill';
};

// create the correct prototype delegation here
Jill.prototype = Object.create(Person.prototype);

// the above code, sets  Jill's constructor, to Person so we need to set 
// it back to Jill here:

Jill.prototype.constructor = Jill;

// add functions on Jill's prototype, these will only be on the Jill object not Person

Jill.prototype.expressJoy = function() {
    console.log("Huray!");
  };

// make a 'Jill'

var obj = new Jill();
console.log(obj instanceof Jill); // true
obj.expressJoy(); // "Huray!"
obj.sayName(); // "My name is jill"

现在更重要的是你混合了两种类型的实例化模式，原型和伪经典，Person是后者，而Jill是前者。

看看Ryan Atkinson撰写的以下博文中的精彩图片：

Blog Post

Answer 4

使用您的代码，您需要：

1）内部函数中的return new jill();，然后

2）var jill = Jill();调用创建新实例的函数。

DEMO

这是一种不太复杂的方法。

function Person() {
  this.name = "unnamed";
}

Person.prototype.sayName = function() {
  console.log("My name is " + this.name);
}

function Jill() {
  Person.call(this);
  this.name = "Jill";
}
Jill.prototype = Object.create(Person.prototype);
Jill.prototype.constructor = Jill;
Jill.prototype.expressJoy = function() {
  console.log("Huray!");
};

var jill = new Jill();

DEMO

Answer 5

这应该有效

function Person() {
  this.name = "unnamed";
};
Person.prototype.sayName = function() {
  console.log("My name is " + this.name);
};

function Jill() {
    Jill.prototype.__proto__ = Person.prototype;

    this.name = "Jill";

    Jill.prototype.expressJoy = function() {
        console.log("Huray!");
    };

    return Jill;
};

var jill = new Jill();
console.log(jill instanceof Jill); // True
jill.expressJoy(); // Hurray !
jill.sayName(); // My name is Jill