text: (self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[7631],{17375:function(e,t,a){"use strict";function n(e,t){if(null==e)return{};var a,n,l=function(e,t){if(null==e)return{};var a,n,l={},r=Object.keys(e);for(n=0;n<r.length;n++)a=r[n],t.indexOf(a)>=0||(l[a]=e[a]);return l}(e,t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);for(n=0;n<r.length;n++)a=r[n],t.indexOf(a)>=0||Object.prototype.propertyIsEnumerable.call(e,a)&&(l[a]=e[a])}return l}a.d(t,{Z:function(){return n}})},18647:function(e,t,a){"use strict";a.r(t),a.d(t,{default:function(){return o}});var n=a(96156),l=a(17375),r=(a(67294),a(3905));function s(e,t){var a=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),a.push.apply(a,n)}return a}function i(e){for(var t=1;t<arguments.length;t++){var a=null!=arguments[t]?arguments[t]:{};t%2?s(Object(a),!0).forEach((function(t){(0,n.Z)(e,t,a[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(a)):s(Object(a)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(a,t))}))}return e}var p={};function o(e){var t=e.components,a=(0,l.Z)(e,["components"]);return(0,r.kt)("wrapper",i(i(i({},p),a),{},{components:t,mdxType:"MDXLayout"}),(0,r.kt)("h1",i({},{id:"js"}),"Js"),(0,r.kt)("p",null,"The Js module mostly contains ReScript bindings to ",(0,r.kt)("em",{parentName:"p"},"standard JavaScript APIs"),"\nlike ",(0,r.kt)("a",i({parentName:"p"},{href:"https://developer.mozilla.org/en-US/docs/Web/API/Console/log"}),"console.log"),",\nor the JavaScript\n",(0,r.kt)("a",i({parentName:"p"},{href:"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String"}),"String"),",\n",(0,r.kt)("a",i({parentName:"p"},{href:"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date"}),"Date"),", and\n",(0,r.kt)("a",i({parentName:"p"},{href:"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise"}),"Promise"),"\nclasses."),(0,r.kt)("p",null,"It is meant as a zero-abstraction interop layer and directly exposes JavaScript functions as they are. If you can find your API in this module, prefer this over an equivalent Belt helper. For example, prefer ",(0,r.kt)("a",i({parentName:"p"},{href:"js/array-2"}),"Js.Array2")," over ",(0,r.kt)("a",i({parentName:"p"},{href:"belt/array"}),"Belt.Array")),(0,r.kt)("h2",i({},{id:"argument-order"}),"Argument Order"),(0,r.kt)("p",null,"For historical reasons, some APIs in the Js namespace (e.g. ",(0,r.kt)("a",i({parentName:"p"},{href:"js/string"}),"Js.String"),") are\nusing the data-last argument order whereas others (e.g. ",(0,r.kt)("a",i({parentName:"p"},{href:"js/date"}),"Js.Date"),") are using data-first."),(0,r.kt)("p",null,"For more information about these argument orders and the trade-offs between them, see\n",(0,r.kt)("a",i({parentName:"p"},{href:"https://www.javierchavarri.com/data-first-and-data-last-a-comparison/"}),"this blog post"),"."),(0,r.kt)("p",null,(0,r.kt)("em",{parentName:"p"},"Eventually, all modules in the Js namespace are going to be migrated to data-first though.")),(0,r.kt)("p",null,"In the meantime, there are several options for dealing with the data-last APIs:"),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"example",example:!0}),'/* Js.String (data-last API used with pipe last operator) */\nJs.log("2019-11-10" |> Js.String.split("-"))\nJs.log("ReScript" |> Js.String.startsWith("Re"))\n\n/* Js.String (data-last API used with pipe first operator) */\nJs.log("2019-11-10"->Js.String.split("-", _))\nJs.log("ReScript"->Js.String.startsWith("Re", _))\n\n/* Js.String (data-last API used without any piping) */\nJs.log(Js.String.split("-", "2019-11-10"))\nJs.log(Js.String.startsWith("Re", "ReScript"))\n')),(0,r.kt)("h2",i({},{id:"jsxxx2-modules"}),"Js.Xxx2 Modules"),(0,r.kt)("p",null,"Prefer ",(0,r.kt)("inlineCode",{parentName:"p"},"Js.Array2")," over ",(0,r.kt)("inlineCode",{parentName:"p"},"Js.Array"),", ",(0,r.kt)("inlineCode",{parentName:"p"},"Js.String2")," over ",(0,r.kt)("inlineCode",{parentName:"p"},"Js.String"),", etc. The latters are old modules."),(0,r.kt)("h2",i({},{id:"object"}),"Object"),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"sig",sig:!0}),"type t<+'a>\n")),(0,r.kt)("p",null,"Js object type."),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"example",example:!0}),'let x: {"x": int, "y": int} = {"x": 1, "y": 2}\n')),(0,r.kt)("h2",i({},{id:"nullable-and-undefined"}),"Nullable and Undefined"),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"prelude",prelude:!0}),"type null<+'a>\n")),(0,r.kt)("p",null,"nullable, value of this type can be either null or 'a this type is the same as type t in Js.Null"),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"prelude",prelude:!0}),"type undefined<+'a>\n")),(0,r.kt)("p",null,"value of this type can be either undefined or 'a this type is the same as type t in Js.Undefined"),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"prelude",prelude:!0}),"type nullable<+'a>\n")),(0,r.kt)("p",null,"value of this type can be undefined, null or 'a this type is the same as type t n Js.Null_undefined"),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"prelude",prelude:!0}),"type null_undefined<'a> = Js.nullable<'a>\n")),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"sig",sig:!0}),"let toOption: Js.nullable<'a> => option<'a>\n")),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"sig",sig:!0}),"let undefinedToOption: Js.undefined<'a> => option<'a>\n")),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"sig",sig:!0}),"let nullToOption: Js.null<'a> => option<'a>\n")),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"sig",sig:!0}),"let test: Js.nullable<'a> => bool\n")),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"sig",sig:!0}),"let isNullable: Js.nullable<'a> => bool\n")),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"sig",sig:!0}),"let testAny: 'a => bool\n")),(0,r.kt)("p",null,"The same as ",(0,r.kt)("inlineCode",{parentName:"p"},"Js.test")," except that it is more permissive on the types of input."),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"sig",sig:!0}),"type promise<+'a, +'e>\n")),(0,r.kt)("p",null,"Deprecated. please use ",(0,r.kt)("inlineCode",{parentName:"p"},"Js.Promise"),".\nThe promise type, defined here for interoperation across packages."),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"sig",sig:!0}),"let null: Js.null<'a>\n")),(0,r.kt)("p",null,"The same as empty in ",(0,r.kt)("inlineCode",{parentName:"p"},"Js.Null"),". Will be compiled as ",(0,r.kt)("inlineCode",{parentName:"p"},"null"),"."),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"sig",sig:!0}),"let undefined: Js.undefined<'a>\n")),(0,r.kt)("p",null,"The same as empty ",(0,r.kt)("inlineCode",{parentName:"p"},"Js.Undefined"),". Will be compiled as ",(0,r.kt)("inlineCode",{parentName:"p"},"undefined"),"."),(0,r.kt)("h2",i({},{id:"typeof"}),"TypeOf"),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"sig",sig:!0}),"let typeof: 'a => string\n")),(0,r.kt)("p",null,(0,r.kt)("inlineCode",{parentName:"p"},"typeof x")," will be compiled as ",(0,r.kt)("inlineCode",{parentName:"p"},"typeof x")," in JS. Please consider functions in ",(0,r.kt)("inlineCode",{parentName:"p"},"Js.Types")," for a type safe way of reflection."),(0,r.kt)("h2",i({},{id:"logging"}),"Logging"),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"sig",sig:!0}),"let log: 'a => unit\nlet log2: ('a, 'b) => unit\nlet log3: ('a, 'b, 'c) => unit\nlet log4: ('a, 'b, 'c, 'd) => unit\n")),(0,r.kt)("p",null,"A convenience function to log everything."),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"sig",sig:!0}),"let logMany: array<'a> => unit\n")),(0,r.kt)("p",null,"A convenience function to log more than 4 arguments"),(0,r.kt)("h2",i({},{id:"comparison"}),"Comparison"),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"sig",sig:!0}),"let eqNull: ('a, null<'a>) => bool\nlet eqUndefined: ('a, undefined<'a>) => bool\nlet eqNullable: ('a, nullable<'a>) => bool\n")),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"sig",sig:!0}),"let unsafe_lt: ('a, 'a) => bool\n")),(0,r.kt)("p",null,(0,r.kt)("inlineCode",{parentName:"p"},"unsafe_lt a b")," will be compiled as ",(0,r.kt)("inlineCode",{parentName:"p"},"a < b"),". It is marked as unsafe, since it is impossible to give a proper semantics for comparision which applies to any type."),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"sig",sig:!0}),"let unsafe_le: ('a, 'a) => bool\n")),(0,r.kt)("p",null,(0,r.kt)("inlineCode",{parentName:"p"},"unsafe_le a b")," will be compiled as ",(0,r.kt)("inlineCode",{parentName:"p"},"a <= b"),". See also ",(0,r.kt)("inlineCode",{parentName:"p"},"Js.unsafe_lt"),"."),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"sig",sig:!0}),"let unsafe_gt: ('a, 'a) => bool\n")),(0,r.kt)("p",null,(0,r.kt)("inlineCode",{parentName:"p"},"unsafe_gt a b")," will be compiled as ",(0,r.kt)("inlineCode",{parentName:"p"},"a > b"),". See also ",(0,r.kt)("inlineCode",{parentName:"p"},"Js.unsafe_lt"),"."),(0,r.kt)("pre",null,(0,r.kt)("code",i({parentName:"pre"},{className:"language-res",metastring:"sig",sig:!0}),"let unsafe_ge: ('a, 'a) => bool\n")),(0,r.kt)("p",null,(0,r.kt)("inlineCode",{parentName:"p"},"unsafe_ge a b")," will be compiled as ",(0,r.kt)("inlineCode",{parentName:"p"},"a >= b"),". See also ",(0,r.kt)("inlineCode",{parentName:"p"},"Js.unsafe_lt"),"."))}o.isMDXComponent=!0,o.frontmatter={__ghEditHref:"https://github.com/reason-association/rescript-lang.org/blob/master/pages/docs/manual/latest/api/js.mdx"}},72936:function(e,t,a){(window.__NEXT_P=window.__NEXT_P||[]).push(["/docs/manual/latest/api/js",function(){return a(18647)}])}},function(e){e.O(0,[92888,49774,40179],(function(){return t=72936,e(e.s=t);var t}));var t=e.O();_N_E=t}]);