Tutorialsteacher

Follow Us

Sass - Map Functions

Remember that in Sass the map data type represents one or more key value pairs. In addition to the map-specific functions in the table below, you can use any of the list functions with maps as well; the map will be treated as a set of two-element lists:

nth(("red": #ff0000, "green": #00ff00), 2) //returns ("green" #00ff00)

Like lists, Sass maps are immutable. The map functions that return a map return a new map; they do not change the original arguments.

FunctionDescriptionExamples
map-get($map, $key)Returns the value associated with the specified keymap-get(("red": #ff0000, "green": #00ff00), "green")

Result:
#00ff00
map-merge($map1, $map2)Returns a map containing $map2 appended to the end of $map1map-merge(("red": #ff0000, "green": #00ff00), ("blue": #0000ff)

Result:
("red": #ff0000, "green": #00ff00, "blue": #0000ff)
map-remove($map, $keys)Returns a map without the specified keysmap-remove(("red": #ff0000, "green": #00ff00), "red")

Result:
("green": #00ff00)
map-keys($map)Returns a list of the keys in the specified mapmap-keys(("red": #ff0000, "green": #00ff00))

Result:
("red", "green")
map-values($map)Returns a list of the values in the specified mapmap-values(("red": #ff0000, "green": #00ff00))

Result:
(#ff0000, #00ff00)
map-has-key($map, $key)Returns a Boolean value indicating whether the specified map contains the specified keymap-has-key(("red": #ff0000, "green": #00ff00), blue)

Result:
false