在 TypeScript 1.0 中向 Array 添加方法 [英] Add method to Array in TypeScript 1.0
问题描述
我正在尝试为 ASP.NET Ajax 库创建 TypeScript 1.0.2 (VS 2013 Update 2 RTM) 定义文件,但我对如何定义 MS Ajax 添加的其他方法感到困惑基本 JS 类型,例如 Array.我创建了一个 AspNetAjax.d.ts 和一个 AspNetAjax-tests.ts 文件.当我尝试在测试文件中使用add"方法时,我收到下面列出的编译器错误.
I'm trying to create a TypeScript 1.0.2 (VS 2013 Update 2 RTM) definition file for the ASP.NET Ajax library, and I'm getting hung up on how to define the additional methods that MS Ajax adds to base JS types such as Array. I created a AspNetAjax.d.ts and a AspNetAjax-tests.ts file. When I attempt to use the "add" method in the test file, I get the compiler error that is listed below.
AspNetAjax.d.ts
interface Array<T> {
add(array: T[], item: T): void;
}
AspNetAjax-tests.ts
///<reference path="AspNetAjax.d.ts" />
var a: string[] = ['a', 'b', 'c', 'd'];
Array.add(a, 'e');
console.log(a.toString());
错误 1 属性 'add' 不存在于类型 '{ isArray(arg: any): boolean;原型:任何[];(arrayLength?: number): any[];(arrayLength: number): T[];(...项目: T[]): T[];new(arrayLength?: number): any[];new(arrayLength: number): T[];new(...items: T[]): T[];}'.c:\path\AspNetAjax-tests.ts 4 7 TypeScriptHTMLApp1
Error 1 The property 'add' does not exist on value of type '{ isArray(arg: any): boolean; prototype: any[]; (arrayLength?: number): any[]; (arrayLength: number): T[]; (...items: T[]): T[]; new(arrayLength?: number): any[]; new(arrayLength: number): T[]; new(...items: T[]): T[]; }'. c:\path\AspNetAjax-tests.ts 4 7 TypeScriptHTMLApp1
来自同一个 d.ts 文件的其他定义在测试文件中起作用,所以我知道引用在物理上起作用.TypeScript 也没有抱怨我声明 d.ts 文件的方式(那里没有红色波浪线).
Other definitions from the same d.ts file are working in the tests file so I know that the reference is physically working. TypeScript also doesn't complain about the way I've declared the d.ts file (no red squiggles there).
我知道这些其他问题,我以为我正在按照他们的建议做,但它们似乎是从 2012 年末/2013 年初开始的,所以也许从那时起这样做的方式发生了变化?
I am aware of these other questions and I thought I was doing what they suggested, but it seems they're from late 2012/early 2013 so perhaps the way to do this has changed since then?
我需要对 d.ts 进行编码,以便 .ts 文件中的代码能够工作.有什么想法吗?
I need to code the d.ts so that the code in the .ts file will work. Any ideas?
推荐答案
在@basarat 和@Ryan-Cavanaugh 的回答之间,我想出了一个适用于 TypeScript 1.0 的对用户来说最小的解决方案,只要你愿意接受修改内置 JS 对象通常是个坏主意,所以如果在 TypeScript 中支持它有点尴尬,那就可以了.
Between @basarat and @Ryan-Cavanaugh's answers I was able to come up with a minimally-horrible-to-the-user solution that works with TypeScript 1.0, as long as one is willing to accept that modifying the built-in JS objects is generally bad idea so it's OK if supporting that in TypeScript is slightly awkward.
假设我在内置 JS Array 对象上定义了 ASP.NET AJAX 扩展:
Assuming that I am defining the ASP.NET AJAX extensions on the built-in JS Array object:
- 我将在 d.ts 文件中声明一个名为
AspNetAjaxExtensions
的模块 - 我将在名为
JavaScriptArray
的模块声明中创建一个非导出接口 - 我将在名为
Array
的模块声明中创建一个导出接口,该接口extends JavaScriptArray
- 我会将
Array
和Array
的所有定义从 TypeScript 附带的 lib.d.ts 复制到新的JavaScriptArray<;T>
界面. - 然后,我可以继续对新的
Array
接口内的扩展功能进行建模.
- I will declare a module in the d.ts file called
AspNetAjaxExtensions
- I will create a non-exported interface inside that module declaration called
JavaScriptArray<T>
- I will create an exported interface inside that module declaration called
Array<T>
thatextends JavaScriptArray<T>
- I will copy all of the definitions for
Array
andArray<T>
from the lib.d.ts that ships with TypeScript into the newJavaScriptArray<T>
interface. - I can then proceed to model out only the extended functionality inside the new
Array<T>
interface.
这对 d.ts 作者来说有点反 DRY,但实际上这些东西很少改变,并且从 lib.d.ts 复制的 JavaScriptArray
中的东西是 self- 包含.从技术上讲,甚至可以创建一个构建步骤来动态填充此界面.
This is somewhat anti-DRY for the d.ts author, but in reality these things very infrequently change and the stuff in JavaScriptArray<T>
that was copied from lib.d.ts is self-contained. Technically, a build step could even be created to dynamically fill-in this interface.
对于用户来说,他们必须改变他们的代码来调用扩展的 Array
对象:
For the user, they have to change their code that calls the extended Array
object from this:
//will be an error in TypeScript 1.0
Array.add(x, 'thing');
为此:
//This works in TypeScript 1.0 after importing the above-described d.ts file.
(<AspNetAjaxExtensions.Array<string>>Array).add(x, 'thing');
甚至可以用 (<AspNetAjaxExtensions.Array<any>>Array).add(
.
他们只需要在调用内置 Array 对象上的任何扩展方法时执行此操作(这将被 TypeScript 语法错误调用).对普通 Array 方法的调用仍将使用 lib.d.ts 中的普通"定义.
They only need to do this whenever any of the extended methods on the built-in Array object are called (which will be called out by TypeScript syntax errors). Calls to normal Array methods will still use the "normal" definition in lib.d.ts.
新的 AspNetAjax.d.ts 文件示例:
Example new AspNetAjax.d.ts file:
declare module AspNetAjaxExtensions {
/** This interface definition was copied from lib.d.ts */
interface JavaScriptArray<T> {
new (arrayLength?: number): any[];
new <T>(arrayLength: number): T[];
/* -- Snip out many copied and pasted lines of code from lib.d.ts -- */
}
/** JavaScript Array object as extended by ASP.NET Ajax */
export interface Array<T> extends JavaScriptArray<T> {
/** Adds an element to the end of an Array object. This function is static and is invoked without creating an instance of the object.
http://msdn.microsoft.com/en-us/library/bb310854(v=vs.100).aspx
@param array The array to add the item to.
@param item The object to add to the array.
*/
add(array: T[], item: T): void;
/* -- etc... defining remaining extended methods -- */
}
}
这篇关于在 TypeScript 1.0 中向 Array 添加方法的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!