Built-in list functions in SASS - Cheat Sheet & Quick Revision

Recall & Review

beginner

What does the length() function do in Sass lists?

It returns the number of items in a list. For example, length(1 2 3) returns 3.

beginner

How do you get the first item of a list in Sass?

Use the nth() function with index 1. For example, nth(10 20 30, 1) returns 10.

intermediate

What does the join() function do in Sass?

It combines two lists into one. For example, join(1 2, 3 4) returns 1 2 3 4.

intermediate

Explain the difference between append() and join() in Sass lists.

append() adds a single item to the end of a list, while join() combines two lists into one longer list.

beginner

How can you check if a list is empty in Sass?

Use length() and check if it returns 0. For example, length(()) == 0 means the list is empty.

What does length(10 20 30) return in Sass?

A 30

B 3

C 10

D Error

length() returns the number of items in the list, which is 3 here.

Which function gets the second item from a list in Sass?

A append()

B length()

C join()

D nth()

nth() returns the item at the given index.

What does join(1 2, 3 4) produce?

A Error

B 1 2

C 1 2 3 4

D 3 4

join() combines two lists into one.

How do you add a single item to the end of a list in Sass?

A append()

B join()

C length()

D nth()

append() adds one item to the end of a list.

What does length(()) return?

A 0

B 1

C Error

D null

An empty list has length 0.

Describe how to get the third item from a Sass list and how to find out how many items it has.

Think about how you count items and pick one by position.

Explain the difference between append() and join() when working with Sass lists.

One adds a single item, the other merges lists.