---
description: 값 유형 분석 후, 숫자 또는 문자 값 반환 유틸리티 함수
---

# get-number-or-string()

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

전달 받은 값을 분석한 후, 숫자 또는 문자 값을 반환 받아야 할 경우 사용합니다. (`0`을 제외한 숫자 값은 `px` 값 반환)

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

값을 `get-number-or-string()` 함수에 전달하면 유형 분석 후, 숫자 또는 문자 값을 반환합니다.

> get-number-or-string($value:\[**number, string]**) → **number**

```javascript
@debug get-number-or-strin(34);   // → 34px 반환
@debug get-number-or-strin(auto); // → auto 반환
```

| 매개변수(parameter) |      유형(type)     | 필수(required) | 기본 값(default) |
| :-------------: | :---------------: | :----------: | :-----------: |
|      $value     | \[number, string] |      ✔︎      |               |

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

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

```javascript
@function get-number-or-string($value) {
  @return if(type-of($value) == 'number', unitless-px($value), $value);
}
```

1. 전달 받은 값의 유형이 숫자일 경우, [unitless-px()](unitless-px) 믹스인에 값을 전달 호출
2. 전달 받은 값의 유형이 문자일 경우, 전달 받은 값을 그대로 반환

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

유틸리티 함수 로직에 사용된 Sass의 빌트인 모듈은 다음과 같습니다.

* [@function](https://sass-lang.com/documentation/at-rules/function)
* [if()](https://sass-lang.com/documentation/modules#if)
* [type-of()](https://sass-lang.com/documentation/modules/meta#type-of)

유틸리티 함수 로직에 사용된 자체 제작 모듈은 다음과 같습니다.

* [unitless-px()](unitless-px)
