Question

下面有一大堆代码：

function Foo(name){
    this.name = name;
}

Foo.prototype.myName = function() {
    return this.name;
}

function Bar(name, label){
  Foo.call(this, name);
  this.label = label;

}
Bar.prototype = Object.create(Foo.prototype);

Bar.prototype.myLabel = function(){
   return this.label;
}

var a = new Bar("a" , "obj a");

a.myName();
a.myLabel();

好的，现在按照我的理解

它创建一个设置名称

Foo

它在Foo的链接原型Object上创建一个函数myName。
它创建一个函数Bar，它只设置标签并使用函数Foo的功能来设置名称而不是自己做。
然后在Foo和Bar之间建立原型链接。所以我假设有两个独立的原型对象分别为Foo和Bar链接。
现在Bar的原型对象里面有一个函数myLabel。
对新Bar的调用会创建一个新对象a，并将其原型对象链接到Bar的原型。

所以 takeways 是：

Foo的原型包含一个get函数 - myName
Foo本身只设置了一个属性名称
Bar的原型有一个get函数 - myLabel
Bar本身就是设置一个属性 - mylabel
对象a's原型链接到Bar's prototype，Foo's prototype本身与This is the code i am working on... <form><table> <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script> <script> $(document).ready(function() { $("#datepicker").datepicker(); $("#datepicker1").datepicker(); $("#datepicker2").datepicker(); $("#datepicker3").datepicker(); $("#datepicker4").datepicker(); $("#datepicker5").datepicker(); $("#datepicker6").datepicker(); }); </script> <Th>Date</th> <Td><input id="datepicker"/></td> <Td><input id="datepicker1"/></td> <Td><input id="datepicker2"/></td> <Td><input id="datepicker3"/></td> <Td><input id="datepicker4"/></td> <Td><input id="datepicker5"/></td> <Td> <input id="datepicker6"/></td> </tr> <tr> <th>Emp Name</th> <td><input type="text" name="cell1"></td> <td><input type="text" name="cell1"></td> <td><input type="text" name="cell1"></td> </tr> <th>Name:</Th> <td> <input type="text" name="source"></td> <br><td> </td> <td> <input type="text" name="dest1"></td> <br> <input type="checkbox" name="copy" onclick="copy(this.form)"> <em>Check this box if you wanna copy.</em> <P> <br><br><td> </td><td><input type="text" name="dest2"></td> </td> <br><td> </td><td> <input type="text" name="dest3"></td></td> </form> <script>function FillBilling(t) { if(t.copy.checked == true) { t.dest1.value = t.source.value; t.dest2.value = t.source.value; t.dest3.value = t.source.value; } }</script>相关联。所以总共有三个原型对象。

这种思维流程是否正确？请纠正或添加一些东西来启发讨论。我对语言相当新，它的细微差别，几乎没有用例/原型的实际例子。

Answer 1

首先列举Foo.prototype：

Foo.prototype = { constructor: Foo, myName: function() { return this.name}};

然后Bar调用Foo将'name'应用于正在构造的Bar实例，而不是自己执行，然后再将其第二个参数设置为新的Bar对象属性

但Bar.prototype设置为{}，原型继承自Foo.prototype。例如，Bar.prototype.constructor == Foo; // true

Bar.prototype被分配了一个本地拥有的属性方法myLabel，可由Bar个对象继承，但不能由Foo个对象继承。

所以第1,2,3点是正确的。

第4点不正确。建立了一个原型继承，Bar.prototype继承自Foo.prototype。它不是相互的，而是单向继承：JavaScript不支持任何类型的双向原型继承。

第5点和第6点是正确的。

原型和用法Javascript

1 个答案: