Class Number

Sass's number type.

Hierarchy

  • Number

Index

Constructors

constructor

  • new Number(value: number, unit?: string): Number
  • example
    new sass.types.Number(0.5); // == 0.5
    new sass.types.Number(10, "px"); // == 10px
    new sass.types.Number(10, "px*px"); // == 10px * 1px
    new sass.types.Number(10, "px/s"); // == math.div(10px, 1s)
    new sass.types.Number(10, "px*px/s*s"); // == 10px * math.div(math.div(1px, 1s), 1s)

    Parameters

    • value: number

      The numeric value of the number.

    • Optional unit: string

      If passed, the number's unit.

      Complex units can be represented as <unit>*<unit>*.../<unit>*<unit>*..., with numerator units on the left-hand side of the / and denominator units on the right. A number with only numerator units may omit the / and the units after it, and a number with only denominator units may be represented with no units before the /.

    Returns Number

Methods

getUnit

  • getUnit(): string
  • Returns a string representation of this number's units. Complex units are returned in the same format that constructor accepts them.

    example
    // number is `10px`.
    number.getUnit(); // "px"

    // number is `math.div(10px, 1s)`.
    number.getUnit(); // "px/s"

    Returns string

getValue

  • getValue(): number
  • Returns the value of the number, ignoring units.

    ⚠️ Heads up!

    This means that 96px and 1in will return different values, even though they represent the same length.

    example
    const number = new sass.types.Number(10, "px");
    number.getValue(); // 10

    Returns number

setUnit

  • setUnit(unit: string): void

setValue

  • setValue(value: number): void