Docs / Language Manual / Overview

You are currently looking at the < v8.2.0 docs (Reason v3.6 syntax edition). You can find the latest manual page here.

(These docs cover all versions between v3 to v8 and are equivalent to the old BuckleScript docs before the rebrand)

Overview

Comparison to JS

Note: the comparison is against our Reason syntax, not our ML syntax.

Semicolon

JavaScriptUs
Rules encorced by linter/formatterNo semicolon needed!

Comments

JavaScriptUs
/* Comment */Same
// Line commentSame

Variable

JavaScriptUs
const x = 5;let x = 5
var x = y;No equivalent (thankfully)
let x = 5; x = x + 1;let x = ref(5); x := x.contents + 1

String & Character

JavaScriptUs
"Hello world!"Same
'Hello world!'Strings must use "
"hello " + "world""hello " ++ "world"
`hello ${message}`{j|Hello $(message)|j}

Boolean

JavaScriptUs
true, falseSame
!trueSame
||, &&, <=, >=, <, >Same
a === b, a !== bSame
No deep equality (recursive compare)a == b, a != b
a == bNo equality with implicit casting (thankfully)

Number

JavaScriptUs
3Same *
3.1415Same
3 + 4Same
3.0 + 4.53.0 +. 4.5
5 % 35 mod 3

* JS has no distinction between integer and float.

Object/Record

JavaScriptUs
no typestype point = {x: int, mutable y: int}
{x: 30, y: 20}Same
point.xSame
point.y = 30;Same
{...point, x: 30}Same

Array

JavaScriptUs
[1, 2, 3]`[
myArray[1] = 10Same
[1, "Bob", true](1, "Bob", true) *

* Heterogenous arrays in JS are disallowed for us. Use tuple instead.

Null

JavaScriptUs
null, undefinedNone *

* Again, only a spiritual equivalent; we don't have nulls, nor null bugs! But we do have an option type for when you actually need nullability.

Function

JavaScriptUs
arg => retValSame
function named(arg) {...}let named = (arg) => {...}
const f = function(arg) {...}let f = (arg) => {...}
add(4, add(5, 6))Same

Blocks

JavaScriptUs
const myFun = (x, y) => { const doubleX = x + x; const doubleY = y + y; return doubleX + doubleY };
let myFun = (x, y) => { let doubleX = x + x let doubleY = y + y doubleX + doubleY }

If-else

JavaScriptUs
if (a) {b} else {c}if (a) {b} else {c} *
a ? b : cSame
switchswitch but super-powered pattern matching!

* Our conditionals are always expressions! You can write let result = if (a) {"hello"} else {"bye"}

Destructuring

JavaScriptUs
const {a, b} = datalet {a, b} = data
const [a, b] = datalet [|a, b|] = data *
const {a: aa, b: bb} = datalet {a: aa, b: bb} = data

* Gives good compiler warning that data might not be of length 2.

Loop

JavaScriptUs
for (let i = 0; i <= 10; i++) {...}for (i in 0 to 10) {...}
for (let i = 10; i >= 0; i--) {...}for (i in 10 downto 0) {...}
while (true) {...}while (true) {...}

JSX

JavaScriptUs
<Comp message="hi" onClick={handler} />Same
<Comp message=message /><Comp message /> *
<input checked /><input checked=true />
No children spread<Comp>...children</Comp>

* Argument punning!

Exception

JavaScriptUs
throw new SomeError(...)raise(SomeError(...))
try {a} catch (Err) {...} finally {...}try a catch { | Err => ...} *

* No finally.

Blocks

The last expression of a block delimited by {} implicitly returns (including function body). In JavaScript, this can only be simulated via an immediately-invoked function expression (since function bodies have their own local scope).

JavaScriptUs
let result = (function() { const x = 23; const y = 34; return x + y; })();
let result = { let x = 23 let y = 34 x + y }

Common Features' JS Output

FeatureExampleJavaScript Output
String"Hello""Hello"
String Interpolation{j|Hello $(message)|j}"Hello " + message
Character (disrecommended)'x'120 (char code)
Integer23, -2323, -23
Float23.0, -23.023.0, -23.0
Integer Addition23 + 123 + 1
Float Addition23.0 +. 1.023.0 + 1.0
Integer Division/Multiplication2 / 23 * 12 / 23 * 1
Float Division/Multiplication2.0 /. 23.0 *. 1.02.0 / 23.0 * 1.0
Float Exponentiation2.0 ** 3.0Math.pow(3, 4)
String Concatenation"Hello " ++ "World""Hello " + "World"
Comparison>, <, >=, <=>, <, >=, <=
Boolean operation!, &&, ||!, &&, ||
Shallow and deep Equality===, =====, ==
List (disrecommended)[1, 2, 3]{hd: 1, tl: {hd: 2, tl: {hd: 3, tl: 0}}}
List Prepend[a1, a2, ...oldList]{hd: a1, tl: {hd: a2, tl: theRest}}
Array[|1, 2, 3|][1, 2, 3]
Recordtype t = {b: int}; let a = {b: 10}var a = {b: 10}
Multiline Comment/* Comment here */Not in output
Single line Comment// Comment hereNot in output