zoukankan      html  css  js  c++  java
  • Sass基本数据类型和各类型的原生方法

    数据类型:

    数字: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

  • 相关阅读:
    fzyjojP2931 乱搞
    bzoj3730. 震波
    禁用DRM
    [学习笔记]替罪羊树
    Oracle数据库升级前必要的准备工作
    [NOI2012]骑行川藏
    oracle补丁类型
    IOI2018题解
    Oracle的Central Inventory和Local inventory详解
    CodeCraft-19 and Codeforces Round #537 (Div. 2)
  • 原文地址:https://www.cnblogs.com/lantuoxie/p/7614187.html
Copyright © 2011-2022 走看看