数据类型:
数字:1,2,3,11,10px (可以带单位)
字符串:"asd",'asd',asd (有引号和无引号都是字符串类型) 如 $name : zhang san ; $name是一个字符串
颜色:blue,#fff,rgba(0,0,0,1);
布尔值:true,false
空值:null
数组:10px 10px 10px 10px 或者 10px,10px,10px,10px 最好用括号"()"包起来区分数据类型 如(10px,10px,10px,10px)
maps:(key1:value1 , key2:value2) 类似js的Map数据结构,可以用Object来理解 竟然和js的Map数据结构相识,其值的获取和添加都是用函数来处理的
更多函数:http://sass-lang.com/documentation/Sass/Script/Functions.html#list_separator-instance_method
Sass一些原生数据类型的方法:
List类型的方法:
length($list) :返回数组的长度
nth($list,$index) : 根据$index来获取数组$list的元素
set-nth($list,$index,$value) : 根据$index来替换数组$list中原来的值为$value
join($list1,$list2,) : 将2个数组合并成一个数组 join((1px,1px),(2px,2px)) => (1px,1px,2px,2px)
append($list,$vlaue) : 给数组添加值类似js数组的push
zip($lists...) : 主要作用如 zip( (a,b,c) , (1,2,3) , ("a","b","c") , (1px,2px,3px)) => ( (a,1,"a",1px) , (b,2,"b",2px) , (c,3,"c",3px))
index($list,$value) : 根据值来查找index
Maps类型的方法:
map-get($map,$key) : 根据键名获取值
map-merge($map1,$map2) : map合并,如果$map2的属性和$map1的相同,会用$map2的替换掉$map1的,不相同的属性只是添加,然后返回一个新的map类型的数据
map-remove($map,$keys...) : 根据键名 来删除map结构的值 ,支持传入多个键名,一次删除多个
map-keys($map) : 相当于js 中的Object.keys
map-values($map) : 相当于js中的Object.values
map-has-key($map,$key) :判断$map是否有$key这一属性
数字类型的方法:
percentage($number) : 将一数字类型转为带百分数 如 percentage(0.1) => 10% percentage(10) => 1000%
round($number) : Math.round
ceil($number) : Math.ceil
floor($number) : Math.floor
abs($number) :Math.abs
min($number): Math.min
max($number):Math.max
random(): Math.random
字符串类型的方法:
unquote($str) : 去掉引号 unquote("asd") => asd
quote($str) : 添加引号 quote(asd) => "asd"
str-length($str) : "asd".length
str-insert($str,$insert,$index) : 根据$index,把$insert插入到$str中$index的后面
str-index($str,$subString) : 根据$subString 查找 $subString在$str那个位置 返回index 参考js 的 String.prototype.indexOf
str-slice($str,$start,$end) : 参考js 的 slice
to-upper-case($str) : 转为大写字符
to-lower-case($str) :转为小写字符
还有一些封装的有用的函数:
comparable($num1,$num2) :判断两个数字类型能否进行四则运算和比较
unit($number) :返回一个数字类型的单位 如unit(10px) => "px" unit(10) => "" 就是获取单位
unitless($number) : 判断是不是数字类型,不管有没有单位返回true或者false
type-of($value) : 返回传入的数据的类型 相当于js中的 typeof
if($condition,$if-true,$if-false) : 相当于三元运算符 condition ? true : false 如 if(true,1px,2px) => 1px