Preparing Your Code For Use With a JavaScript Library Interface
- Updated2024-05-31
- 4 minute(s) read
Preparing Your Code For Use With a JavaScript Library Interface
Create wrapper code, if necessary, to make your JavaScript functions compatible with the JavaScript Library Interface (JSLI).
-
Determine if you need to create wrapper code.
When calling JavaScript functions in your web application, you may need to create wrapper code to make your JavaScript code compatible with the JSLI. The following table contains common examples of when to create wrapper code and descriptions of the wrapper code to create.
Situation Solution You need to call functions that use or return unsupported data types. JSLIs currently support the following data types:
- booleans
- strings
- numerics
- 8-bit signed integer
- 16-bit signed integer
- 32-bit signed integer
- 8-bit unsigned integer
- 16-bit unsigned integer
- 32-bit unsigned integer
- Single-precision, floating-point numeric
- Double-precision, floating-point numeric
- JavaScript references
- 1D array of numerics (represented as a TypedArray)
- 1D array of JavaScript references (represented as Array of JavaScript values)
Create wrapper functions that convert between unsupported JavaScript types and types supported by the JSLI.
You need to use the new operator to create an instance of an object or you need to invoke a method on an instance of an object.
Complete the following steps:- Create a wrapper function that invokes the new operator and stores a reference to the new object instance.
- Create a wrapper function that looks up the reference to that object and invokes a method.
-
Create wrapper code for your JavaScript library. NI recommends you create one JavaScript file per JSLI document that contains all the wrapper functions you create.
Model the following code as a best practice for creating wrapper code. Customize the following code for your unique programming goals.
/*1*/ (function () { 'use strict'; /*2*/ var counter = 1; /*3*/ /*4*/ var logWithCount = function (message){ console.log(counter + ' > ' + message); /*5*/ return counter++; /*6*/ }; window.logWithCount = logWithCount; /*7*/ }());
Wrap the contents of the entire wrapper JavaScript file in an immediately invoked function expression (IIFE). The IIFE creates a new lexical scope which prevents you from unintentionally adding objects to the global scope. Configure the IIFE to use JavaScript strict mode. Strict mode improves error handling and allows browsers to make certain optimizations. Create a private variable by declaring it within the IIFE. In this example, the private variable is named counter. Because this variable is private, it cannot be unintentionally modified by other code. This variable is not accessible to the JSLI because you did not add it to the global scope.
Create a new function and add the desired parameters to the function. In this example, we create a function named logWithCount that passes a parameter to a built-in browser function named console.log. Call the function you are wrapping, in this example, the console.log function. Return a value from your wrapper function. If you configure the return parameter in the JSLI document to be of a type other than void, you must pass a return value of the type you configured in the JSLI document to the return statement. Add the function you want to call in your web application to the global scope to allow the JSLI document to access the function. In this example, we use the logWithCount function. In a web browser, the name of the global object is window, so the code window.logWithCount = logWithCount; places logWithCount on the global scope.
Related Information
- Defining Calls to JavaScript Functions using a JavaScript Library Interface
To call JavaScript functions in your web application, define calls to the JavaScript functions using a JavaScript Library Interface (JSLI) document.
- JavaScript Resources
Research JavaScript concepts using NI-recommended resources.