Utils

During the framework writing, we have accumulated many functions that you could also use.

import utils from 'akili/src/services/utils';
console.log(utils === Akili.services.utils); // true

Also you have access to utils object inside the scope expression.

<my-component class="${ utils.class({active: true}) }"></my-component>

utils.class(object) string

  • object Object - object with the classes and states

Create a string of the html classes from the object

const classes = {
  active: true,
  red: 1,
  disabled: false
}

console.log(utils.class(classes));
// 'active red'

utils.style(object) string

  • object Object - object with the styles and values

Create a string of html styles from the object

const styles = {
  background: false,
  color: 'red',
  borderColor: 'black'
}

console.log(utils.style(styles));
// 'color:red;border-color:black'

utils.filter(array, handler, keys) Array

  • array Array - array to filter
  • handler string | RegExp | function - condition for filtering
  • [keys] string[] | string - keys of the items

Filter the array

console.log(utils.filter([1, 2, 3, 11], item => item.match('1')));
// [1, 11]
console.log(utils.filter([{x: 1}, {x: 2}, {x: 3}, {x: 11}], '1', 'x'));
console.log(utils.filter([{x: 1}, {x: 2}, {x: 3}, {x: 11}], '1', ['x']));
console.log(utils.filter([{x: 1}, {x: 2}, {x: 3}, {x: 11}], '1', [['x']]));
// [{x: 1}, {x: 11}]
console.log(utils.filter([{x: {y: 1}}, {x: {y: 2}}], '1', [['x', 'y']]));
// [{x: {y: 1}}]
console.log(utils.filter([{x: 1, y: 2}, {x: 3, y: 3}, {x: 2, y: 1}], '1', ['x', 'y']));
console.log(utils.filter([{x: 1, y: 2}, {x: 3, y: 3}, {x: 2, y: 1}], '1', [['x'], ['y']]));
// [{x: 1, y: 2}, {x: 2, y: 1}]

utils.sort(array, keys, direction) Array

  • array Array - array to filter
  • [keys=true] boolean | Array[] | string[] | string - sorting conditions
  • [direction=[]] boolean | boolean[] - sorting direction

Sort the array

console.log(utils.sort([3, 2, 1], true));
// [1, 2, 3]
console.log(utils.sort([1, 2, 3], false));
// [3, 2, 1]
console.log(utils.sort([{x: 3}, {x: 2}, {x: 1}], [['x']], [true]));
console.log(utils.sort([{x: 3}, {x: 2}, {x: 1}], ['x'], true));
console.log(utils.sort([{x: 3}, {x: 2}, {x: 1}], 'x'));
// [{x: 1}, {x: 2}, {x: 3}]
console.log(utils.sort([{x: 1}, {x: 2}, {x: 3}], [['x']], [false]));
console.log(utils.sort([{x: 1}, {x: 2}, {x: 3}], ['x'], false));
console.log(utils.sort([{x: 1}, {x: 2}, {x: 3}], 'x', false));
// [{x: 3}, {x: 2}, {x: 1}]
console.log(utils.sort([{x: 2, y: 2}, {x: 2, y: 1}, {x: 2, y: 3}], [['x'], ['y']], [true, true]));
// [{x: 1, y: 3}, {x: 2, y: 1}, {x: 2, y: 2}]
console.log(utils.sort([{x: {y: 2}}, {x: {y: 1}}], [['x', 'y']], [true]));
// [{x: {y: 1}}, {x: {y: 2}}]

utils.split(str, del, exclude) string[]

  • str string - value to split
  • [del] string|RegExp - delimiter
  • [exclude] string[] - list of the excluded boundaries

split the string extended

console.log(utils.split("Hello World", " "));
// ["Hello", "World"]
console.log(utils.split('x = 5; y = "1;2;3"', ";", ['"']));
// ['x = 5', ' y = "1;2;3"']

utils.includeKeys(obj, keys) object

  • obj object - actual object
  • keys string[] - necessary keys

Return a new object with the specified keys

console.log(utils.includeKeys({x: 1, y: 1, z: 1}, ['x', 'z']));
// {x: 1, z: 1}

utils.excludeKeys(obj, keys) object

  • obj object - actual object
  • keys string[] - necessary keys

Return a new object without the specified keys

console.log(utils.excludeKeys({x: 1, y: 1, z: 1}, ['y']));
// {x: 1, z: 1}

utils.isPlainObject(value) boolean

  • value * - value to check

Check the object is plain (has constructor Object or Array)

utils.copy(value, options) boolean

  • value * - value to copy
  • [options={ nested: true, enumerable: true }] object - options

Copy the value

utils.compare(a, b, options) boolean

  • a * - first value
  • b * - second value
  • [options={ enumerable: true }] object - options

Compare two values. Objects is compared for identity of all properties.

utils.encodeHtmlEntities(string) string

  • string string - value to convert

Convert the string to HTML entities

console.log(utils.encodeHtmlEntities('you & me'));
// 'you &amp; me'

utils.decodeHtmlEntities(string) string

  • string string - value to convert

Decode the HTML entities

console.log(utils.decodeHtmlEntities('you &amp; me'));
// 'you & me'

utils.toCamelCase(string) string

  • string string - value to convert

Convert the string to a camel case

utils.toDashCase(string) string

  • string string - value to convert

Convert the string to a dash case

utils.getPropertyByKeys(keys, object) *

  • keys string[] - object keys
  • object Object - object to find

Get the nested object property by array keys

console.log(utils.getPropertyByKeys(['x', 'y'], {x: {y: 5}}));
// 5

utils.hasPropertyByKeys(keys, object) boolean

  • keys string[] - object keys
  • object Object - object to check

Check the object nested property existence

console.log(utils.hasPropertyByKeys(['x', 'y'], {x: {y: 5}}));
// true

utils.setPropertyByKeys(keys, object, fn) *

  • keys string[] - object keys
  • object Object - object to set
  • fn function - function to set the value

Set the object nested property value

let obj = {x: {y: 5}};

console.log(utils.setPropertyByKeys(['x', 'y'], obj, (last, val) => last? 6: (val || {})));
// {y: 6}
console.log(obj.x.y);
// 6

utils.deletePropertyByKeys(keys, object, fn) boolean

  • keys string[] - object keys
  • object Object - object to delete
  • [fn] function - function to handle

Delete the property from the object

let obj = {x: {y: 5}};

utils.deletePropertyByKeys(['x', 'y'], obj, val => val != 5);
console.log(obj.x.hasOwnProperty('y'));
// true

utils.deletePropertyByKeys(['x', 'y'], obj);
console.log(obj.x.hasOwnProperty('y'));
// false

utils.createRandomString(length, fn) string

  • [length=16] integer - length of the string
  • [fn] function - Function to check the uniqueness. If you return true the string will be regenerated until the function returns a negative value.

Generate a random string

There are a lot of others but less popular functions in utils. You can take a look at the source code.