comparison.compare()

The comparison.compare() function returns a bool indicating the result of the comparison.

// Sass.
@use 'sass:list';
@use 'sass:map';
@use 'sass:math';
@use 'sass:meta';

// Modules.
@use '../string';
@use 'greater';
@use 'less';

// Functions.
@use '../meta/meta.of-type.function' as *;
@use 'comparison.equal.function' as *;

// The `comparison.compare()` function.
@function compare($value, $operator, $operand) {
  $not: if(string.index($operator, '!'), true, false);
  $check-type: null;

  // List length.
  @if string.index($operator, '(,)') {
    $operator: string.replace($operator, first, '(,)', '');
    $check-type: meta.type-of($value) == list or meta.type-of($value) == map;
    $value: if($check-type, list.length($value), $value);

    // Map length.
  } @else if string.index($operator, '(:)') {
    // @deprecated
    $operator: string.replace($operator, first, '(:)', '');
    $check-type: meta.type-of($value) == map;
    $value: if($check-type, list.length($value), $value);

    // Type of.
  } @else if string.index($operator, ':') == 1 {
    $operator: string.replace($operator, first, ':', '');
    $value: meta.type-of($value);
    $operand: if(not $operand, meta.type-of($operand), $operand);
  }

  // Remove not.
  $operator: string.replace($operator, first, '!', '');

  // Use the function depending on the given operator.
  $function: map.get(
    (
      '===': meta.get-function(compatible, $module: math),
      '~=': meta.get-function(index, $module: string),
      '==': meta.get-function(equal),
      '=': meta.get-function(equal),
      '>': meta.get-function(than, $module: greater),
      '>=': (
        meta.get-function(than, $module: greater),
        meta.get-function(equal),
      ),
      '<': meta.get-function(than, $module: less),
      '<=': (
        meta.get-function(than, $module: less),
        meta.get-function(equal),
      ),
    ),
    $operator
  );

  // Call the functions to compare.
  $result: ();
  @each $function in $function {
    $comparison-result: meta.call($function, $value, $operand);
    $result: list.append(
      $result,
      if(meta.type-of($comparison-result) == number, true, $comparison-result)
    );
  }

  // Check whether the result contains true.
  $result: if(list.index($result, true), true, false);

  // Check the type for list and map length.
  $result: if(
    meta.type-of($check-type) == bool,
    $check-type and $result,
    $result
  );

  // Returns comparison result.
  @return if($not, not $result, $result);
}

https://github.com/angular-package/sass/blob/main/comparison/_comparison.compare.function.scss

// Sass.
@use 'sass:list';
@use 'sass:map';
@use 'sass:math';
@use 'sass:meta';

// Modules.
@use '../string';
@use 'greater';
@use 'less';

// Functions.
@use '../meta/meta.of-type.function' as *;
@use 'comparison.equal.function' as *;

// Status: TODO: number of pairs in a map.
// The `comparison.compare()` function returns a bool indicating the result of the comparison.
// @param `$value` The value to compare with the given `$operand`.
// @param `$operator` The operator used to compare `$value` and `$operand`.
// @param `$operand` The value to compare with the given `$value`.
// @return The return value is a bool indicating the result of the comparison.
@function compare($value, $operator, $operand) {
  $not: if(string.index($operator, '!'), true, false);
  $check-type: null;

  // List length.
  @if string.index($operator, '(,)') {
    $operator: string.replace($operator, first, '(,)', '');
    $check-type: meta.type-of($value) == list or meta.type-of($value) == map;
    $value: if($check-type, list.length($value), $value);

  // Map length.
  } @else if string.index($operator, '(:)') {
    // @deprecated
    $operator: string.replace($operator, first, '(:)', '');
    $check-type: meta.type-of($value) == map;
    $value: if($check-type, list.length($value), $value);

  // Type of.
  } @else if string.index($operator, ':') == 1 {
    $operator: string.replace($operator, first, ':', '');
    $value: meta.type-of($value);
    $operand: if(not $operand, meta.type-of($operand), $operand);
  }

  // Remove not.
  $operator: string.replace($operator, first, '!', '');

  // Use the function depending on the given operator.
  $function: map.get((
    '===': meta.get-function(compatible, $module: math),
    '~=': meta.get-function(index, $module: string),
    '==': meta.get-function(equal),
    '=': meta.get-function(equal),
    '>': meta.get-function(than, $module: greater),
    '>=': (meta.get-function(than, $module: greater), meta.get-function(equal)),
    '<': meta.get-function(than, $module: less),
    '<=': (meta.get-function(than, $module: less), meta.get-function(equal)),
  ), $operator);

  // Call the functions to compare.
  $result: ();
  @each $function in $function {
    $comparison-result: meta.call($function, $value, $operand);
    $result: list.append($result, if(meta.type-of($comparison-result) == number, true, $comparison-result));
  }

  // Check whether the result contains true.
  $result: if(list.index($result, true), true, false);

  // Check the type for list and map length.
  $result: if(meta.type-of($check-type) == bool, $check-type and $result, $result);

  // Returns comparison result.
  @return if($not, not $result, $result);
}

// Additional function name.
@function single($value, $operator, $operand) {
  @return compare($value, $operator, $operand);
}

// Operator.
// '===' comparable
// '==', // equal to
// '!=', // not equal to
// '~=', // text contains the given string (string.index())
// '!~=', // text does not contain the given string (string.index())
// ':==', // type of the given value is equal to the given type
// ':!=',  // type of the given value is not equal to the given type
// '>',
// '>=',
// '<',
// '<='
// ':' type
// '(:)' map keys length
// '(,)' list length

// Examples.
// ==
// Arbitrary.
// @debug compare(27, '==', 27); // true
// @debug compare(27px, '==', 27em); // false
// @debug compare('bold ', '!~=', 'bold'); // false

// List.
// @debug compare(27 '==' 27...); // true
// @debug compare((27, '==', 27)...); // true

// Map.
// @debug compare((value: 27, operator: '==', operand: 27)); // true

// @debug compare('there is a word', '==', 'there is a word'); // true
// @debug compare(null, '==', null); // true
// @debug compare((a: 2222), '==', ('a': 2222)); // true

// Multiple comparisons as map.
// @debug compare((value: 27, operator: '==', operand: 27), (value: 17, operator: '==', operand: 27)); // true, false

// Multiple comparisons as list.
// @debug compare(27 '==' 27, 17 '==' 27, 5 '>' 3); // true, false, true
// @debug compare((27, '==', 27), (27, '!=', 27)); // true, false

// ===
// @debug compare(27px, '===', 27px); // true
// @debug compare(27px, '===', 27em); // false

// !==
// @debug compare(27, '!==', 27); // false
// @debug compare('there is a word', '!==', 'there is a word'); // false
// @debug compare(null, '!==', null); // false
// @debug compare((a: 2222), '!==', ('a': 2222)); // false
// @debug compare(true, '!==', null); // true

// :==
// @debug compare('a', ':==', string); // true
// @debug compare(null, ':==', null); // true
// @debug compare(false, ':==', bool); // true

// :!==
// @debug compare(3, ':!=', string); // true
// @debug compare(27, ':!==', string); // true
// @debug compare('a', ':!==', string); // false
// @debug compare(null, ':!==', null); // false
// @debug compare(false, ':!==', bool); // false

// ~=
// @debug compare('bold king', '~=', 'bold'); // true

// !~=
// @debug compare('bold king', '!~=', 'word'); // true
// @debug compare('bold king', '!~=', 'bold'); // false

// >
// @debug compare(3, '>', 1); // true
// @debug compare(3, '>', 5); // false

// >=
// @debug compare(3, '>=', 1); // true
// @debug compare(3, '>=', 3); // true

// <
// @debug compare(3, '<', 1); // false
// @debug compare(3, '>', 5); // false

// <=
// @debug compare(3, '<=', 1); // false
// @debug compare(3, '<=', 3); // true

// (,)==
// @debug compare(('a', 'b', 'c'), '(,)==', 3); // true
// @debug compare(('a', 'b', 'c'), '(,)==', 13); // false

// (,)!=
// @debug compare(('a', 'b', 'c'), '(,)!=', 3); // false
// @debug compare(('a', 'b', 'c'), '(,)!=', 13); // true

// (,)>
// @debug compare(('a', 'b', 'c'), '(,)>', 2); // true
// @debug compare(('a', 'b', 'c'), '(,)>', 3); // false

// (,)>=
// @debug compare(('a', 'b', 'c'), '(,)>=', 3); // true
// @debug compare(('a', 'b', 'c'), '(,)>=', 4); // false

// (,)<
// @debug compare(('a', 'b', 'c'), '(,)<', 4); // true
// @debug compare(('a', 'b', 'c'), '(,)<', 3); // false

// (,)<=
// @debug compare(('a', 'b', 'c'), '(,)<=', 3); // true
// @debug compare(('a', 'b', 'c'), '(,)<=', 2); // false

// (:)==
// @debug compare(('a': 1, 'b': 2, 'c': 3), '(,)==', 3); // true
// @debug compare(('a': 1, 'b': 2, 'c': 3), '(,)==', 4); // false

// (:)!=
// @debug compare(('a': 1, 'b': 2, 'c': 3), '(,)!=', 3); // false
// @debug compare(('a': 1, 'b': 2, 'c': 3), '(,)!=', 2); // true

// (:)> (:)<
// @debug compare(('a': 1, 'b': 2, 'c': 3), '(,)>', 3); // false
// @debug compare(('a': 1, 'b': 2, 'c': 3), '(,)<', 2); // false

Parameters

`$value`

The value to compare with the given $operand.

`$operator`

The operator used to compare $value and $operand.

Indicator

not

type of

(,)

list length or number of keys/pairs in a map

Operator

===

$value compatbile or comparable with $operand

$value equal to $operand

$value contains the given string (string.index()) in $operand

$value greater than $operand

$value greater or equal than $operand

$value less than $operand

$value less or equal than $operand

Indicator + Operator

!==

$value not equal to $operand

!~=

$value does not contain the given string

(string.index()) in $operand

:==

$value type of $operand

(,)== (,)!==

(,)>

(,)>=

(,)< (,)<=

$value list/map length is ... $operand

`$operand`

The value to compare with the given $value.

Return

The return value is a bool indicating the result of the comparison.

Examples

Equal to `==` or not `!==`

// Use.
@use 'angular-package/sass/comparison';

// Examples.
// ==
@debug comparison.compare(27, '==', 27); // true
@debug comparison.compare(27px, '==', 27em); // false

// !==
@debug comparison.compare(27, '!==', 27); // false
@debug comparison.compare('there is a word', '!==', 'there is a word'); // false
@debug comparison.compare(null, '!==', null); // false
@debug comparison.compare((a: 2222), '!==', ('a': 2222)); // false
@debug comparison.compare(true, '!==', null); // true

Compatible `===`

// ===
@debug comparison.compare(27px, '===', 27px); // true
@debug comparison.compare(27px, '===', 27em); // false

// !===
@debug comparison.compare(27px, '!===', 27px); // false

String index `~=` or not `!~=`

// ~=
@debug comparison.compare('bold king', '~=', 'bold'); // true

// !~=
@debug comparison.compare('bold king', '!~=', 'word'); // true
@debug comparison.compare('bold king', '!~=', 'bold'); // false

Greater `>` or equal `>=` than

// >
@debug comparison.compare(3, '>', 1); // true
@debug comparison.compare(3, '>', 5); // false

// >=
@debug comparison.compare(3, '>=', 1); // true
@debug comparison.compare(3, '>=', 3); // true

Less `<` or equal `<=` than

// <
@debug comparison.compare(3, '<', 1); // false
@debug comparison.compare(3, '>', 5); // false

// <=
@debug comparison.compare(3, '<=', 1); // false
@debug comparison.compare(3, '<=', 3); // true

Type of `:==` or not `:!==`

// :==
@debug comparison.compare('a', ':==', string); // true
@debug comparison.compare(null, ':==', null); // true
@debug comparison.compare(false, ':==', bool); // true

// :!==
@debug comparison.compare(3, ':!=', string); // true
@debug comparison.compare(27, ':!==', string); // true
@debug comparison.compare('a', ':!==', string); // false
@debug comparison.compare(null, ':!==', null); // false
@debug comparison.compare(false, ':!==', bool); // false

List length, map pairs `(,)`

// (,)==
@debug comparison.compare(('a', 'b', 'c'), '(,)==', 3); // true
@debug comparison.compare(('a', 'b', 'c'), '(,)==', 13); // false

// (,)!=
@debug comparison.compare(('a', 'b', 'c'), '(,)!=', 3); // false
@debug comparison.compare(('a', 'b', 'c'), '(,)!=', 13); // true

// (,)>
@debug comparison.compare(('a', 'b', 'c'), '(,)>', 2); // true
@debug comparison.compare(('a', 'b', 'c'), '(,)>', 3); // false

// (,)>=
@debug comparison.compare(('a', 'b', 'c'), '(,)>=', 3); // true
@debug comparison.compare(('a', 'b', 'c'), '(,)>=', 4); // false

// (,)<
@debug comparison.compare(('a', 'b', 'c'), '(,)<', 4); // true
@debug comparison.compare(('a', 'b', 'c'), '(,)<', 3); // false

// (,)<=
@debug comparison.compare(('a', 'b', 'c'), '(,)<=', 3); // true
@debug comparison.compare(('a', 'b', 'c'), '(,)<=', 2); // false

// (,)==
@debug comparison.compare(('a': 1, 'b': 2, 'c': 3), '(,)==', 3); // true
@debug comparison.compare(('a': 1, 'b': 2, 'c': 3), '(,)==', 4); // false

// (,)!=
@debug comparison.compare(('a': 1, 'b': 2, 'c': 3), '(,)!=', 3); // false
@debug comparison.compare(('a': 1, 'b': 2, 'c': 3), '(,)!=', 2); // true

// (,)> (,)<
@debug comparison.compare(('a': 1, 'b': 2, 'c': 3), '(,)>', 3); // false
@debug comparison.compare(('a': 1, 'b': 2, 'c': 3), '(,)<', 2); // false

Previousless.than-every()Nextcomparison.compare-multiple()

Last updated 2 years ago

Was this helpful?

Parameters

$value

$operator

$operand

Return

Examples

Equal to == or not !==

Compatible ===

String index ~= or not !~=

Greater > or equal >= than

Less < or equal <= than

Type of :== or not :!==

List length, map pairs (,)