Stylus強大之處就在于其內(nèi)置的語言函數(shù)定義。其定義與混入(mixins)一致;卻可以返回值。
很簡單的例子,兩數(shù)值相加的方法:
add(a, b)
a + b
我們可以在特定條件下使用該方法,如在屬性值中:
body
padding add(10px, 5)
渲染:
body {
padding: 15px;
}
可選參數(shù)往往有個默認的給定表達。在Stylus中,我們甚至可以超越默認參數(shù)。
例如:
add(a, b = a)
a + b
add(10, 5)
// => 15
add(10)
// => 20
注意:因為參數(shù)默認是賦值,我們可可以使用函數(shù)調(diào)用作為默認值。
add(a, b = unit(a, px))
a + b
我們可以把簡單的add()方法更進一步。通過內(nèi)置unit()把單位都變成px, 因為賦值在每個參數(shù)上,因此,我們可以無視單位換算。
add(a, b = a)
a = unit(a, px)
b = unit(b, px)
a + b
add(15%, 10deg)
// => 25
Stylus的函數(shù)可以返回多個值,就像你給變量賦多個值一樣。
例如,下面就是一個有效賦值:
sizes = 15px 10px
sizes[0]
// => 15px
類似的,我們可以在函數(shù)中返回多個值:
sizes()
15px 10px
sizes()[0]
// => 15px
有個小小的例外就是返回值是標識符。例如,下面看上去像一個屬性賦值給Stylus(因為沒有操作符)。
swap(a, b)
b a
為避免歧義,我們可以使用括號,或是return關鍵字。
swap(a, b)
(b a)
swap(a, b)
return b a
比方說,我們想要創(chuàng)建一個名為stringish()的函數(shù),用來決定參數(shù)是否是字符串。我們檢查val是否是字符串或縮進(類似字符)。如下,使用yes和no代替true和false.
stringish(val)
if val is a 'string' or val is a 'ident'
yes
else
no
使用:
stringish('yay') == yes
// => true
stringish(yay) == yes
// => true
stringish(0) == no
// => true
注意:yes和no并不是布爾值。本例中,它們只是簡單的未定義標識符。
另外一個例子:
compare(a, b)
if a > b
higher
else if a < b
lower
else
equal
使用:
compare(5, 2)
// => higher
compare(1, 5)
// => lower
compare(10, 10)
// => equal
給函數(shù)起個別名,和簡單,直接等于就可以了。例如上面的add()弄個別名plus(), 如下:
plus = add
plus(1, 2)
// => 3
我們可以把函數(shù)當作變量傳遞到新的函數(shù)中。例如,invoke()接受函數(shù)作為參數(shù),因此,我們可以傳遞add()以及sub().
invoke(a, b, fn)
fn(a, b)
add(a, b)
a + b
body
padding invoke(5, 10, add)
padding invoke(5, 10, sub)
結果:
body {
padding: 15;
padding: -5;
}
arguments是所有函數(shù)體都有的局部變量,包含傳遞的所有參數(shù)。
例如:
sum()
n = 0
for num in arguments
n = n + num
sum(1,2,3,4,5)
// => 15
下面,我們定義get(hash, key)方法,用來返回key值或null. 我們遍歷每個鍵值對,如果鍵值匹配,返回對應的值。
get(hash, key)
return pair[1] if pair[0] == key for pair in hash
下面例子可以證明,語言函數(shù)模樣的Stylus表達式具有更大的靈活性。
hash = (one 1) (two 2) (three 3)
get(hash, two)
// => 2
get(hash, three)
// => 3
get(hash, something)
// => null
更多建議: