Playground
Want the full experience? Try the Full-Page Visual Debugger with examples, resizable panels, and step-through debugging.
Try JSONLogic expressions right in your browser! This playground uses the visual debugger component powered by WebAssembly.
How to Use
- Logic: Enter your JSONLogic expression in the Logic panel
- Data: Enter the JSON data to evaluate against in the Data panel
- View/Debug: Switch between visualization and step-through debug modes
- Examples: Use the dropdown to load pre-built examples
Quick Reference
Basic Operators
| Operator | Example | Description |
|---|---|---|
var | {"var": "x"} | Access variable |
== | {"==": [1, 1]} | Equality |
>, <, >=, <= | {">": [5, 3]} | Comparison |
and, or | {"and": [true, true]} | Logical |
if | {"if": [cond, then, else]} | Conditional |
+, -, *, / | {"+": [1, 2]} | Arithmetic |
Array Operations
| Operator | Example | Description |
|---|---|---|
map | {"map": [arr, expr]} | Transform elements |
filter | {"filter": [arr, cond]} | Filter elements |
reduce | {"reduce": [arr, expr, init]} | Reduce to value |
all, some, none | {"all": [arr, cond]} | Check conditions |
String Operations
| Operator | Example | Description |
|---|---|---|
cat | {"cat": ["a", "b"]} | Concatenate |
substr | {"substr": ["hello", 0, 2]} | Substring |
in | {"in": ["@", "a@b.com"]} | Contains |
Example: Feature Flag
Determine if a user has access to a premium feature:
{
"and": [
{"==": [{"var": "user.plan"}, "premium"]},
{">=": [{"var": "user.accountAge"}, 30]}
]
}
Data:
{
"user": {
"plan": "premium",
"accountAge": 45
}
}
Example: Dynamic Pricing
Calculate a discounted price based on quantity:
{
"if": [
{">=": [{"var": "quantity"}, 100]},
{"*": [{"var": "price"}, 0.8]},
{"if": [
{">=": [{"var": "quantity"}, 50]},
{"*": [{"var": "price"}, 0.9]},
{"var": "price"}
]}
]
}
Data:
{
"quantity": 75,
"price": 100
}
Learn More
- Operators Overview - Full operator documentation
- Getting Started - Using the library
- Use Cases - Real-world examples