上一节:
下一节:

  Stylus 哈希

  • 定义和使用

    在 Stylus 在 0.39.0 版本中增加了对哈希对象的支持。
    可以使用大括号来定义哈希对象并用冒号来区分键和值： 
    foo = {
  bar: baz,
  baz: raz
}
    键应该是恰当的标识或字符串： 
    foo = {
   bar: baz,
  'baz': raz,
  '0': raz
}
    当你已经有一个哈希对象时，你可以使用方括号和字符串来为其赋值： 
    foo = {}
foo['bar'] = baz
foo['baz'] = raz
    请注意，虽然不能在花括号定义中使用变量或插值，但可以在方括号内使用变量： 
    foo = {}
bar = 'baz'
foo[bar] = raz

foo.baz
// => raz

  • 取值

    利用点操作符加标识符的方式可以从哈希对象中获取值：
    一个很简单的例子：创建一个两数相加的函数。 
    foo = { bar: "baz" }
foo.bar
// => "baz"
    或者使用方括号和字符串的方式： 
    foo = { "%": 10 }
baz = "%"

foo[baz]
// => 10
    你可以使用任何组合方式： 
    foo = {
  bar: {
    baz: {
      raz: 10px
    }
  }
}

qux = "raz"
foo["bar"].baz[qux]
// => 10px

  • 插值

    在插值中使用哈希对象的话将以 CSS 的形式输出哈希对象的内容（虽然算不上是 Stylus 的任何功能）：
    一个很简单的例子：创建一个两数相加的函数。 
    foo = {
  width: 10px,
  height: 20px,
  '&:hover': {
    padding: 0

  }
}

.bar
  {foo}

// => .bar {
//      width: 10px;
//      height: 20px;
//    }
//    .bar:hover {
//      padding: 0;
//    }

  • 其他操作

    您可以将 Stylus 中的其他普通操作应用到哈希对象上，例如 length()：
    一个很简单的例子：创建一个两数相加的函数。 
    foo = { bar: 'a', baz: 'b' }
length(foo)
// => 2
    你可以遍历哈希对象，key 参数是可选的： 
    foo = { width: 10px, height: 20px }

for key, value in foo
  {key}: value

// => width: 10px;
//    height: 20px;
    可以使用 in 来检查哈希对象中是否存在某个键： 
    foo = { bar: 10px}

bar in foo
// => true

baz in foo
// => false
    可以使用相应的内置函数来获取哈希对象的所有键或所有值： 
    foo = { bar: 10px}

bar in foo
// => true

baz in foo
// => falsefoo = { bar: 'a', baz: 'b' }

keys(foo)
// => 'bar' 'baz'

values(foo)
// => 'a' 'b'
    你可以使用内置函数 remove 从哈希对象中删除一个键： 
    obj = { foo: 1, bar: 2 }
remove(obj, 'foo')
// => {"bar":"(2)"}
    你还可以使用 merge （别名为 extend）函数来合并哈希对象： 
    obj = {
  foo: 'foo'
  bar: 'bar'
}

obj2 = {
  baz: 'baz'
}

merge(obj, obj2)
// => {"foo":"('foo')","bar":"('bar')","baz":"('baz')"}
上一节:
下一节: