Course Progress 94%

Sass Introspection Functions

Sass Introspection Functions क्या होता है?

Sass Introspection Functions का उपयोग Sass के अंदर मौजूद data और environment की जानकारी निकालने के लिए किया जाता है। ये functions यह जानने में मदद करती हैं कि कोई value किस type की है, किसी variable या mixin का existence है या नहीं, और Sass compiler किन features को support करता है।

Beginner के लिए आसान भाषा में:

  • Introspection का मतलब है “खुद के code को जांचना”
  • ये functions debugging और safe coding में मदद करती हैं
  • Conditional logic लिखना आसान हो जाता है

Sass Introspection Functions का उपयोग बड़े और scalable projects में ज्यादा किया जाता है, जहां error से बचना और flexible code लिखना जरूरी होता है।

type-of() Function

type-of() क्या करता है

type-of() function किसी value का data type बताता है।

Syntax

type-of(value)

Example

$value: 10px;

.result {
  content: type-of($value);
}

Explanation

इस code में:

  • $value की value 10px है
  • type-of() यह check करता है कि यह किस type की value है

Sass में 10px एक number type है।

Compile होने पर result value number होगी।

यह function इसलिए उपयोगी है क्योंकि Sass में number, string, color, list, map जैसे अलग-अलग types होते हैं, और logic उसी के अनुसार apply किया जा सकता है।

unit() Function

unit() क्या करता है

unit() function किसी number value की unit return करता है।

Syntax

unit(number)

Example

$value: 20px;

.result {
  content: unit($value);
}

Explanation

यहां:

  • $value में 20px है
  • unit() function px return करता है

Result में output px होगा।

यह function तब उपयोगी होता है जब unit check करके calculation करनी हो।

unitless() Function

unitless() क्या करता है

unitless() function check करता है कि number के साथ unit है या नहीं।

Syntax

unitless(number)

Example

$value: 5;

.result {
  content: unitless($value);
}

Explanation

इस example में:

  • $value एक plain number है
  • इसके साथ कोई unit नहीं है

unitless() function true return करेगा।

अगर value 5px होती, तो result false होता।

यह function validation और safe calculations के लिए उपयोगी है।

comparable() Function

comparable() क्या करता है

comparable() function check करता है कि दो numbers आपस में compare किए जा सकते हैं या नहीं।

Syntax

comparable(number1, number2)

Example

$result: comparable(10px, 2em);

Explanation

यह function:

  • check करता है कि px और em units compare हो सकते हैं या नहीं

क्योंकि ये अलग-अलग units हैं, result false होगा।

अगर दोनों values px में होतीं, तो result true होता।

यह function mathematical operations से पहले safety check के लिए उपयोगी है।

inspect() Function

inspect() क्या करता है

inspect() function किसी भी Sass value को readable string में convert करता है।

Syntax

inspect(value)

Example

$colors: (primary: blue, secondary: green);

.result {
  content: inspect($colors);
}

Explanation

यह function:

  • map को readable string में बदल देता है

Result कुछ इस तरह होगा:

(primary: blue, secondary: green)

यह function debugging और output check करने के लिए बहुत useful होता है।

variable-exists() Function

variable-exists() क्या करता है

variable-exists() function check करता है कि कोई variable current scope में मौजूद है या नहीं।

Syntax

variable-exists(variable-name)

Example

$primary-color: blue;

$result: variable-exists(primary-color);

Explanation

यह function:

  • check करता है कि $primary-color variable defined है या नहीं

Result true होगा।

अगर variable define नहीं होता, तो result false होता।

यह function error-free code लिखने में मदद करता है।

global-variable-exists() Function

global-variable-exists() क्या करता है

global-variable-exists() function check करता है कि कोई variable global scope में मौजूद है या नहीं।

Syntax

global-variable-exists(variable-name)

Example

$result: global-variable-exists(primary-color);

Explanation

यह function:

  • global level पर variable की availability check करता है

यह function modular Sass files में बहुत useful होता है।

function-exists() Function

function-exists() क्या करता है

function-exists() function check करता है कि कोई Sass function defined है या नहीं।

Syntax

function-exists(function-name)

Example

$result: function-exists(lighten);

Explanation

यह function:

  • check करता है कि lighten() function Sass में मौजूद है या नहीं

Result true होगा।

यह function custom और built-in functions के validation के लिए उपयोगी है।

mixin-exists() Function

mixin-exists() क्या करता है

mixin-exists() function check करता है कि कोई mixin defined है या नहीं।

Syntax

mixin-exists(mixin-name)

Example

$result: mixin-exists(border-radius);

Explanation

यह function:

  • check करता है कि border-radius नाम का mixin मौजूद है या नहीं

Result availability के अनुसार true या false होगा।

यह function reusable mixins के safe usage में मदद करता है।

feature-exists() Function

feature-exists() क्या करता है

feature-exists() function check करता है कि Sass compiler कोई specific feature support करता है या नहीं।

Syntax

feature-exists(feature-name)

Example

$result: feature-exists(global-variable-shadowing);

Explanation

यह function:

  • compiler feature availability check करता है

Result true या false होगा।

यह function backward compatibility और advanced Sass features के लिए उपयोगी है।

Sass Introspection Functions List

Function NameDescription
type-of()value का type बताता है
unit()number की unit return करता है
unitless()unit मौजूद है या नहीं check करता है
comparable()numbers compare हो सकते हैं या नहीं बताता है
inspect()value को readable string बनाता है
variable-exists()variable की availability check करता है
global-variable-exists()global variable check करता है
function-exists()function की existence check करता है
mixin-exists()mixin की availability check करता है
feature-exists()Sass feature support check करता है

Sass Introspection Functions का Practical Use

Sass Introspection Functions का उपयोग real-world projects में:

  • Error-free और defensive coding के लिए
  • Modular Sass architecture में
  • Large projects में debugging के लिए
  • Conditional logic और safe calculations के लिए

इस chapter को पढ़ने के बाद beginner-level user Sass Introspection Functions को समझकर advanced लेकिन safe और professional Sass code लिख सकता है।