SASS | Map Functions

SASS | Map Functions

Last Updated : 11 May, 2020

The SASS Map data-type is used to display one or more key-value pairs. Along with the map functions shown in the below lists, you can also use any of the SASS list functions with maps as well. The following lists contains all map functions in SASS:

map-has-key($map, $key) function: This function returns a Boolean value that checks whether the given map contains the given key or not.
- Example:
  CSS
  map-has-key(("red": #ff0000, "yellow": #ffff00), blue)
- Output:
```
false
```

map-merge($map1, $map2) function: This function returns a map containing $map2 joined to the end of $map1.

Example:

CSS

      map-merge(("red": #ff0000, "yellow": #ffff00), ("blue": #0000ff)

Output:

("red": #ff0000, "yellow": #ffff00, "blue": #0000ff)

map-keys($map) function: This function returns the list of the keys in the given map.
- Example:
  CSS
  map-keys(("red": #ff0000, "yellow": #ffff00))
- Output:
```
("red", "yellow")
```

map-remove($map, $keys) function: This function returns a map without the given keys.

Example:

CSS

      map-remove(("red": #ff0000, "yellow": #ffff00), "red")

Output:
```
("yellow": #ffff00)
```

map-values($map) function: This function returns the list of the values in the given map.
- Example:
  CSS
  map-values(("red": #ff0000, "yellow": #ffff00))
- Output:
```
(#ff0000, #ffff00)
```
map-get($map, $key) function: This function returns the value associated with the given key.
- Example:
  CSS
  map-get(("blue": #0000ff, "yellow": #ffff00), "blue")
- Output:
```
#0000ff
```

SASS | Map Functions

S

Slash_IT

Improve

Article Tags :

Similar Reads

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

SASS | Numeric Functions

Just like the SASS string functions, SASS gives a simple set of functions for changing the numeric values, and these values work the way you'd like them to. Note that one can give CSS value descriptors such as "px" or "rem" to every function except "percentage()". In that case, SASS will ignore the

Sass @function Rule

Functions can define complex operations on SassScript values that can be reused throughout the stylesheet. It makes it easier to abstract out the common formulas and behaviors in some readable way. Functions can be defined using @function at-rule. Syntax: html @function <function name>(<arg

SASS | Color Functions

Color Components: Before we move to the SASS color functions, let's make sure we know the elements of color that they change. The simple color theory divides any color into three basic components: hue, saturation, and value. HUE (also called "local color") is generally the color that we talk about.

SASS | String Functions

SASS string functions are quite similar to the string functions of any other programming language with only a single difference i.e. the SASS strings use 1 based indexing. It means the first character of the SASS string is stored at index 1 (not 0).We have created a table that contains the list of a

SASS | Introspection Functions

SASS Introspection functions allow you to inspect the conditions of SASS itself. You can not use them when you are making stylesheets, but they're crucial for knowing what is going on when something does not work according to the way that you want. The following table contains all introspection func

SASS | Selector Functions

The selector functions help in checking and changing the CSS selectors in the style-sheet. All of the functions except selector-nest() prevents the use of the parent selector. selector-nest($selectors...): This method returns a new selector containing a nested list of CSS selectors based on the list

SASS Introduction

Sass is the short form of Syntactically Awesome Style Sheet. It is an upgrade to CSS. Cascading Style Sheets (CSS) serve as the foundation of web styling, dictating the visual aesthetics and layout of websites. However, as web development projects increase in complexity, managing CSS files can becom

PHP | DsDeque map() Function

The Ds\Deque::map() function is an inbuilt function in PHP which is used to return the Deque with each element modified on the basis of operation performed as per the callback function. Syntax: public Ds\Deque::map( $callback ) : Ds\Deque Parameters: This function accepts single parameter $callback

PHP | DsMap values() Function

The Ds\Map::values() function is an inbuilt function in PHP which is used to return a sequence of the map's values. Syntax: Ds\Sequence public Ds\Map::values ( void ) Parameters: This function does not accepts any parameters. Return Value: It returns a Ds\Sequence containing all the values of the ma