The compiler util

This library is part of the NX framework.

The main purpose of this library is to allow the execution of strings as code in the context of an object.

Installation

$ npm install @nx-js/compiler-util

Platform support

• Node: 6 and above
• Chrome: 49 and above (after browserified)
• Firefox: 38 and above (after browserified)
• Safari: 10 and above (after browserified)
• Edge: 12 and above (after browserified)
• Opera: 36 and above (after browserified)
• IE is not supported

Usage

1const compiler = require('@nx-js/compiler-util')

Compiling code

compiler.compileCode(string) creates a function from a string. The returned function takes an object as argument and executes the string as code in the context of the passed object. The string can be any valid JavaScript code.

1const code = compiler.compileCode('return prop1 + prop2')
2const sum = code({prop1: 1, prop2: 2}) // sum is 3

Temporary variables

The returned function also accepts a second object argument, that may contain temporary variables. Temporary variables are added to the context object while the code is executing. They are favored over the permanent context variables.

1const code = compiler.compileCode('return prop1 + prop2')
2const context = {prop1: 1, prop2: 2}
3const temporary = {prop1: 2}
4const sum = code(context, temporary) // sum is 4, context is still {prop1: 1, prop2: 2}

Limiters

Limiters are functions, which can defer or block code execution. Some popular limiters are debounce and throttle for example. Limiters can be registered by name with compiler.limiter(name, function) and used at the end of the code with the & symbol.

1// next is the code or the next limiter
2compiler.limiter('delay', next => setTimeout(next, 1000))
3
4const code = compiler.compileCode('console.log(message) & delay')
5const context = {message: 'Hello World'}
6code(context) // prints 'Hello World' to the console after a second

Limiters accept a context object, which can be used to share a context between executions of the code. It makes the creation of rate limiters - like throttle and debounce - straightforward.

1compiler.limiter('debounce', debounce)
2
3function debounce (next, context) {
4  clearTimeout(context.timer)
5  context.timer = setTimeout(next, 200)
6}

After the context argument limiters accept any number of custom arguments. These can be passed after the limiter name in the code, separated by spaces.

1compiler.limiter('delay', (next, context, amount) => setTimeout(next, amount))
2
3const code = compiler.compileCode('console.log(message) & delay 2000')
4const code2 = compiler.compileCode('console.log(message) & delay amount')
5
6const context = {message: 'Hello World', amount: 3000}
7code(context) // prints 'Hello World' to the console after 2 seconds
8code2(context) // prints 'Hello World' to the console after 3 seconds

Multiple limiters can be piped with the & symbol.

1const code = compiler.compileCode('console.log(message) & delay 1000 & throttle 100')
2
3// this logs 'Hello World' a second after you click the button
4// and it logs a message once per 100 milliseconds at most, excess messages are not logged
5button.addEventListener('code', () => code({message: 'Hello World'}))

You can find some commonly used limiters in this repo.

Compiling expressions

compiler.compileExpression(string) creates a function from a string. The returned function takes an object as argument and executes the string as an expression in the context of the passed object. It returns the result of the evaluated expression. The string can be any javascript expression that may come after a return statement.

1const expression = compiler.compileExpression('prop1 || prop2')
2const result = expression({prop2: 'Hello'}) // result is 'Hello'

Expressions return undefined instead of throwing a TypeError on invalid property access. This allows lazy initialization of your data.

1const expression = compiler.compileExpression('item.name')
2const context = {}
3
4let result = expression(context) // result is undefined, no error is thrown
5
6context.item = {name: 'item name'}
7result = expression(context) // result is 'item name'

Filters

Filters are functions, which can filter and modify expression result. Some popular filters are upperCase and trim for example. Filters can be registered by name with compiler.filter(name, function) and used at the end of the expression with the | symbol.

1// txt is the result of the expression
2compiler.filter('upperCase', txt => txt.toUpperCase())
3
4const expr = compiler.compileExpression('message | upperCase')
5const context = {message: 'Hello World'}
6console.log(expr(context)) // prints 'HELLO WORLD' to the console

Filters accept any number of custom arguments. These can be passed after the filter name in the expression, separated by spaces.

1compiler.filter('splice', (txt, start, end) => txt.splice(start, end))
2
3const expr = compiler.compileExpression('message | splice 0 6')
4const context = {message: 'Hello World'}
5console.log(expr(context)) // prints 'Hello' to the console

Multiple filters can be piped with the | symbol.

1const expr = compiler.compileExpression('message | splice 0 6 | upperCase')
2const context = {message: 'Hello World'}
3console.log(expr(context)) // prints 'HELLO' to the console

You can find some commonly used filters in this repo.

Handling globals

compiler.expose('String, String, ...') exposes globals by name for the compiler. Non of the globals are exposed by default.

1const code = compiler.compileCode('console.log(Math.round(num))')
2compiler.expose('console', 'Math')
3code({num: 1.8}) // logs 2 to the console

Context variables are always favored over global ones, when both are present with the same name.

compiler.hide(String, String, ...) hides globals by name, while compiler.hideAll() hides all globals.

1const code = compiler.compileCode('console.log(Math.round(num))')
2compiler.expose('console', 'Math')
3code({num: 1.8}) // logs 2 to the console
4compiler.hide('console', 'Math')
5code({num: 1.8}) // throws an error, console and Math are undefined

Alternative builds

This library detects if you use ES or commonJS modules and serve the right format to you. The exposed bundles are transpiled to ES5 to support common tools - like UglifyJS. If you would like a finer control over the provided build, you can specify them in your imports.

• @nx-js/compiler-util/dist/es.es6.js exposes an ES6 build with ES modules.
• @nx-js/compiler-util/dist/es.es5.js exposes an ES5 build with ES modules.
• @nx-js/compiler-util/dist/cjs.es6.js exposes an ES6 build with commonJS modules.
• @nx-js/compiler-util/dist/cjs.es5.js exposes an ES5 build with commonJS modules.

If you use a bundler, set up an alias for @nx-js/compiler-util to point to your desired build. You can learn how to do it with webpack here and with rollup here.

Contributions

This library has the very specific purpose of supporting the NX framework. Features should only be added, if they are used by the framework. Otherwise please fork.

Bug fixes, tests and doc updates are always welcome. Tests and linter (standardJS) must pass.

Authors

• Miklos Bertalan

License

MIT