blocks|key|823400|text|您在最后一次调用的方法modify()是在全局上下文中调用的，如果您想覆盖modify()，您首先必须继承A或B。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|823401|也许你正在尝试这样做：|823402|在这种情况下，C继承A|823403|function+A()+{
++++this.modify+=+function()+{
++++++++alert("in+A");
++++}
}

function+B()+{
++++this.modify+=+function()+{
++++++++alert("in+B");
++++}
}

C+=+function()+{
++++this.modify+=+function()+{
++++++++alert("in+C");
++++};

++++C.prototype.modify();+//+you+can+call+this+method+where+you+need+to+call+modify+of+the+parent+class
}

C.prototype+=+new+A();|code-block|syntax|javascript|823404|entityMap^0|B|8|11|8|1H|1|1J|1|0|0|7|1|A|1|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@$9|R|A|S|B|C]|$9|T|A|U|B|C]|$9|V|A|W|B|C]|$9|X|A|Y|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|Z|8|@]|D|@]|E|$]]|$1|H|3|I|5|6|7|10|8|@$9|11|A|12|B|C]|$9|13|A|14|B|C]]|D|@]|E|$]]|$1|J|3|K|5|L|7|15|8|@]|D|@]|E|$M|N]]|$1|O|3|-4|5|6|7|16|8|@]|D|@]|E|$]]]|P|$]]

the method <code>modify()</code> that you called in the last is called in global context
if you want to override <code>modify()</code> you first have to inherit <code>A</code> or <code>B</code>. 

Maybe you're trying to do this:

In this case <code>C</code> inherits <code>A</code>

<pre><code>function A() {
 this.modify = function() {
 alert("in A");
 }
}

function B() {
 this.modify = function() {
 alert("in B");
 }
}

C = function() {
 this.modify = function() {
 alert("in C");
 };

 C.prototype.modify(); // you can call this method where you need to call modify of the parent class
}

C.prototype = new A();
</code></pre>

blocks|key|608467|text|您的示例中的modify()是一个私有函数，它只能在A、B或C定义中才能从任何地方访问。您需要将其声明为|type|unstyled|depth|inlineStyleRanges|entityRanges|data|608468|this.modify+=+function(){}|code-block|syntax|javascript|608469|C没有对它的父类的引用，除非你把它传递给C。如果C被设置为从A或B继承，它将继承它的公共方法(而不是你定义的modify()那样的私有函数)。一旦C从其父对象继承了方法，您就可以重写继承的方法。|608470|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

modify() in your example is a private function, that won't be accessible from anywhere but within your A, B or C definition. You would need to declare it as

<pre><code>this.modify = function(){}
</code></pre>

C has no reference to its parents, unless you pass it to C. If C is set up to inherit from A or B, it will inherit its public methods (not its private functions like you have modify() defined). Once C inherits methods from its parent, you can override the inherited methods.

blocks|key|823540|text|Once应该避免模仿经典的OO，而使用原型OO。用于原型OO的一个很好的实用程序库是traits。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|823541|与其重写方法和设置继承链(人们应该总是偏爱对象组合而不是对象继承)，不如将可重用的函数捆绑到特征中，并使用这些函数创建对象。|823542|Live+Example|823543|var+modifyA+=+{
++++modify:+function()+{
++++++++this.x+=+300;
++++++++this.y+=+400;
++++}
};

var+modifyB+=+{
++++modify:+function()+{
++++++++this.x+=+3000;
++++++++this.y+=+4000;
++++}
};

C+=+function(trait)+{
++++var+o+=+Object.create(Object.prototype,+Trait(trait));

++++o.modify();
++++console.log("sum+:+"+%2B+(o.x+%2B+o.y));

++++return+o;
}

//C(modifyA);
C(modifyB);|code-block|syntax|javascript|823544|entityMap|0|LINK|mutability|MUTABLE|url|http://traitsjs.org/|1|http://jsfiddle.net/4G9pN/19/^0|16|6|0|0|0|0|C|1|0|0^^$0|@$1|2|3|4|5|6|7|W|8|@]|9|@$A|X|B|Y|1|Z]]|C|$]]|$1|D|3|E|5|6|7|10|8|@]|9|@]|C|$]]|$1|F|3|G|5|6|7|11|8|@]|9|@$A|12|B|13|1|14]]|C|$]]|$1|H|3|I|5|J|7|15|8|@]|9|@]|C|$K|L]]|$1|M|3|-4|5|6|7|16|8|@]|9|@]|C|$]]]|N|$O|$5|P|Q|R|C|$S|T]]|U|$5|P|Q|R|C|$S|V]]]]

Once should avoid emulating classical OO and use prototypical OO instead. A nice utility library for prototypical OO is <a href="http://traitsjs.org/" rel="noreferrer">traits</a>.

Rather then overwriting methods and setting up inheritance chains (one should always favour object composition over object inheritance) you should be bundling re-usable functions into traits and creating objects with those.

<a href="http://jsfiddle.net/4G9pN/19/" rel="noreferrer">Live Example</a>

<pre><code>var modifyA = {
 modify: function() {
 this.x = 300;
 this.y = 400;
 }
};

var modifyB = {
 modify: function() {
 this.x = 3000;
 this.y = 4000;
 }
};

C = function(trait) {
 var o = Object.create(Object.prototype, Trait(trait));

 o.modify();
 console.log("sum : " + (o.x + o.y));

 return o;
}

//C(modifyA);
C(modifyB);
</code></pre>

blocks|key|823594|text|由于这是谷歌上的热门话题，我想给出一个最新的答案。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|823595|使用ES6+classes使得继承和方法重写变得容易得多：|offset|length|823596|'use+strict';

class+A+{
++++speak()+{
++++++++console.log("I'm+A");
++++}
}

class+B+extends+A+{
++++speak()+{
++++++++super.speak();

++++++++console.log("I'm+B");
++++}
}

var+a+=+new+A();
a.speak();
//+Output:
//+I'm+A

var+b+=+new+B();
b.speak();
//+Output:
//+I'm+A
//+I'm+B|code-block|syntax|javascript|823597|当在继承类中使用时，super+keyword引用父类。此外，父类上的所有方法都绑定到子类的实例，因此您不必编写super.method.apply(this);。|style|CODE|823598|至于兼容性：the+ES6+compatibility+table只显示了主要播放器支持类的最新版本(大多数)。火狐浏览器(Chrome和Opera)从今年1月起就有了它们，而使用SpiderMonkey+JS引擎的火狐将在下个月的官方Firefox45版本中看到类。在移动方面，安卓仍然不支持这一功能，而五个月前发布的iOS+9已经部分支持。|823599|幸运的是，有一个用于将Harmony代码重新编译为ES5代码的JS库Babel。类以及ES6中的许多其他很酷的特性可以使您的Javascript代码更具可读性和可维护性。|823600|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes|1|https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/super|2|https://kangax.github.io/compat-table/es6/|3|https://babeljs.io/^0|0|2|B|0|0|0|A|5|1K|P|A|D|1|0|6|R|2|0|Y|5|3|0^^$0|@$1|2|3|4|5|6|7|16|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|17|8|@]|9|@$D|18|E|19|1|1A]]|A|$]]|$1|F|3|G|5|H|7|1B|8|@]|9|@]|A|$I|J]]|$1|K|3|L|5|6|7|1C|8|@$D|1D|E|1E|M|N]|$D|1F|E|1G|M|N]]|9|@$D|1H|E|1I|1|1J]]|A|$]]|$1|O|3|P|5|6|7|1K|8|@]|9|@$D|1L|E|1M|1|1N]]|A|$]]|$1|Q|3|R|5|6|7|1O|8|@]|9|@$D|1P|E|1Q|1|1R]]|A|$]]|$1|S|3|-4|5|6|7|1S|8|@]|9|@]|A|$]]]|T|$U|$5|V|W|X|A|$Y|Z]]|10|$5|V|W|X|A|$Y|11]]|12|$5|V|W|X|A|$Y|13]]|14|$5|V|W|X|A|$Y|15]]]]

Since this is a top hit on Google, I'd like to give an updated answer.

Using <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes" rel="noreferrer">ES6 classes</a> makes inheritance and method overriding a lot easier:

<pre><code>'use strict';

class A {
 speak() {
 console.log("I'm A");
 }
}

class B extends A {
 speak() {
 super.speak();

 console.log("I'm B");
 }
}

var a = new A();
a.speak();
// Output:
// I'm A

var b = new B();
b.speak();
// Output:
// I'm A
// I'm B
</code></pre>

The <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/super" rel="noreferrer"><code>super</code> keyword</a> refers to the parent class when used in the inheriting class. Also, all methods on the parent class are bound to the instance of the child, so you don't have to write <code>super.method.apply(this);</code>.

As for compatibility: <a href="https://kangax.github.io/compat-table/es6/" rel="noreferrer">the ES6 compatibility table</a> shows only the most recent versions of the major players support classes (mostly). V8 browsers have had them since January of this year (Chrome and Opera), and Firefox, using the SpiderMonkey JS engine, will see classes next month with their official Firefox 45 release. On the mobile side, Android still does not support this feature, while iOS 9, release five months ago, has partial support.

Fortunately, there is <a href="https://babeljs.io/" rel="noreferrer">Babel</a>, a JS library for re-compiling Harmony code into ES5 code. Classes, and a lot of other cool features in ES6 can make your Javascript code a lot more readable and maintainable.

blocks|key|823685|text|​|type|unstyled|depth|inlineStyleRanges|entityRanges|data|823686|function+A()+{
++++var+c+=+new+C();
	c.modify+=+function(){
		c.x+=+123;
		c.y+=+333;
	}
	c.sum();
}

function+B()+{
++++var+c+=+new+C();
	c.modify+=+function(){
		c.x+=+999;
		c.y+=+333;
	}
	c.sum();
}


C+=+function+()+{
+++this.x+=+10;
+++this.y+=+20;

+++this.modify+=+function()+{
++++++this.x+=+30;
++++++this.y+=+40;
+++};
+++
+++this.sum+=+function(){
	this.modify();
	console.log("The+sum+is:+"+%2B+(this.x%2Bthis.y));
+++}
}

A();
B();|code-block|syntax|javascript|823687|823688|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|J|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|K|8|@]|9|@]|A|$E|F]]|$1|G|3|4|5|6|7|L|8|@]|9|@]|A|$]]|$1|H|3|-4|5|6|7|M|8|@]|9|@]|A|$]]]|I|$]]

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>function A() {
 var c = new C();
	c.modify = function(){
		c.x = 123;
		c.y = 333;
	}
	c.sum();
}

function B() {
 var c = new C();
	c.modify = function(){
		c.x = 999;
		c.y = 333;
	}
	c.sum();
}


C = function () {
 this.x = 10;
 this.y = 20;

 this.modify = function() {
 this.x = 30;
 this.y = 40;
 };
 
 this.sum = function(){
	this.modify();
	console.log("The sum is: " + (this.x+this.y));
 }
}

A();
B();</code></pre>
</div>
</div>

Let's say you have the below code:

<pre><code>function A() {
 function modify() {
 x = 300;
 y = 400;
 }

 var c = new C();
}

function B() {
 function modify(){
 x = 3000;
 y = 4000;
 }

 var c = new C();
}

C = function () {
 var x = 10;
 var y = 20;

 function modify() {
 x = 30;
 y = 40;
 };

 modify();
 alert("The sum is: " + (x+y));
}
</code></pre>

Now the question is, if there is any way in which I can override the method <code>modify</code> from <code>C</code> with the methods that are in <code>A</code> and <code>B</code>. In Java you would use the <code>super</code>-keyword, but how can you achieve something like this in JavaScript?

JavaScript override methods

Java

假设您有以下代码：function A() {    function modify() {       x = 300;       y = 400;    }    var c = new C();}function B() {    function modify(){       x = 3000;      ...

问JavaScript重写方法
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问JavaScript重写方法EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问JavaScript重写方法
EN