Maps (NEW!)

发布于 v3.5.0

#### 使用规则集和 mixins 作为值映射
通过将名称间距与查找 `[]` 语法相结合，可以将 规则集/mixins 转化为映射。

```less
@sizes: {
  mobile: 320px;
  tablet: 768px;
  desktop: 1024px;
}

.navbar {
  display: block;

@media (min-width: @sizes[tablet]) {
    display: inline-block;
  }
}
```
输出：

```less
.navbar {
  display: block;
}
@media (min-width: 768px) {
  .navbar {
    display: inline-block;
  }
}
```
由于有了命名间隔和重载 mixins 的功能，mixins 作为映射的用途更广泛一些。

```less
#library() {
  .colors() {
    primary: green;
    secondary: blue;
  }
}

#library() {
  .colors() { primary: grey; }
}

.button {
  color: #library.colors[primary];
  border-color: #library.colors[secondary];
}
```
输出：

```less
.button {
  color: grey;
  border-color: blue;
}
```
您也可以通过别名 mixins 来简化这一过程。也就是说

```less
.button {
  @colors: #library.colors();
  color: @colors[primary];
  border-color: @colors[secondary];
}
```
注意，如果查找值产生了另一个规则集，则可以追加第二个 `[]` 查找值，如图所示：

```less
@config: {
  @options: {
    library-on: true
  }
}

& when (@config[@options][library-on] = true) {
  .produce-ruleset {
    prop: val;
  }
}
```

通过这种方式，规则集和变量调用可以模拟一种 "namespacing"，类似于 mixins。

至于是使用 mixins 还是使用分配给变量的规则集作为映射，这取决于你。你可能想通过重新声明分配给规则集的变量来替换整个映射。或者，你可能想 "merge" 单个键/值对，在这种情况下，混合元素作为映射可能更合适。

### 在查找中使用可变变量

需要注意的是，[`@lookup`]中的值是键名（变量名）`@lookup`，而不是作为变量来计算的。如果希望键名本身是变量，可以使用 `@@variable` 语法。

例如：

```less
.foods() {
  @dessert: ice cream;
}

@key-to-lookup: dessert;

.lunch {
  treat: .foods[@@key-to-lookup];
}
```
这将输出：

```less
.lunch {
  treat: ice cream;
}
```