blocks|key|225965|text|这可能是因为，当两个函数编译成JavaScript时，它们的签名完全相同。由于JavaScript没有类型，我们最终创建了两个带有相同数量参数的函数。因此，TypeScript限制了我们创建这样的函数。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|225966|TypeScript支持基于参数数量的重载，但如果我们将其与OO语言进行比较，则需要遵循的步骤略有不同。在回答另一个SO问题时，有人用一个很好的例子解释了它：Method+overloading?。|offset|length|225967|基本上，我们正在做的是，我们只创建了一个函数和许多声明，这样TypeScript就不会给出编译错误。当这段代码编译成JavaScript时，具体的函数就可见了。因为可以通过传递多个参数来调用JavaScript函数，所以它可以正常工作。|225968|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/questions/12688275/method-overloading/12689054#12689054^0|0|27|J|0|0|0^^$0|@$1|2|3|4|5|6|7|P|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|Q|8|@]|9|@$D|R|E|S|1|T]]|A|$]]|$1|F|3|G|5|6|7|U|8|@]|9|@]|A|$]]|$1|H|3|-4|5|6|7|V|8|@]|9|@]|A|$]]]|I|$J|$5|K|L|M|A|$N|O]]]]

This may be because, when both functions are compiled to JavaScript, their signature is totally identical. As JavaScript doesn't have types, we end up creating two functions taking same number of arguments. So, TypeScript restricts us from creating such functions.

TypeScript supports overloading based on number of parameters, but the steps to be followed are a bit different if we compare to OO languages. In answer to another SO question, someone explained it with a nice example: <a href="https://stackoverflow.com/questions/12688275/method-overloading/12689054#12689054">Method overloading?</a>.

Basically, what we are doing is, we are creating just one function and a number of declarations so that TypeScript doesn't give compile errors. When this code is compiled to JavaScript, the concrete function alone will be visible. As a JavaScript function can be called by passing multiple arguments, it just works.

blocks|key|444059|text|在TypeScript中重载时，只有一个具有多个签名的实现。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|444060|class+Foo+{
++++myMethod(a:+string);
++++myMethod(a:+number);
++++myMethod(a:+number,+b:+string);
++++myMethod(a:+any,+b?:+string)+{
++++++++alert(a.toString());
++++}
}|code-block|syntax|javascript|444061|只有这三个重载被TypeScript识别为方法调用的可能签名，而不是实际的实现。|444062|在您的例子中，我个人会使用两个不同名称的方法，因为参数中没有足够的通用性，这使得方法体可能需要有很多“if”来决定要做什么。|444063|TypeScript+1.4|444064|从TypeScript+1.4开始，通常可以使用联合类型消除对重载的需求。使用以下命令可以更好地表达上面的示例：|444065|myMethod(a:+string+%7C+number,+b?:+string)+{
++++alert(a.toString());
}|444066|a的类型为“string或number”。|offset|length|style|CODE|444067|entityMap^0|0|0|0|0|0|0|0|0|1|6|6|D|6|0^^$0|@$1|2|3|4|5|6|7|Y|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|Z|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|10|8|@]|9|@]|A|$]]|$1|I|3|J|5|6|7|11|8|@]|9|@]|A|$]]|$1|K|3|L|5|6|7|12|8|@]|9|@]|A|$]]|$1|M|3|N|5|6|7|13|8|@]|9|@]|A|$]]|$1|O|3|P|5|D|7|14|8|@]|9|@]|A|$E|F]]|$1|Q|3|R|5|6|7|15|8|@$S|16|T|17|U|V]|$S|18|T|19|U|V]|$S|1A|T|1B|U|V]]|9|@]|A|$]]|$1|W|3|-4|5|6|7|1C|8|@]|9|@]|A|$]]]|X|$]]

When you overload in TypeScript, you only have one implementation with multiple signatures. 

<pre><code>class Foo {
 myMethod(a: string);
 myMethod(a: number);
 myMethod(a: number, b: string);
 myMethod(a: any, b?: string) {
 alert(a.toString());
 }
}
</code></pre>

Only the three overloads are recognized by TypeScript as possible signatures for a method call, not the actual implementation. 

In your case, I would personally use two methods with different names as there isn't enough commonality in the parameters, which makes it likely the method body will need to have lots of "ifs" to decide what to do. 

<h1>TypeScript 1.4</h1>

As of TypeScript 1.4, you can typically remove the need for an overload using a union type. The above example can be better expressed using:

<pre><code>myMethod(a: string | number, b?: string) {
 alert(a.toString());
}
</code></pre>

The type of <code>a</code> is "either <code>string</code> or <code>number</code>".

blocks|key|226019|text|作为对其他人的提醒，我已经注意到，至少像WebPack为Angular+2编译的TypeScript所显示的那样，您得到的是overWRITTEN方法，而不是overLOADED方法。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|226020|myComponent+{
++method():+{+console.info("no+args");+},
++method(arg):+{+console.info("with+arg");+}
}|code-block|syntax|javascript|226021|呼叫：|226022|myComponent.method()|226023|似乎执行带有参数的方法，默默忽略无参数版本，并输出：|226024|with+arg|226025|entityMap^0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|R|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|S|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|U|8|@]|9|@]|A|$]]|$1|M|3|N|5|D|7|V|8|@]|9|@]|A|$E|F]]|$1|O|3|-4|5|6|7|W|8|@]|9|@]|A|$]]]|P|$]]

As a heads up to others, I've oberserved that at least as manifested by TypeScript compiled by WebPack for Angular 2, you quietly get overWRITTEN instead of overLOADED methods.

<pre><code>myComponent {
 method(): { console.info("no args"); },
 method(arg): { console.info("with arg"); }
}
</code></pre>

Calling:

<pre><code>myComponent.method()
</code></pre>

seems to execute the method with arguments, silently ignoring the no-arg version, with output:

<pre><code>with arg
</code></pre>

Section 6.3 of the TypeScript language spec talks about function overloading and gives concrete examples on how to implement this. However if I try something like this:

<pre><code>export class LayerFactory { 

 constructor (public styleFactory: Symbology.StyleFactory) { }

 createFeatureLayer (userContext : Model.UserContext, mapWrapperObj : MapWrapperBase) : any { 
 throw "not implemented";
 } 

 createFeatureLayer(layerName : string, style : any) : any {
 throw "not implemented";
 } 

}
</code></pre>

I get a compiler error indicating duplicate identifier even though function parameters are of different types. Even if I add an additional parameter to the second createFeatureLayer function, I still get a compiler error. Ideas, please.

TypeScript function overloading

TypeScript

编译器

TypeScript语言规范的第6.3节讨论了函数重载，并给出了如何实现函数重载的具体示例。但是，如果我尝试这样的操作：export class LayerFactory {     constructor (public styleFactory: Symbology.StyleFactory) { }    cre...

问TypeScript函数重载
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问TypeScript函数重载EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问TypeScript函数重载
EN