有没有办法在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
其他回答
是的,在TypeScript中这有点棘手,但你可以像这样做下面的例子
let decodeData = JSON.parse(' ${jsonResponse} ');
类型安全JSON.parse
您可以继续使用JSON。解析,因为TypeScript是JavaScript的超集:
这意味着你可以把任何可用的JavaScript代码放到TypeScript文件中,而不用担心它到底是如何编写的。
还有一个问题:JSON。Parse返回any,这会破坏类型安全(不要使用any)。
以下是针对较强类型的三种解决方案,按复杂度升序排列:
1. 用户定义类型保护
操场上
// For example, you expect to parse a given value with `MyType` shape
type MyType = { name: string; description: string; }
// Validate this value with a custom type guard (extend to your needs)
function isMyType(o: any): o is MyType {
return "name" in o && "description" in o
}
const json = '{ "name": "Foo", "description": "Bar" }';
const parsed = JSON.parse(json);
if (isMyType(parsed)) {
// do something with now correctly typed object
parsed.description
} else {
// error handling; invalid JSON format
}
isMyType被称为类型保护。它的优点是,您可以在true if分支中获得一个完全类型的对象。
2. 通用的JSON。解析包装
操场上
围绕JSON创建一个通用包装器。Parse,它接受一个类型保护作为输入,并返回已解析、类型化的值或错误结果:
const safeJsonParse = <T>(guard: (o: any) => o is T) =>
(text: string): ParseResult<T> => {
const parsed = JSON.parse(text)
return guard(parsed) ? { parsed, hasError: false } : { hasError: true }
}
type ParseResult<T> =
| { parsed: T; hasError: false; error?: undefined }
| { parsed?: undefined; hasError: true; error?: unknown }
使用的例子:
const json = '{ "name": "Foo", "description": "Bar" }';
const result = safeJsonParse(isMyType)(json) // result: ParseResult<MyType>
if (result.hasError) {
console.log("error :/") // further error handling here
} else {
console.log(result.parsed.description) // result.parsed now has type `MyType`
}
safeJsonParse可以扩展为快速失败或尝试/捕获JSON。解析错误。
3.外部库
如果需要验证许多不同的值,那么手动编写类型保护函数会变得很麻烦。有一些库可以帮助完成这个任务——示例(没有全面的列表):
Io-ts:具有fp-ts对等依赖,使用函数式编程风格 Zod:力求比io-ts更加面向过程/面向对象 typescript-is:编译器API的TS转换器,需要额外的包装器,如ttypescript typescript-json-schema/ajv:根据类型创建JSON模式,并用ajv进行验证
更多的信息
运行时类型检查#1573 使用Typescript检查接口类型 TypeScript:验证外部数据
在我看来,对于包含在关联数组| 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))
}
...
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);
(操场上的代码)
你还可以使用一些库来执行json的类型验证,比如Sparkson。它们允许你定义一个TypeScript类,你想解析你的响应,在你的情况下,它可以是:
import { Field } from "sparkson";
class Response {
constructor(
@Field("name") public name: string,
@Field("error") public error: boolean
) {}
}
该库将验证所需字段是否出现在JSON有效负载中,以及它们的类型是否正确。它还可以执行一系列验证和转换。