SASS | List Functions

The SASS list functions are used to modify new lists. The lists need to be created inside circular brackets in order to differentiate from others. SASS list can not be changed hence in some cases new lists are created.

Just like the string functions, SASS lists are one-based (not zero-based) indexed meaning the first element of a string is present at index 1 (not at index 0).

The following lists represents the all list functions in SASS:

  1. list-separator($list) function: This function returns the name of the separator used in the list as a string.
    • Example 1:
      filter_none

      edit
      close

      play_arrow

      link
      brightness_4
      code

      list-separator((1, 2, 3))

      chevron_right

      
      

    • Output:
      "comma"
    • Example 2:
      filter_none

      edit
      close

      play_arrow

      link
      brightness_4
      code

      list-separator((1 2 3))

      chevron_right

      
      

    • Output:
      "space"
  2. zip($lists) function: This function devides the values of the lists given into a single multi-dimensional list.
    • Example:
      filter_none

      edit
      close

      play_arrow

      link
      brightness_4
      code

      zip(1px 2px 3px, solid dashed dotted, red green blue)

      chevron_right

      
      

    • Output:
      1px solid red, 2px dashed green, 3px dotted blue
  3. join($list1, $list2, [$separator]) function: This function appends $list2 to the end of $list1. The separator argument could contain the values “comma, space or auto”. The auto value, which is also the default value, will use the separator in the first list.
    • Example 1:
      filter_none

      edit
      close

      play_arrow

      link
      brightness_4
      code

      join(1 2 3, 4 5 6)

      chevron_right

      
      

    • Output:
      (1 2 3 4 5 6)
    • Example 2:
      filter_none

      edit
      close

      play_arrow

      link
      brightness_4
      code

      join((1, 2, 3), (4 5 6), comma)

      chevron_right

      
      

    • Output:
      (1, 2, 3, 4, 5, 6)
    • Example 3:
      filter_none

      edit
      close

      play_arrow

      link
      brightness_4
      code

      join((1, 2, 3), (4 5 6), space)

      chevron_right

      
      

    • Output:
      (1 2 3 4 5 6)
  4. nth($list, $n) function: This function returns the nth element of the list.
    • Example:
      filter_none

      edit
      close

      play_arrow

      link
      brightness_4
      code

      nth(5 4 6 7 8 9 1, 4)

      chevron_right

      
      

    • Output:
      7
  5. set-nth($list, $n, $value) function: This function sets the nth element of the list to the value provided.
    • Example:
      filter_none

      edit
      close

      play_arrow

      link
      brightness_4
      code

      set-nth(5 4 6 7 8 9 1, 3, 5)

      chevron_right

      
      

    • Output:
      (5 4 5 7 8 9 1)
  6. index($list, $value) function: This function returns the element at the specific index position called by value.
    • Example:
      filter_none

      edit
      close

      play_arrow

      link
      brightness_4
      code

      index((5 6 4 2 3 9 7), 4)

      chevron_right

      
      

    • Output:
      2
  7. length($list) function: This function returns the number of elements in the list.
    • Example:
      filter_none

      edit
      close

      play_arrow

      link
      brightness_4
      code

      length(5 4 6 7 8 9 1)

      chevron_right

      
      

    • Output:
      7
  8. is-bracketed($list) function: This function checks whether the list has any square brackets or not.
    • Example 1:
      filter_none

      edit
      close

      play_arrow

      link
      brightness_4
      code

      is-bracketed([a b c])

      chevron_right

      
      

    • Output:
      true
    • Example 2:
      filter_none

      edit
      close

      play_arrow

      link
      brightness_4
      code

      is-bracketed(a b c)

      chevron_right

      
      

    • Output:
      false
  9. append($list1, $val, [$separator]) function: This function appends a single value provided to the end of the list. If the separator argument is provided (“auto” being the default separator), the complete list will follow the separator function.
    • Example 1:
      filter_none

      edit
      close

      play_arrow

      link
      brightness_4
      code

      append((1, 2, 3), 4, comma)

      chevron_right

      
      

    • Output:
      (1, 2, 3, 4)
    • Example 2:
      filter_none

      edit
      close

      play_arrow

      link
      brightness_4
      code

      append((1, 2, 3), 4, space)

      chevron_right

      
      

    • Output:
      (1 2 3 4)



My Personal Notes arrow_drop_up

Check out this Author's contributed articles.

If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.


Article Tags :

1


Please write to us at contribute@geeksforgeeks.org to report any issue with the above content.