TypeScript: how to JSON stringify a class definition?
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
Say we have:
class MyClass {
myProperty: string
}
Is there any built in function or easy way to get JSON like this?:
{
"myProperty": "string"
}
EDIT: My end goal is I want to dynamically print typed class definitions to a web view, in some kind of structured object syntax like JSON. I'm trying to make a server API that will return the schema for various custom classes - for example http://myserver.com/MyClass should return MyClass's properties and their types as a JSON string or other structured representation.
json typescript
asked Nov 17 '18 at 2:59
Ray ZhangRay Zhang
339514
add a comment |
Say we have:
class MyClass {
myProperty: string
}
Is there any built in function or easy way to get JSON like this?:
{
"myProperty": "string"
}
EDIT: My end goal is I want to dynamically print typed class definitions to a web view, in some kind of structured object syntax like JSON. I'm trying to make a server API that will return the schema for various custom classes - for example http://myserver.com/MyClass should return MyClass's properties and their types as a JSON string or other structured representation.
json typescript
asked Nov 17 '18 at 2:59
Ray ZhangRay Zhang
339514
add a comment |
Say we have:
class MyClass {
myProperty: string
}
Is there any built in function or easy way to get JSON like this?:
{
"myProperty": "string"
}
EDIT: My end goal is I want to dynamically print typed class definitions to a web view, in some kind of structured object syntax like JSON. I'm trying to make a server API that will return the schema for various custom classes - for example http://myserver.com/MyClass should return MyClass's properties and their types as a JSON string or other structured representation.
json typescript
asked Nov 17 '18 at 2:59
Ray ZhangRay Zhang
339514
Say we have:
class MyClass {
myProperty: string
}
Is there any built in function or easy way to get JSON like this?:
{
"myProperty": "string"
}
EDIT: My end goal is I want to dynamically print typed class definitions to a web view, in some kind of structured object syntax like JSON. I'm trying to make a server API that will return the schema for various custom classes - for example http://myserver.com/MyClass should return MyClass's properties and their types as a JSON string or other structured representation.
json typescript
json typescript
asked Nov 17 '18 at 2:59
Ray ZhangRay Zhang
339514
asked Nov 17 '18 at 2:59
Ray ZhangRay Zhang
339514
edited Nov 17 '18 at 3:55
Ray Zhang
asked Nov 17 '18 at 2:59
Ray ZhangRay Zhang
339514
asked Nov 17 '18 at 2:59
Ray ZhangRay Zhang
339514
asked Nov 17 '18 at 2:59
Ray ZhangRay Zhang
339514
339514
add a comment |
add a comment |
2 Answers
2
active
oldest
votes
Typescript class properties exist at build-time only. They are removed from your source after compiling to .js. As such, there is no run-time way to get to the class properties.
Your code snippet compiles to:
var MyClass = /** @class */ (function () {
function MyClass() {
}
return MyClass;
}());
As you can see, the property disappeared.
Based on your update, I had this exact problem. This is how I solved it.
- My JSON-based API uses json-schema across the board for type validation, and also exposes these schemas for clients to re-use.
- I used an npm package to automatically convert json-schema to Typescript.
This works brilliantly.
answered Nov 17 '18 at 3:14
EvertEvert
42.6k1572127
Is there a trick or workaround?
– Ray Zhang
Nov 17 '18 at 3:26
1
In you situation I would figure out why you need it, and based on that see if there's a more elegant solution. It's hard to tell from your question what your end-goal is.
– Evert
Nov 17 '18 at 3:39
You're right, thanks. I've updated the question.
– Ray Zhang
Nov 17 '18 at 3:57
@RayZhang left some updates to my answer.
– Evert
Nov 17 '18 at 7:07
add a comment |
Evert is correct, however a workaround can look like this
class MyClass {
myProperty: string = 'string'
}
JSON.stringify(new MyClass) // shows what you want
In other words, setting a default property value lets TS compile properties to JS
If the above solution is not acceptable, then I would suggest you parsing TS files with your classes with https://dsherret.github.io/ts-simple-ast/.
answered Nov 17 '18 at 3:56
Nurbol AlpysbayevNurbol Alpysbayev
4,9191634
1
This code returns {"myProperty":""} which is not what I want. What I want is {"myProperty":"string"}. Additionally, if myProperty was a number it should return {"myProperty":"number"} not {"myProperty":0} (for example).
– Ray Zhang
Nov 17 '18 at 4:06
Sorry, I missed that part. I've updated my answer and supplied a solution (not very straight-forward one, but not too hard)
– Nurbol Alpysbayev
Nov 17 '18 at 4:09
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53347802%2ftypescript-how-to-json-stringify-a-class-definition%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
Typescript class properties exist at build-time only. They are removed from your source after compiling to .js. As such, there is no run-time way to get to the class properties.
Your code snippet compiles to:
var MyClass = /** @class */ (function () {
function MyClass() {
}
return MyClass;
}());
As you can see, the property disappeared.
Based on your update, I had this exact problem. This is how I solved it.
- My JSON-based API uses json-schema across the board for type validation, and also exposes these schemas for clients to re-use.
- I used an npm package to automatically convert json-schema to Typescript.
This works brilliantly.
answered Nov 17 '18 at 3:14
EvertEvert
42.6k1572127
Is there a trick or workaround?
– Ray Zhang
Nov 17 '18 at 3:26
1
In you situation I would figure out why you need it, and based on that see if there's a more elegant solution. It's hard to tell from your question what your end-goal is.
– Evert
Nov 17 '18 at 3:39
You're right, thanks. I've updated the question.
– Ray Zhang
Nov 17 '18 at 3:57
@RayZhang left some updates to my answer.
– Evert
Nov 17 '18 at 7:07
add a comment |
Typescript class properties exist at build-time only. They are removed from your source after compiling to .js. As such, there is no run-time way to get to the class properties.
Your code snippet compiles to:
var MyClass = /** @class */ (function () {
function MyClass() {
}
return MyClass;
}());
As you can see, the property disappeared.
Based on your update, I had this exact problem. This is how I solved it.
- My JSON-based API uses json-schema across the board for type validation, and also exposes these schemas for clients to re-use.
- I used an npm package to automatically convert json-schema to Typescript.
This works brilliantly.
answered Nov 17 '18 at 3:14
EvertEvert
42.6k1572127
Is there a trick or workaround?
– Ray Zhang
Nov 17 '18 at 3:26
1
In you situation I would figure out why you need it, and based on that see if there's a more elegant solution. It's hard to tell from your question what your end-goal is.
– Evert
Nov 17 '18 at 3:39
You're right, thanks. I've updated the question.
– Ray Zhang
Nov 17 '18 at 3:57
@RayZhang left some updates to my answer.
– Evert
Nov 17 '18 at 7:07
add a comment |
Typescript class properties exist at build-time only. They are removed from your source after compiling to .js. As such, there is no run-time way to get to the class properties.
Your code snippet compiles to:
var MyClass = /** @class */ (function () {
function MyClass() {
}
return MyClass;
}());
As you can see, the property disappeared.
Based on your update, I had this exact problem. This is how I solved it.
- My JSON-based API uses json-schema across the board for type validation, and also exposes these schemas for clients to re-use.
- I used an npm package to automatically convert json-schema to Typescript.
This works brilliantly.
answered Nov 17 '18 at 3:14
EvertEvert
42.6k1572127
Typescript class properties exist at build-time only. They are removed from your source after compiling to .js. As such, there is no run-time way to get to the class properties.
Your code snippet compiles to:
var MyClass = /** @class */ (function () {
function MyClass() {
}
return MyClass;
}());
As you can see, the property disappeared.
Based on your update, I had this exact problem. This is how I solved it.
- My JSON-based API uses json-schema across the board for type validation, and also exposes these schemas for clients to re-use.
- I used an npm package to automatically convert json-schema to Typescript.
This works brilliantly.
answered Nov 17 '18 at 3:14
EvertEvert
42.6k1572127
edited Nov 17 '18 at 7:07
answered Nov 17 '18 at 3:14
EvertEvert
42.6k1572127
answered Nov 17 '18 at 3:14
EvertEvert
42.6k1572127
answered Nov 17 '18 at 3:14
EvertEvert
42.6k1572127
42.6k1572127
Is there a trick or workaround?
– Ray Zhang
Nov 17 '18 at 3:26
1
In you situation I would figure out why you need it, and based on that see if there's a more elegant solution. It's hard to tell from your question what your end-goal is.
– Evert
Nov 17 '18 at 3:39
You're right, thanks. I've updated the question.
– Ray Zhang
Nov 17 '18 at 3:57
@RayZhang left some updates to my answer.
– Evert
Nov 17 '18 at 7:07
add a comment |
Is there a trick or workaround?
– Ray Zhang
Nov 17 '18 at 3:26
1
In you situation I would figure out why you need it, and based on that see if there's a more elegant solution. It's hard to tell from your question what your end-goal is.
– Evert
Nov 17 '18 at 3:39
You're right, thanks. I've updated the question.
– Ray Zhang
Nov 17 '18 at 3:57
@RayZhang left some updates to my answer.
– Evert
Nov 17 '18 at 7:07
Is there a trick or workaround?
– Ray Zhang
Nov 17 '18 at 3:26
Is there a trick or workaround?
– Ray Zhang
Nov 17 '18 at 3:26
1
1
In you situation I would figure out why you need it, and based on that see if there's a more elegant solution. It's hard to tell from your question what your end-goal is.
– Evert
Nov 17 '18 at 3:39
In you situation I would figure out why you need it, and based on that see if there's a more elegant solution. It's hard to tell from your question what your end-goal is.
– Evert
Nov 17 '18 at 3:39
You're right, thanks. I've updated the question.
– Ray Zhang
Nov 17 '18 at 3:57
You're right, thanks. I've updated the question.
– Ray Zhang
Nov 17 '18 at 3:57
@RayZhang left some updates to my answer.
– Evert
Nov 17 '18 at 7:07
@RayZhang left some updates to my answer.
– Evert
Nov 17 '18 at 7:07
add a comment |
Evert is correct, however a workaround can look like this
class MyClass {
myProperty: string = 'string'
}
JSON.stringify(new MyClass) // shows what you want
In other words, setting a default property value lets TS compile properties to JS
If the above solution is not acceptable, then I would suggest you parsing TS files with your classes with https://dsherret.github.io/ts-simple-ast/.
answered Nov 17 '18 at 3:56
Nurbol AlpysbayevNurbol Alpysbayev
4,9191634
1
This code returns {"myProperty":""} which is not what I want. What I want is {"myProperty":"string"}. Additionally, if myProperty was a number it should return {"myProperty":"number"} not {"myProperty":0} (for example).
– Ray Zhang
Nov 17 '18 at 4:06
Sorry, I missed that part. I've updated my answer and supplied a solution (not very straight-forward one, but not too hard)
– Nurbol Alpysbayev
Nov 17 '18 at 4:09
add a comment |
Evert is correct, however a workaround can look like this
class MyClass {
myProperty: string = 'string'
}
JSON.stringify(new MyClass) // shows what you want
In other words, setting a default property value lets TS compile properties to JS
If the above solution is not acceptable, then I would suggest you parsing TS files with your classes with https://dsherret.github.io/ts-simple-ast/.
answered Nov 17 '18 at 3:56
Nurbol AlpysbayevNurbol Alpysbayev
4,9191634
1
This code returns {"myProperty":""} which is not what I want. What I want is {"myProperty":"string"}. Additionally, if myProperty was a number it should return {"myProperty":"number"} not {"myProperty":0} (for example).
– Ray Zhang
Nov 17 '18 at 4:06
Sorry, I missed that part. I've updated my answer and supplied a solution (not very straight-forward one, but not too hard)
– Nurbol Alpysbayev
Nov 17 '18 at 4:09
add a comment |
Evert is correct, however a workaround can look like this
class MyClass {
myProperty: string = 'string'
}
JSON.stringify(new MyClass) // shows what you want
In other words, setting a default property value lets TS compile properties to JS
If the above solution is not acceptable, then I would suggest you parsing TS files with your classes with https://dsherret.github.io/ts-simple-ast/.
answered Nov 17 '18 at 3:56
Nurbol AlpysbayevNurbol Alpysbayev
4,9191634
Evert is correct, however a workaround can look like this
class MyClass {
myProperty: string = 'string'
}
JSON.stringify(new MyClass) // shows what you want
In other words, setting a default property value lets TS compile properties to JS
If the above solution is not acceptable, then I would suggest you parsing TS files with your classes with https://dsherret.github.io/ts-simple-ast/.
answered Nov 17 '18 at 3:56
Nurbol AlpysbayevNurbol Alpysbayev
4,9191634
edited Nov 17 '18 at 4:09
answered Nov 17 '18 at 3:56
Nurbol AlpysbayevNurbol Alpysbayev
4,9191634
answered Nov 17 '18 at 3:56
Nurbol AlpysbayevNurbol Alpysbayev
4,9191634
answered Nov 17 '18 at 3:56
Nurbol AlpysbayevNurbol Alpysbayev
4,9191634
4,9191634
1
This code returns {"myProperty":""} which is not what I want. What I want is {"myProperty":"string"}. Additionally, if myProperty was a number it should return {"myProperty":"number"} not {"myProperty":0} (for example).
– Ray Zhang
Nov 17 '18 at 4:06
Sorry, I missed that part. I've updated my answer and supplied a solution (not very straight-forward one, but not too hard)
– Nurbol Alpysbayev
Nov 17 '18 at 4:09
add a comment |
1
This code returns {"myProperty":""} which is not what I want. What I want is {"myProperty":"string"}. Additionally, if myProperty was a number it should return {"myProperty":"number"} not {"myProperty":0} (for example).
– Ray Zhang
Nov 17 '18 at 4:06
Sorry, I missed that part. I've updated my answer and supplied a solution (not very straight-forward one, but not too hard)
– Nurbol Alpysbayev
Nov 17 '18 at 4:09
1
1
This code returns {"myProperty":""} which is not what I want. What I want is {"myProperty":"string"}. Additionally, if myProperty was a number it should return {"myProperty":"number"} not {"myProperty":0} (for example).
– Ray Zhang
Nov 17 '18 at 4:06
This code returns {"myProperty":""} which is not what I want. What I want is {"myProperty":"string"}. Additionally, if myProperty was a number it should return {"myProperty":"number"} not {"myProperty":0} (for example).
– Ray Zhang
Nov 17 '18 at 4:06
Sorry, I missed that part. I've updated my answer and supplied a solution (not very straight-forward one, but not too hard)
– Nurbol Alpysbayev
Nov 17 '18 at 4:09
Sorry, I missed that part. I've updated my answer and supplied a solution (not very straight-forward one, but not too hard)
– Nurbol Alpysbayev
Nov 17 '18 at 4:09
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53347802%2ftypescript-how-to-json-stringify-a-class-definition%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
