# Customization Besides parsing and evaluating expressions, the expression parser supports a number of features to customize processing and evaluation of expressions and outputting expressions. On this page: - [Function transforms](#function-transforms) - [Custom argument parsing](#custom-argument-parsing) - [Custom LaTeX handlers](#custom-latex-handlers) - [Custom HTML, LaTeX and string output](#custom-html-latex-and-string-output) - [Customize supported characters](#customize-supported-characters) ## Function transforms It is possible to preprocess function arguments and post process a functions return value by writing a *transform* for the function. A transform is a function wrapping around a function to be transformed or completely replaces a function. For example, the functions for math.js use zero-based matrix indices (as is common in programing languages), but the expression parser uses one-based indices. To enable this, all functions dealing with indices have a transform, which changes input from one-based to zero-based, and transforms output (and error message) from zero-based to one-based. ```js // using plain JavaScript, indices are zero-based: const a = [[1, 2], [3, 4]] // a 2x2 matrix math.subset(a, math.index(0, 1)) // returns 2 // using the expression parser, indices are transformed to one-based: const a = [[1, 2], [3, 4]] // a 2x2 matrix let scope = { a: a } math.evaluate('subset(a, index(1, 2))', scope) // returns 2 ``` To create a transform for a function, the transform function must be attached to the function as property `transform`: ```js import { create, all } from 'mathjs' const math = create(all) // create a function function addIt(a, b) { return a + b } // attach a transform function to the function addIt addIt.transform = function (a, b) { console.log('input: a=' + a + ', b=' + b) // we can manipulate input here before executing addIt const res = addIt(a, b) console.log('result: ' + res) // we can manipulate result here before returning return res } // import the function into math.js math.import({ addIt: addIt }) // use the function via the expression parser console.log('Using expression parser:') console.log('2+4=' + math.evaluate('addIt(2, 4)')) // This will output: // // input: a=2, b=4 // result: 6 // 2+4=6 // when used via plain JavaScript, the transform is not invoked console.log('') console.log('Using plain JavaScript:') console.log('2+4=' + math.addIt(2, 4)) // This will output: // // 6 ``` Functions with a transform must be imported in the `math` namespace, as they need to be processed at compile time. They are not supported when passed via a scope at evaluation time. ## Custom argument parsing The expression parser of math.js has support for letting functions parse and evaluate arguments themselves, instead of calling them with evaluated arguments. This is useful for example when creating a function like `plot(f(x), x)` or `integrate(f(x), x, start, end)`, where some of the arguments need to be processed in a special way. In these cases, the expression `f(x)` will be evaluated repeatedly by the function, and `x` is not evaluated but used to specify the variable looping over the function `f(x)`. Functions having a property `rawArgs` with value `true` are treated in a special way by the expression parser: they will be invoked with unevaluated arguments, allowing the function to process the arguments in a customized way. Raw functions are called as: ``` rawFunction(args: Node[], math: Object, scope: Object) ``` Where : - `args` is an Array with nodes of the parsed arguments. - `math` is the math namespace against which the expression was compiled. - `scope` is a shallow _copy_ of the `scope` object provided when evaluating the expression, optionally extended with nested variables like a function parameter `x` of in a custom defined function like `f(x) = x^2`. Raw functions must be imported in the `math` namespace, as they need to be processed at compile time. They are not supported when passed via a scope at evaluation time. A simple example: ```js function myFunction(args, math, scope) { // get string representation of the arguments const str = args.map(function (arg) { return arg.toString() }) // evaluate the arguments const res = args.map(function (arg) { return arg.compile().evaluate(scope) }) return 'arguments: ' + str.join(',') + ', evaluated: ' + res.join(',') } // mark the function as "rawArgs", so it will be called with unevaluated arguments myFunction.rawArgs = true // import the new function in the math namespace math.import({ myFunction: myFunction }) // use the function math.evaluate('myFunction(2 + 3, sqrt(4))') // returns 'arguments: 2 + 3, sqrt(4), evaluated: 5, 2' ``` ## Custom LaTeX handlers You can attach a `toTex` property to your custom functions before importing them to define their LaTeX output. This `toTex` property can be a handler in the format described in the next section 'Custom LaTeX and String conversion' or a template string similar to ES6 templates. ### Template syntax - `${name}`: Gets replaced by the name of the function - `${args}`: Gets replaced by a comma separated list of the arguments of the function. - `${args[0]}`: Gets replaced by the first argument of a function - `$$`: Gets replaced by `$` #### Example ```js const customFunctions = { plus: function (a, b) { return a + b }, minus: function (a, b) { return a - b }, binom: function (n, k) { return 1 } } customFunctions.plus.toTex = '${args[0]}+${args[1]}' //template string customFunctions.binom.toTex = '\\mathrm{${name}}\\left(${args}\\right)' //template string customFunctions.minus.toTex = function (node, options) { //handler function return node.args[0].toTex(options) + node.name + node.args[1].toTex(options) } math.import(customFunctions) math.parse('plus(1,2)').toTex() // '1+2' math.parse('binom(1,2)').toTex() // '\\mathrm{binom}\\left(1,2\\right)' math.parse('minus(1,2)').toTex() // '1minus2' ``` ## Custom HTML, LaTeX and string output All expression nodes have a method `toTex` and `toString` to output an expression respectively in HTML or LaTex format or as regular text . The functions `toHTML`, `toTex` and `toString` accept an `options` argument to customise output. This object is of the following form: ```js { parenthesis: 'keep', // parenthesis option handler: someHandler, // handler to change the output implicit: 'hide' // how to treat implicit multiplication } ``` ### Parenthesis The `parenthesis` option changes the way parentheses are used in the output. There are three options available: - `keep` Keep the parentheses from the input and display them as is. This is the default. - `auto` Only display parentheses that are necessary. Mathjs tries to get rid of as much parentheses as possible. - `all` Display all parentheses that are given by the structure of the node tree. This makes the output precedence unambiguous. There's two ways of passing callbacks: 1. Pass an object that maps function names to callbacks. Those callbacks will be used for FunctionNodes with functions of that name. 2. Pass a function to `toTex`. This function will then be used for every node. ```js const expression = math.parse('(1+1+1)') expression.toString() // (1 + 1 + 1) expression.toString({parenthesis: 'keep'}) // (1 + 1 + 1) expression.toString({parenthesis: 'auto'}) // 1 + 1 + 1 expression.toString({parenthesis: 'all'}) // (1 + 1) + 1 ``` ### Handler You can provide the `toTex` and `toString` functions of an expression with your own custom handlers that override the internal behaviour. This is especially useful to provide LaTeX/string output for your own custom functions. This can be done in two ways: 1. Pass an object that maps function names to callbacks. Those callbacks will be used for FunctionNodes that contain functions with that name. 2. Pass a callback directly. This callback will run for every node, so you can replace the output of anything you like. A callback function has the following form: ```js function callback (node, options) { ... } ``` Where `options` is the object passed to `toHTML`/`toTex`/`toString`. Don't forget to pass this on to the child nodes, and `node` is a reference to the current node. If a callback returns nothing, the standard output will be used. If your callback returns a string, this string will be used. **Although the following examples use `toTex`, it works for `toString` and `toHTML` in the same way** #### Examples for option 1 ```js const customFunctions = { binomial: function (n, k) { //calculate n choose k // (do some stuff) return result } } const customLaTeX = { 'binomial': function (node, options) { //provide toTex for your own custom function return '\\binom{' + node.args[0].toTex(options) + '}{' + node.args[1].toTex(options) + '}' }, 'factorial': function (node, options) { //override toTex for builtin functions return 'factorial\\left(' + node.args[0] + '\\right)' } } ``` You can simply use your custom toTex functions by passing them to `toTex`: ```js math.import(customFunctions) const expression = math.parse('binomial(factorial(2),1)') const latex = expression.toTex({handler: customLaTeX}) // latex now contains "\binom{factorial\\left(2\\right)}{1}" ``` #### Examples for option 2: ```js function customLaTeX(node, options) { if ((node.type === 'OperatorNode') && (node.fn === 'add')) { //don't forget to pass the options to the toTex functions return node.args[0].toTex(options) + ' plus ' + node.args[1].toTex(options) } else if (node.type === 'ConstantNode') { if (node.value === 0) { return '\\mbox{zero}' } else if (node.value === 1) { return '\\mbox{one}' } else if (node.value === 2) { return '\\mbox{two}' } else { return node.value } } } const expression = math.parse('1+2') const latex = expression.toTex({handler: customLaTeX}) // latex now contains '\mbox{one} plus \mbox{two}' ``` Another example in conjunction with custom functions: ```js const customFunctions = { binomial: function (n, k) { //calculate n choose k // (do some stuff) return result } } function customLaTeX(node, options) { if ((node.type === 'FunctionNode') && (node.name === 'binomial')) { return '\\binom{' + node.args[0].toTex(options) + '}{' + node.args[1].toTex(options) + '}' } } math.import(customFunctions) const expression = math.parse('binomial(2,1)') const latex = expression.toTex({handler: customLaTeX}) // latex now contains "\binom{2}{1}" ``` ### Implicit multiplication You can change the way that implicit multiplication is converted to a string or LaTeX. The two options are `hide`, to not show a multiplication operator for implicit multiplication and `show` to show it. Example: ```js const node = math.parse('2a') node.toString() // '2 a' node.toString({implicit: 'hide'}) // '2 a' node.toString({implicit: 'show'}) // '2 * a' node.toTex() // '2~ a' node.toTex({implicit: 'hide'}) // '2~ a' node.toTex({implicit: 'show'}) // '2\\cdot a' ``` ## Customize supported characters It is possible to customize the characters allowed in symbols and digits. The `parse` function exposes the following test functions: - `math.parse.isAlpha(c, cPrev, cNext)` - `math.parse.isWhitespace(c, nestingLevel)` - `math.parse.isDecimalMark(c, cNext)` - `math.parse.isDigitDot(c)` - `math.parse.isDigit(c)` The exact signature and implementation of these functions can be looked up in the [source code of the parser](https://github.com/josdejong/mathjs/blob/master/lib/expression/parse.js). The allowed alpha characters are described here: [Constants and variables](syntax.md#constants-and-variables). For example, the phone character is not supported by default. It can be enabled by replacing the `isAlpha` function: ```js const isAlphaOriginal = math.parse.isAlpha math.parse.isAlpha = function (c, cPrev, cNext) { return isAlphaOriginal(c, cPrev, cNext) || (c === '\u260E') } // now we can use the \u260E (phone) character in expressions const result = math.evaluate('\u260Efoo', {'\u260Efoo': 42}) // returns 42 console.log(result) ```