> For the complete documentation index, see [llms.txt](https://yamoo9.gitbook.io/scss-mixins/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://yamoo9.gitbook.io/scss-mixins/utilities/list/last.md).

# last()

## 용도 <a href="#use" id="use"></a>

리스트(list) 아이템 중 마지막 아이템을 손쉽게 추출하고자 할 때 사용합니다.

## 사용법 <a href="#usage" id="usage"></a>

`last()` 함수에 리스트(list)를 전달합니다.

> last($list:**list**) → **any**

```css
$direction: left bottom right top;

@debug last($direction); // top (리스트의 마지막 아이템) 반환
```

| 매개변수(parameter) | 유형(type) | 필수(required) | 기본 값(default) |
| :-------------: | :------: | :----------: | :-----------: |
|      $list      |   list   |      ✔︎      |               |

맵(map)에서 키(key) 값을 아이템으로 하는 리스트(list)를 반환 받아, 마지막 아이템을 추출하는 예시

```css
@debug last(map-keys($colors)); // gray (마지막 컬러 이름) 반환
```

## 로직 <a href="#logic" id="logic"></a>

`last()` 유틸리티는 다음의 로직에 의해 작성되었습니다.&#x20;

```javascript
@function last($list) {
  @return nth($list, length($list));
}
```

1. 전달 받은 리스트의 총 개수(length)를 구한 후
2. 리스트의 마지막 아이템 추출&#x20;
3. 추출한 아이템 값을 반환

## 참고 <a href="#reference" id="reference"></a>

유틸리티 함수 로직에 사용된 Sass:list 함수는 다음과 같습니다.

* [nth()](https://sass-lang.com/documentation/modules/list#nth)
* [length()](https://sass-lang.com/documentation/modules/list#length)

{% hint style="info" %}
Sass의 List 자료형(Data Type)은 JavaScript의 Array와 유사합니다.
{% endhint %}

{% embed url="<https://sass-lang.com/documentation/modules/list>" %}
