FrW*_*FrW 25 javascript function undefined typescript
我遇到以下代码的问题.
它基本上应该做什么.它应该加载和解析给定的JSON文件.在RequestListender中,它应该显示Product.ts中方法返回ID的字符串和字符串.在正确显示的地方,该方法失败并出现下述错误.HelloToString()tProduct.IdtProduct.ToString()
非常感谢提前.
错误信息:
TypeError: tProduct.ToString is not a function.
(In 'tProduct.ToString()', 'tProduct.ToString' is undefined)
Run Code Online (Sandbox Code Playgroud)
文件:Test.ts
var currentProduct = null as pvis.Product;
function runTest(path) {
var request = new XMLHttpRequest();
request.onload = loadRequestListener;
request.open("get", path, true);
request.send();
}
function loadRequestListener () {
var tProduct : pvis.Product = JSON.parse(this.responseText);
if (tProduct.Id) {
currentProduct = tProduct;
alert('loaded with Id: ' + tProduct.Id );
alert('loaded with Content: ' + tProduct.ToString() );
}
else {
alert('product failed to load');
}
}
Run Code Online (Sandbox Code Playgroud)
文件Product.ts
module pvis {
export class Product {
Id: string;
ToString():string {
return 'Hello';
}
}
}
Run Code Online (Sandbox Code Playgroud)
HTML部分:
<body onload="runTest('assets/products/json/A379N.json')">
Run Code Online (Sandbox Code Playgroud)
编译好的Javascript:
var pvis;
(function (pvis) {
var Product = (function () {
function Product() {
}
Product.prototype.ToString = function () {
return 'Hello';
};
return Product;
})();
pvis.Product = Product;
})(pvis || (pvis = {}));
var currentProduct = null;
function runTest(path) {
var request = new XMLHttpRequest();
request.onload = loadRequestListener;
request.open("get", path, true);
request.send();
}
function loadRequestListener() {
var tProduct = JSON.parse(this.responseText);
if (tProduct.Id) {
currentProduct = tProduct;
alert('loaded with Id: ' + tProduct.Id);
alert('loaded with Content: ' + tProduct.ToString());
}
else {
alert('product failed to load');
}
}
Run Code Online (Sandbox Code Playgroud)
tsconfig.json(我不确定它是否相关):
{
"compilerOptions": {
"target": "ES5",
"removeComments": true,
"preserveConstEnums": true,
"out": "js/main.js",
"sourceMap": true
},
"files": [
"src/Test.ts"
]
}
Run Code Online (Sandbox Code Playgroud)
Nyp*_*pan 19
这条线:
var tProduct : pvis.Product = JSON.parse(this.responseText);
Run Code Online (Sandbox Code Playgroud)
是错的.它编译的原因仅仅是JSON.parse归还any.
使用Product你必须以某种方式创建它的实例的类.JSON解析不会这样做,它只会返回一个带有解析后的JSON的对象,它不会是pvis.Product该类的实例.
如果您要执行的操作是键入JSON结果,则可以使用界面执行此操作.例如,如果表单上有JSON对象:
{
id: "some value",
name: "some name",
count: 4
}
Run Code Online (Sandbox Code Playgroud)
您可以使用界面键入:
interface myInterface {
id: string;
name: string;
count: number;
}
Run Code Online (Sandbox Code Playgroud)
并像这样使用它:
var myParsedAndTypedJson: myInterface = JSON.parse("....");
Run Code Online (Sandbox Code Playgroud)
像这样创建的对象永远不会有方法,但是如果你想要这个功能,你必须将这些信息传递给一个可以使用它的类,例如;
class myClass implements myInterface {
get id(): string { return this.initData.id; }
get name(): string { return this.initData.name; }
get count(): number { return this.initData.count; }
constructor(private initData: myInterface) {
}
public ToString() {
return this.id + ' ' + this.name + ' ' + this.count;
}
}
Run Code Online (Sandbox Code Playgroud)
这方面的工作示例可以在这里找到.
您可能希望查找如何使用typescript接口和JSON来更多地了解其工作原理.
我有这个错误,这是由于我的文件中的循环依赖。
文件A.ts
import { foo } from "./fileB"
export function bar() { ... }
foo();
Run Code Online (Sandbox Code Playgroud)
文件B.ts
import { bar } from "./fileA"
export function foo() { ... }
bar();
Run Code Online (Sandbox Code Playgroud)
这产生:
TypeError: fileA_1.foo is not a function
| 归档时间: |
|
| 查看次数: |
34450 次 |
| 最近记录: |