有没有办法在Typescript中将字符串解析为JSON ? 示例:在JS中,我们可以使用JSON.parse()。Typescript中有类似的函数吗?
我有一个JSON对象字符串如下:
{"name": "Bob", "error": false}
有没有办法在Typescript中将字符串解析为JSON ? 示例:在JS中,我们可以使用JSON.parse()。Typescript中有类似的函数吗?
我有一个JSON对象字符串如下:
{"name": "Bob", "error": false}
当前回答
有一个很棒的ts-json-object库
在你的情况下,你需要运行以下代码:
import {JSONObject, required} from 'ts-json-object'
class Response extends JSONObject {
@required
name: string;
@required
error: boolean;
}
let resp = new Response({"name": "Bob", "error": false});
这个库将在解析之前验证json
其他回答
嘿,如果你对json对象进行typeof,结果是typescript类型的字符串。你可以在这里阅读更多:Typescript:字符串和字符串的区别
所以试试这个方法,它会起作用的
JSON.parse(String({"name": "Bob", "error": false}))
Typescript是javascript的超集,所以你只需要使用JSON。像在javascript中那样解析:
let obj = JSON.parse(jsonString);
只有在typescript中,你才能有结果对象的类型:
interface MyObj {
myString: string;
myNumber: number;
}
let obj: MyObj = JSON.parse('{ "myString": "string", "myNumber": 4 }');
console.log(obj.myString);
console.log(obj.myNumber);
(操场上的代码)
在我看来,对于包含在关联数组| Map<string中的数据,任何>,有点放松(只有键检查),但在我看来最简单的方法(JsDoc版本)
(使用空py类实例进行类型引用和每个键匹配,如果解析或键匹配失败则返回'undefined')
types.js
export class FormCheckError {
constructor(
/** @type {string?}*/ message,
/** @type {string?}*/ oldValue
) {
this.oldValue = oldValue;
this.errorMessage = message;
}
}
json.js
/**
* @template T
* @param { Object<keyof T,any>[] } keys2Check
* @param { string } jsonString
* @returns { T | undefined }
*/
export function JsonCheckedParse(keys2Check = [],jsonString = '{}') {
try {
let result = JSON.parse(jsonString)
let resultKeys = Object.keys(result)
if (keys2Check.length !== resultKeys.length) {
return undefined;
}
keys2Check.forEach(function(key) {
if (resultKeys.indexOf(key) == -1) {
return undefined;
}
})
return result;
} catch(e) {
return undefined;
}
}
使用场景:
1.编码:
ssr-side.js
import { FormCheckError } from 'types'
...
if (oldValue.length == 0) {
return {
body: JSON.stringify(
new FormCheckError(
"You shouldn't post empty entries.",
oldValue
)
)
}
}
...
2.解码:
browser-side.js
import { FormCheckError } from 'types'
import { JsonCheckedParse } from 'json'
...
/** @type {import('./$types').ActionData} */ // Sveltekit stuff
export let form; // response received from 'ssr-side.js'
// will be undefined in case of type mismatch beetween encoded & decoded
/** @type {FormCheckError | undefined}*/
let checkError = JsonCheckedParse(
Object.keys(new FormCheckError()), // an empty class instance for knowing its keys
form?.body || '{}' // the JSON to parse and check for type
)
...
if (checkError?.errorMessage) {
console.log(String(checkError.errorMessage))
}
...
TS有JavaScript运行时
Typescript有JavaScript运行时,因为它被编译成JS。这意味着作为语言一部分内置的JS对象,如JSON、Object和Math,也可以在TS中使用。因此,我们可以只使用JSON。parse方法来解析JSON字符串。
例子:
const JSONStr = '{"name": "Bob", "error": false}'
// The JSON object is part of the runtime
const parsedObj = JSON.parse(JSONStr);
console.log(parsedObj);
// [LOG]: {
// "name": "Bob",
// "error": false
// }
// The Object object is also part of the runtime so we can use it in TS
const objKeys = Object.keys(parsedObj);
console.log(objKeys);
// [LOG]: ["name", "error"]
现在唯一的问题是parsedObj是any类型,这在TS中通常是一个不好的做法。如果我们使用类型守卫,我们可以类型对象。这里有一个例子:
const JSONStr = '{"name": "Bob", "error": false}'
const parsedObj = JSON.parse(JSONStr);
interface nameErr {
name: string;
error: boolean;
}
function isNameErr(arg: any): arg is nameErr {
if (typeof arg.name === 'string' && typeof arg.error === 'boolean') {
return true;
} else {
return false;
}
}
if (isNameErr(parsedObj)) {
// Within this if statement parsedObj is type nameErr;
parsedObj
}
JSON。parse在TypeScript中是可用的,所以你可以直接使用它:
JSON.parse('{"name": "Bob", "error": false}') // Returns a value of type 'any'
但是,您经常希望在解析JSON对象时确保它匹配某个类型,而不是处理any类型的值。在这种情况下,您可以定义如下函数:
function parse_json<TargetType extends Object>(
json: string,
type_definitions: { [Key in keyof TargetType]: (raw_value: any) => TargetType[Key] }
): TargetType {
const raw = JSON.parse(json);
const result: any = {};
for (const key in type_definitions) result[key] = type_definitions[key](raw[key]);
return result;
}
这个函数接受一个JSON字符串和一个包含加载所创建对象的每个字段的单独函数的对象。你可以这样使用它:
const value = parse_json(
'{"name": "Bob", "error": false}',
{ name: String, error: Boolean, }
);