不想依赖compass的编译器,但sass的又没有compact方法,于是自己造轮子。最早时在stackoverflow看到一个

@function compact($var-1,        $var-2: false,
$var-3: false, $var-4: false,
$var-5: false, $var-6: false,
$var-7: false, $var-8: false,
$var-9: false, $var-10: false) {
$full: $var-1;
$vars: $var-2, $var-3, $var-4, $var-5,
$var-6, $var-7, $var-8, $var-9, $var-10; @each $var in $vars {
@if $var {
$full: $full, $var;
}
}
@return $full;
} .aaa {
content: compact(1,2, null,7, 0 ,44);
}

这里有一个神奇的用法,如何将一个个元素串起一个数组($full: $full, $var

不过太怪了,@if又不写小括号,有点像ruby。更奇怪的是,它的@if不会过滤0。下面是我造的轮子,改动不大。


@function compact($var-1,      $var-2: false,
$var-3: false, $var-4: false,
$var-5: false, $var-6: false,
$var-7: false, $var-8: false,
$var-9: false, $var-10: false) {
$full:();
$vars: $var-1, $var-2, $var-3, $var-4, $var-5,
$var-6, $var-7, $var-8, $var-9, $var-10; @each $var in $vars {
@if ($var){
$full : append($full, $var, comma);
}
}
@return $full;
} .aaa {
content: compact(1,2, null,7, 0 ,44);
}

轮子3,使用可变长参数,节省大量代码。轮子越造越好,超越老外了。


@function compact($args...) {
$ret: ();
@each $i in $args{
@if($i){//if 不会过滤0
$ret: append($ret, $i, comma);
}
}
@return $ret;
} .aaa {
content: compact(blue, red, false, green);
}

sass compact方法的实现的更多相关文章

  1. 关于面试题 Array.indexof() 方法的实现及思考

    这是我在面试大公司时碰到的一个笔试题,当时自己云里雾里的胡写了一番,回头也曾思考过,最终没实现也就不了了之了. 昨天看到有网友说面试中也碰到过这个问题,我就重新思考了这个问题的实现方法. 对于想进大公 ...

  2. 2016 - 2 - 19 ARC内存管理知识总结(一,arc基本概念及alloc等方法的实现)

    一. ARC的基本概念 1. 在objc中采用automatic reference counting 机制, 让编译器来进行内存管理.在降低程序崩溃,内存管理泄漏等风险的同时,很大程度减少了程序员的 ...

  3. 05_动手动脑之String.equals()方法的实现代码

    Question: 请查看String.equals()方法的实现代码,注意学习其实现方法. Answer: java中的String.equals()方法的实现代码: equals()法是根类Obj ...

  4. Atitit paip.对象方法的实现原理与本质.txt

    Atitit paip.对象方法的实现原理与本质.txt 对象方法是如何实现的1 数组,对象,字典1 对象方法是如何实现的 这显然是一个对象方法调用.但对象方法是如何实现的呢?在静态语言中,因为有编译 ...

  5. matchesSelector及低版本IE中对该方法的实现

    matchesSelector用来匹配dom元素是否匹配某css selector.它为一些高级方法的实现提供了基础支持,比如事件代理,parent, closest等. W3C在2006年就提出了该 ...

  6. 动手动脑之查看String.equals()方法的实现代码及解释

    动手动脑 请查看String.equals()方法的实现代码,注意学习其实现方法. 第一个是false,后三个是true. package stringtest; public class Strin ...

  7. OC:属性的内部实现原理、dealloc内释放实例变量、便利构造器方法的实现原理、collection的内存管理

    代码: // // main.m #import <Foundation/Foundation.h> #import "Person.h" #import " ...

  8. java集合的contains(obj)方法的实现

    在实际项目中我们通常会有一个需求就是:想知道在一个列表中是否包含某一个对象 这里ArrayList表.HashSet表和HashMap表都提供了一个contains(obj)方法, 下面说一下两个列表 ...

  9. [转]原生JS-查找相邻的元素-siblings方法的实现

    在针对element的操作里,查找附近的元素是一个不可少的过程,比如在实现tab时,其中的一个div增加了“on”class,其他的去除“on”class.如果用jquery的朋友就肯定不会陌生sib ...

随机推荐

  1. javascript中new Date()会存在偏差一小时的bug

    事件回顾: 因为我们的产品会有与时间转换这部分,并且流量主要集中在小程序. emmm~  获取用户出生的年/月/日/时  我们和后台协商的是换算用户选择后的时间为  年/月/日/时/分/秒  所以我们 ...

  2. epoint:TreeView

    Epoint.Web.UI.WebControls2X.EpointTreeNode 思路:就是使用递归 RootNodeText 根节点名称RootNodeUrl 根节点路径ShowRootNode ...

  3. ASPX 后台调用前台Js

    1.UpdatePanel 使用中 protected void Button1_Click(object sender, EventArgs e) { this.Label1.Text = &quo ...

  4. 解决Jenkins权限配置错误,导致登录时出现没有Overall/read权限

    问题 由于初次接触jenkins,于是在搭建好jenkins以后,想要对用户进行管理,于是乎开始在系统管理->configure Global Security里设置用户的权限. 在启用安全-& ...

  5. 20181009-7 选题 Scrum立会报告+燃尽图 06

    Scrum立会报告+燃尽图(06)选题 此作业要求参见:https://edu.cnblogs.com/campus/nenu/2018fall/homework/2196 一.小组介绍 组长:刘莹莹 ...

  6. HTML学习3---排版标记

    上节,我们学习了boda常用的属性以及HTML的一些标记,但是图显示的效果却不是那么的好看. 原因就是没有排版好,我们这次使用居中来使这个页面更好看一点,顺便多加入几个别的标记. HTML排版标记 ( ...

  7. java日常知识点积累

    java类型中的普通非static方法 示例代码: package com.lvzhi; /** * Created by lvzhi on 2017/9/3 */ public class MyTh ...

  8. 递归遍历嵌套结构(多层List)中的元素 ------Python

    读Python基础教程(第二版)后看到了这么一个东西,就是利用递归遍历嵌套结构中的元素. 上代码: #encoding:UTF-8 def flatten(nested): try: #不要迭代类似字 ...

  9. CF1061F:Lost Root(交互&概率)

    The graph is called tree if it is connected and has no cycles. Suppose the tree is rooted at some ve ...

  10. Idea 使用 Maven 搭建 Web 项目

    传送门: 袁咩咩的小小博客 Maven项目对象模型(POM),可以通过一小段描述信息来管理项目的构建,报告和文档的软件项目管理工具. 使用它来搭建项目可以省去很多操作,它不仅有依赖管理.自动生成项目站 ...