Docs / Language Manual / InteropCheatsheet

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

Interop Cheatsheet

Raw JS

Reason (Old Syntax)ML (Older Syntax)JS Output
 
let add = [%raw "(a, b) => a + b"];
[%%raw "const a = 1"];

Global Value

Reason (Old Syntax)ML (Older Syntax)JS Output
 
[@bs.val] external setTimeout: (unit => unit, int) => float = "setTimeout";

Global Module's Value

Reason (Old Syntax)ML (Older Syntax)JS Output
 
[@bs.val] [@bs.scope "Math"]
external random: unit => float = "random";

let someNumber = random();

[@bs.val] [@bs.scope ("window", "location", "ancestorOrigins")]
external length: int = "length";

Nullable

Reason (Old Syntax)ML (Older Syntax)JS Output
 
let a = Some(5); // compiles to 5
let b = None; // compiles to undefined

Handling a value that can be undefined and null, by ditching the option type and using Js.Nullable.t:

Reason (Old Syntax)ML (Older Syntax)JS Output
 
let jsNull = Js.Nullable.null;
let jsUndefined = Js.Nullable.undefined;
let result1: Js.Nullable.t(string) = Js.Nullable.return("hello");
let result2: Js.Nullable.t(int) = Js.Nullable.fromOption(Some(10));
let result3: option(int) = Js.Nullable.toOption(Js.Nullable.return(10));

JS Object

Function

Object Method & Chaining

Reason (Old Syntax)ML (Older Syntax)JS Output
 
[@bs.send] external map: (array('a), 'a => 'b) => array('b) = "map";
[@bs.send] external filter: (array('a), 'a => 'b) => array('b) = "filter";
[|1, 2, 3|]
  ->map(a => a + 1)
  ->filter(a => a mod 2 == 0)
  ->Js.log;

Variadic Arguments

Reason (Old Syntax)ML (Older Syntax)JS Output
 
[@bs.module "path"] [@bs.variadic]
external join: array(string) => string = "join";

Polymorphic Function

Reason (Old Syntax)ML (Older Syntax)JS Output
 
[@bs.module "Drawing"] external drawCat: unit => unit = "draw";
[@bs.module "Drawing"] external drawDog: (~giveName: string) => unit = "draw";
Reason (Old Syntax)ML (Older Syntax)JS Output
 
[@bs.val]
external padLeft: (
  string,
  [@bs.unwrap] [
    | `Str(string)
    | `Int(int)
  ])
  => string = "padLeft";

padLeft("Hello World", `Int(4));
padLeft("Hello World", `Str("Message from ReScript: "));

JS Module Interop

See here

Dangerous Type Cast

Final escape hatch converter. Do not abuse.

Reason (Old Syntax)ML (Older Syntax)JS Output
 
external convertToFloat: int => float = "%identity";
let age = 10;
let gpa = 2.1 +. convertToFloat(age);

List of @bs Decorators

  • @bs.as

  • @bs.get

  • @bs.inline

  • @bs.int

  • @bs.meth

  • @bs.new

  • @bs.return

  • @bs.scope

  • @bs.send

  • @bs.set

  • @bs.string

  • @bs.this

  • @bs.uncurry

  • @bs.unwrap

  • @bs.val

  • @bs.variadic