Array Utilities

The Array utilities provide a set of functions for working with arrays in JavaScript. These functions help in manipulating, transforming, and querying arrays efficiently.

Functions

unique

function unique(arr)

Remove duplicates from an array.

Parameters

Name	Type	Description
arr	array	The array to remove duplicates from

Returns

A new array with duplicates removed.

Example

import { unique } from '@semantic-ui/utils';

const arr = [1, 2, 2, 3, 4, 4, 5];
console.log(unique(arr)); // [1, 2, 3, 4, 5]

filterEmpty

function filterEmpty(arr)

Remove undefined values from an array.

Parameters

Name	Type	Description
arr	array	The array to filter

Returns

A new array with undefined values removed.

Example

import { filterEmpty } from '@semantic-ui/utils';

const arr = [1, undefined, 2, null, 3, '', 4];
console.log(filterEmpty(arr)); // [1, 2, null, 3, '', 4]

last

function last(array, number = 1)

Get the last element(s) from an array.

Parameters

Name	Type	Description	Default
array	array	The input array
number	number	The number of elements to return	1

Returns

The last element, an array of the last n elements, or undefined if the array is empty.

Example

import { last } from '@semantic-ui/utils';

const arr = [1, 2, 3, 4, 5];
console.log(last(arr)); // 5
console.log(last(arr, 2)); // [4, 5]

first

function first(array, number = 1)

Get the first element(s) from an array.

Parameters

Name	Type	Description	Default
array	array	The input array
number	number	The number of elements to return	1

Returns

The first element, an array of the first n elements, or undefined if the array is empty.

Example

import { first } from '@semantic-ui/utils';

const arr = [1, 2, 3, 4, 5];
console.log(first(arr)); // 1
console.log(first(arr, 2)); // [1, 2]

firstMatch

function firstMatch(array, callback)

Iterate through an array and return the first value that matches the callback condition.

Parameters

Name	Type	Description
array	array	The input array
callback	function	The callback function to test each element

Returns

The first matching element or undefined if no match is found.

Example

import { firstMatch } from '@semantic-ui/utils';

const arr = [1, 2, 3, 4, 5];
const result = firstMatch(arr, (value) => value > 3);
console.log(result); // 4

findIndex

function findIndex(array, callback)

Find the index of the first element in the array that satisfies the provided testing function.

Parameters

Name	Type	Description
array	array	The input array
callback	function	The callback function to test each element

Returns

The index of the first matching element, or -1 if no match is found.

Example

import { findIndex } from '@semantic-ui/utils';

const arr = [1, 2, 3, 4, 5];
const index = findIndex(arr, (value) => value > 3);
console.log(index); // 3

remove

function remove(array, callbackOrValue)

Remove an element from the array that matches the provided callback or value.

Parameters

Name	Type	Description
array	array	The input array
callbackOrValue	function or any	The callback function to test each element or the value to remove

Returns

True if an element was removed, false otherwise.

Example

import { remove } from '@semantic-ui/utils';

const arr = [1, 2, 3, 4, 5];
remove(arr, 3);
console.log(arr); // [1, 2, 4, 5]

remove(arr, (value) => value > 4);
console.log(arr); // [1, 2, 4]

inArray

function inArray(value, array = [])

Check if a value is in the array.

Parameters

Name	Type	Description
value	any	The value to search for
array	array	The array to search in

Returns

True if the value is in the array, false otherwise.

Example

import { inArray } from '@semantic-ui/utils';

const arr = [1, 2, 3, 4, 5];
console.log(inArray(3, arr)); // true
console.log(inArray(6, arr)); // false

range

function range(start, stop, step = 1)

Generate an array of numbers within a specified range.

Parameters

Name	Type	Description	Default
start	number	The start of the range (or end if stop is not provided)
stop	number	The end of the range (optional)
step	number	The step between numbers	1

Returns

An array of numbers within the specified range.

Example

import { range } from '@semantic-ui/utils';

console.log(range(5)); // [0, 1, 2, 3, 4]
console.log(range(1, 5)); // [1, 2, 3, 4]
console.log(range(0, 10, 2)); // [0, 2, 4, 6, 8]

moveItem

function moveItem(array = [], callbackOrValue, index)

Move an item in an array to a specified index based on a callback or value match.

Parameters

Name	Type	Description
array	array	The array to modify
callbackOrValue	function or any	The callback function to test each element or the value to move
index	number or string	The target index to move the item to. Can be a number, ‘first’ (equivalent to 0), or ‘last’ (equivalent to array length - 1)

Returns

The modified array.

Example

import { moveItem } from '@semantic-ui/utils';

const arr = [1, 2, 3, 4];
console.log(moveItem(arr, 3, 0)); // [3, 1, 2, 4]
console.log(moveItem(arr, 2, 'last')); // [1, 3, 4, 2]
console.log(moveItem(arr, x => x === 4, 'first')); // [4, 1, 2, 3]
console.log(moveItem(arr, 2, 1)); // [1, 2, 3, 4]

moveToFront

function moveToFront(array = [], callbackOrValue)

Move an item to the front of an array based on a callback or value match. Equivalent to moveItem(array, callbackOrValue, 'first').

Parameters

Name	Type	Description
array	array	The array to modify
callbackOrValue	function or any	The callback function to test each element or the value to move

Returns

The modified array.

Example

import { moveToFront } from '@semantic-ui/utils';

const arr = [1, 2, 3, 4];
console.log(moveToFront(arr, 3)); // [3, 1, 2, 4]

moveToBack

function moveToBack(array = [], callbackOrValue)

Move an item to the back of an array based on a callback or value match. Equivalent to moveItem(array, callbackOrValue, 'last').

Parameters

Name	Type	Description
array	array	The array to modify
callbackOrValue	function or any	The callback function to test each element or the value to move

Returns

The modified array.

Example

import { moveToBack } from '@semantic-ui/utils';

const arr = [1, 2, 3, 4];
console.log(moveToBack(arr, 2)); // [1, 3, 4, 2]

sum

function sum(values)

Calculate the sum of an array of numbers.

Parameters

Name	Type	Description
values	array	An array of numbers

Returns

The sum of all numbers in the array.

Example

import { sum } from '@semantic-ui/utils';

const numbers = [1, 2, 3, 4, 5];
console.log(sum(numbers)); // 15

where

function where(array, properties)

Filter an array of objects based on matching properties.

Parameters

Name	Type	Description
array	array	The array of objects to filter
properties	object	An object with properties to match

Returns

An array of objects that match all the specified properties.

Example

import { where } from '@semantic-ui/utils';

const people = [
  { name: 'John', age: 30 },
  { name: 'Jane', age: 25 },
  { name: 'Bob', age: 30 }
];
const result = where(people, { age: 30 });
console.log(result); // [{ name: 'John', age: 30 }, { name: 'Bob', age: 30 }]

flatten

function flatten(arr)

Flatten a nested array structure.

Parameters

Name	Type	Description
arr	array	The array to flatten

Returns

A new, flattened array.

Example

import { flatten } from '@semantic-ui/utils';

const nestedArray = [1, [2, [3, 4]], 5];
console.log(flatten(nestedArray)); // [1, 2, 3, 4, 5]

some

function some(collection, predicate)

Check if at least one element in the collection satisfies the predicate.

Parameters

Name	Type	Description
collection	array	The collection to iterate over
predicate	function	The function invoked per iteration

Returns

True if any element passes the predicate check, else false.

Example

import { some } from '@semantic-ui/utils';

const numbers = [1, 2, 3, 4, 5];
const result = some(numbers, (num) => num > 3);
console.log(result); // true

any

An alias for some.

sortBy

function sortBy(arr, key, comparator)

Sort an array of objects by a specific key.

Parameters

Name	Type	Description
arr	array	The array to sort
key	string	The key to sort by
comparator	function	Optional custom comparison function

Returns

A new sorted array.

Example

import { sortBy } from '@semantic-ui/utils';

const people = [
  { name: 'John', age: 30 },
  { name: 'Jane', age: 25 },
  { name: 'Bob', age: 35 }
];
const sorted = sortBy(people, 'age');
console.log(sorted);
// [{ name: 'Jane', age: 25 }, { name: 'John', age: 30 }, { name: 'Bob', age: 35 }]

groupBy

function groupBy(array, property)

Group an array of objects by a specific property.

Parameters

Name	Type	Description
array	array	The array to group
property	string	The property to group by

Returns

An object where keys are distinct values of the specified property, and values are arrays of elements that have that property value.

Example

import { groupBy } from '@semantic-ui/utils';

const people = [
  { name: 'John', age: 30 },
  { name: 'Jane', age: 25 },
  { name: 'Bob', age: 30 }
];
const grouped = groupBy(people, 'age');
console.log(grouped);
// {
//   '25': [{ name: 'Jane', age: 25 }],
//   '30': [{ name: 'John', age: 30 }, { name: 'Bob', age: 30 }]
// }

intersection

function intersection(...arrays)

Find elements common to all input arrays. Automatically switches between filter and Set implementation based on total array size for optimal performance.

Parameters

Name	Type	Description
arrays	…Array	Arrays to find common elements between

Returns

Array containing elements present in all input arrays.

Example

import { intersection } from '@semantic-ui/utils';

const arr1 = [1, 2, 3, 4];
const arr2 = [3, 4, 5, 6];
const arr3 = [3, 4, 6, 7];
console.log(intersection(arr1, arr2, arr3)); // [3, 4]

difference

function difference(...arrays)

Find elements unique to the first array. Automatically switches between filter and Set implementation based on total array size for optimal performance.

Parameters

Name	Type	Description
arrays	…Array	First array is filtered against all others

Returns

Array containing elements present in first array but not in any other input arrays.

Example

import { difference } from '@semantic-ui/utils';

const arr1 = [1, 2, 3, 4];
const arr2 = [3, 4, 5, 6];
const arr3 = [3, 4, 6, 7];
console.log(difference(arr1, arr2, arr3)); // [1, 2]

uniqueItems

function uniqueItems(...arrays)

Find elements that appear in exactly one input array. Automatically switches between filter and Set implementation based on total array size for optimal performance.

Parameters

Name	Type	Description
arrays	…Array	Arrays to compare

Returns

Array containing elements that appear in exactly one of the input arrays.

Example

import { uniqueItems } from '@semantic-ui/utils';

const arr1 = [1, 2, 3];
const arr2 = [2, 3, 4];
const arr3 = [3, 4, 5];
console.log(uniqueItems(arr1, arr2, arr3)); // [1, 5]

On This Page

Functions

unique

Parameters

Returns

Example

filterEmpty

Parameters

Returns

Example

last

Parameters

Returns

Example

first

Parameters

Returns

Example

firstMatch

Parameters

Returns

Example

findIndex

Parameters

Returns

Example

remove

Parameters

Returns

Example

inArray

Parameters

Returns

Example

range

Parameters

Returns

Example

moveItem

Parameters

Returns

Example

moveToFront

Parameters

Returns

Example

moveToBack

Parameters

Returns

Example

sum

Parameters

Returns

Example

where

Parameters

Returns

Example

flatten

Parameters

Returns

Example

some

Parameters

Returns

Example

any

sortBy

Parameters

Returns

Example

groupBy

Parameters

Returns

Example

intersection

Parameters

Returns

Example

difference