条件语句
条件语句为原本静态的语言提供了控制流,实现条件导入、混合器、函数等功能。下面的例子仅作示例,并不推荐 😃
if / else if / else
if
条件语句的工作方式正如你所期望的,只需接受一个表达式,当表达式为 true
时执行后续代码块。与 if
一起的还有典型的 else if
和 else
标记,作为备选方案。
下面的例子将有条件地重载 padding
属性,将其替换为 margin
。
stylus
overload-padding = true
if overload-padding
padding(y, x)
margin y x
body
padding 5px 10px
overload-padding = true
if overload-padding
padding(y, x)
margin y x
body
padding 5px 10px
另一个例子:
stylus
box(x, y, margin = false)
padding y x
if margin
margin y x
body
box(5px, 10px, true)
box(x, y, margin = false)
padding y x
if margin
margin y x
body
box(5px, 10px, true)
另一个 box()
辅助函数:
stylus
box(x, y, margin-only = false)
if margin-only
margin y x
else
padding y x
box(x, y, margin-only = false)
if margin-only
margin y x
else
padding y x
unless
对于熟悉 Ruby 编程语言的用户,我们提供了 unless
条件语句。它基本上是 if
的反面——本质上是 if (!(expr))
。
在下面的例子中,如果 disable-padding-override
是 undefined
或 false
,padding
将被重载,显示 margin
代替。但如果它是 true
,padding
将继续输出预期的 padding 5px 10px
。
stylus
disable-padding-override = true
unless disable-padding-override is defined and disable-padding-override
padding(x, y)
margin y x
body
padding 5px 10px
disable-padding-override = true
unless disable-padding-override is defined and disable-padding-override
padding(x, y)
margin y x
body
padding 5px 10px
后缀条件
Stylus 支持后缀条件。这意味着 if
和 unless
作为运算符;当右侧表达式为真时,它们会评估左侧操作数。
例如,让我们定义 negative()
来执行一些基本的类型检查。下面我们使用块风格的条件:
stylus
negative(n)
unless n is a 'unit'
error('invalid number')
if n < 0
yes
else
no
negative(n)
unless n is a 'unit'
error('invalid number')
if n < 0
yes
else
no
接下来,我们利用后缀条件使我们的函数更简洁。
stylus
negative(n)
error('invalid number') unless n is a 'unit'
return yes if n < 0
no
negative(n)
error('invalid number') unless n is a 'unit'
return yes if n < 0
no
当然,我们可以更进一步。例如,我们可以写 n < 0 ? yes : no
,或者简单地使用布尔值:n < 0
。
后缀条件可以应用于大多数单行语句。例如,@import
、@charset
、混合器——当然,还有下面所示的属性:
stylus
pad(types = margin padding, n = 5px)
padding unit(n, px) if padding in types
margin unit(n, px) if margin in types
body
pad()
body
pad(margin)
body
apply-mixins = true
pad(padding, 10) if apply-mixins
pad(types = margin padding, n = 5px)
padding unit(n, px) if padding in types
margin unit(n, px) if margin in types
body
pad()
body
pad(margin)
body
apply-mixins = true
pad(padding, 10) if apply-mixins
生成:
css
body {
padding: 5px;
margin: 5px;
}
body {
margin: 5px;
}
body {
padding: 10px;
}
body {
padding: 5px;
margin: 5px;
}
body {
margin: 5px;
}
body {
padding: 10px;
}