Why are those web services sending "Number" with double-quotes in JSON? Castable library can handle them.

Project Rinjani — Thu, 21 Dec 2017 10:23:25 +0000

Castable TypeScript Library

Castable sanitizes dirty external data by casting all properties at runtime to the types specified at compile time.

Why do you need this library?

A lot of web services return number type fields with double-quotes in JSON. If you convert them by JSON.stringify, the double-quoted numbers will become string type!!

const serverResponse = `{
　　"name": "Milk", 
　　"price": "200", 
　　"tax": "10", 
}`;
const product = JSON.parse(serverResponse);
const sum = product.price + product.tax;
console.log(`sum: ${sum}`); // "200" + "10" = "20010"⛔️

TypeScript type annotation can help it? No, TypeScript cannot check such runtime type mismatch. You will get the same result even type annotation is perfect.

That's why I've made this library. Castable can convert those types at runtime. All fields will be converted to the annotated types.

import { cast, Castable } from 'castable';

class Product extends Castable { 
  @cast name: string;
  @cast price: number;
  @cast tax: number;
}

const serverResponse = `{"name": "Milk", "price": "200", "tax": "10"}`;
const product = new Product(JSON.parse(serverResponse));
const sum = product.price + product.tax;
console.log(`sum: ${sum}`); // 200 + 10 = 210👍

Castable internally applies Number("200") for price field and Number("10") for tax field in order to cast them to the correct type, recognizing those are actually number type, not string.

Supported types:

number: "100" will be converted to real number 100.
boolean: string "true", "false" in JSON will be real boolean true, false.
Date: Any string representation supported by Date constructor, like "Thu Dec 21 2017 18:38:58 GMT+0900 (Tokyo Standard Time)"
Nested type
Array
Multi-dementional Array

Install

npm install @bitr/castable

Usage

Extend Castable
Add @cast decorator to primitive type field (string, number, boolean)
Add @cast(Date) decorator to Date type field
Add @cast @element(T) to Array type field
Add @cast decorator to nested type
Do same to all nested types

Example