1 变量

我们常常在 CSS 中 看到同一个值重复多次，这样难易于代码维护。 理想状态，应是下面这样：

  1. const bgColor="skyblue";
  2. $(".post-content").css("background-color",bgColor);
  3. $("#wrap").css("background-color",bgColor);
  4. $(".arctive").css("background-color",bgColor);
  • 只要我们修改 bgColor这一个变量， 整个页面的背景颜色都会随之改变。
  • 而 Less 中的变量十分强大，可化万物，值得一提的是，其变量是常量 ，所以只能定义一次，不能重复使用。
1.1 值变量
  1.       /* Less */
  2.       @color: #;
  3.       @bgColor: skyblue;//不要添加引号
  4.       @width: %;
  5.       #wrap {
  6.         color: @color;
  7.         width: @width;
  8.       }
  9.  
  10.       /* 生成后的 CSS */
  11.       #wrap {
  12.         color: #;
  13.         width: %;
  14.       }

以 @ 开头 定义变量，并且使用时 直接 键入 @名称。

在平时工作中，我们就可以把 常用的变量 封装到一个文件中，这样利于代码组织维护。

  1.       @lightPrimaryColor: #c5cae9;
  2.       @textPrimaryColor: #fff;
  3.       @accentColor: rgb(, , );
  4.       @primaryTextColor: #;
  5.       @secondaryTextColor: #;
  6.       @dividerColor: #b6b6b6;
  7.       @borderColor: #dadada;
1.2 选择器变量

让 选择器 变成 动态

  1.     /* Less */
  2.       @mySelector: #wrap;
  3.       @Wrap: wrap;
  4.       @{mySelector}{ //变量名 必须使用大括号包裹
  5.         color: #;
  6.         width: %;
  7.       }
  8.       .@{Wrap}{
  9.         color:#ccc;
  10.       }
  11.       #@{Wrap}{
  12.         color:#;
  13.       }
  14.  
  15.       /* 生成的 CSS */
  16.       #wrap{
  17.         color: #;
  18.         width: %;
  19.       }
  20.       .wrap{
  21.         color:#ccc;
  22.       }
  23.       #wrap{
  24.         color:#;
  25.       }
1.3 属性变量

可减少代码书写量

  1.     /* Less */
  2.       @borderStyle: border-style;
  3.       @Soild:solid;
  4.       #wrap{
  5.         @{borderStyle}: @Soild;//变量名 必须使用大括号包裹
  6.       }
  7.  
  8.       /* 生成的 CSS */
  9.       #wrap{
  10.         border-style:solid;
  11.       }
1.4 url 变量

项目结构改变时，修改其变量即可。

  1.       /* Less */
  2.       @images: "../img";//需要加引号
  3.       body {
  4.         background: url("@{images}/dog.png");//变量名 必须使用大括号包裹
  5.       }
  6.  
  7.       /* 生成的 CSS */
  8.       body {
  9.         background: url("../img/dog.png");
  10.       }
1.5 声明变量

有点类似于 下面的 混合方法

  1.       - 结构: @name: { 属性: 值 ;};
  2.       - 使用：@name();
  3.  
  4.     /* Less */
  5.       @background: {background:red;};
  6.       #main{
  7.           @background();
  8.       }
  9.       @Rules:{
  10.           width: 200px;
  11.           height: 200px;
  12.           border: solid 1px red;
  13.       };
  14.       #con{
  15.         @Rules();
  16.       }
  17.  
  18.       /* 生成的 CSS */
  19.       #main{
  20.         background:red;
  21.       }
  22.       #con{
  23.         width: 200px;
  24.         height: 200px;
  25.         border: solid 1px red;
  26.       }
1.6 变量运算

不得不提的是，Less 的变量运算完全超出我的期望，十分强大。

  1.   - 加减法时 以第一个数据的单位为基准
  2.   - 乘除法时 注意单位一定要统一
  1.       /* Less */
  2.       @width:300px;
  3.       @color:#;
  4.       #wrap{
  5.         width:@width-;
  6.         height:@width-*;
  7.         margin:(@width-)*;
  8.         color:@color*;
  9.         background-color:@color + #;
  10.       }
  11.  
  12.       /* 生成的 CSS */
  13.       #wrap{
  14.         width:280px;
  15.         height:200px;
  16.         margin:1400px;
  17.         color:#;
  18.         background-color:#;
  19.       }
1.7 变量作用域

理解：就近原则包。

  1.       /* Less */
  2.       @var: @a;
  3.       @a: %;
  4.       #wrap {
  5.         width: @var;
  6.         @a: %;
  7.       }
  8.  
  9.       /* 生成的 CSS */
  10.       #wrap {
  11.         width: %;
  12.       }
1.8 用变量去定义变量
  1.       /* Less */
  2.       @fnord:  "I am fnord.";
  3.       @var:    "fnord";
  4.       #wrap::after{
  5.         content: @@var; //将@var替换为其值 content:@fnord;
  6.       }
  7.       /* 生成的 CSS */
  8.       #wrap::after{
  9.         content: "I am fnord.";
  10.       }

2 嵌套

2.1 & 的妙用

& ：代表的上一层选择器的名字，此例便是header。

  1.       /* Less */
  2.       #header{
  3.         &:after{
  4.           content:"Less is more!";
  5.         }
  6.         .title{
  7.           font-weight:bold;
  8.         }
  9.         &_content{//理解方式：直接把 & 替换成 #header
  10.           margin:20px;
  11.         }
  12.       }
  13.       /* 生成的 CSS */
  14.       #header::after{
  15.         content:"Less is more!";
  16.       }
  17.       #header .title{ //嵌套了
  18.         font-weight:bold;
  19.       }
  20.       #header_content{//没有嵌套！
  21.           margin:20px;
  22.       }
2.2 媒体查询

在以往的工作中，我们使用 媒体查询，都要把一个元素 分开写

  1.       #wrap{
  2.         width:500px;
  3.       }
  4.       @media screen and (max-width:768px){
  5.         #wrap{
  6.           width:100px;
  7.         }
  8.       }

Less 提供了一个十分便捷的方式

  1.       /* Less */
  2.       #main{
  3.           //something...
  4.  
  5.           @media screen{
  6.               @media (max-width:768px){
  7.                 width:100px;
  8.               }
  9.           }
  10.           @media tv {
  11.             width:2000px;
  12.           }
  13.       }
  14.       /* 生成的 CSS */
  15.       @media screen and (maxwidth:768px){
  16.         #main{
  17.             width:100px;
  18.         }
  19.       }
  20.       @media tv{
  21.         #main{
  22.           width:2000px;
  23.         }
  24.       }

唯一的缺点就是 每一个元素都会编译出自己 @media 声明，并不会合并。

2.3 实战技巧

可以借助 Less 在元素中，去定义自己的私有样式。

  1.       /* Less */
  2.       #main{
  3.         // something..
  4.         &.show{
  5.           display:block;
  6.         }
  7.       }
  8.       .show{
  9.         display:none;
  10.       }
  11.  
  12.       const main = document.getElementById("main");
  13.       main.classList.add("show");

结果：

  1.       #main.show{
  2.         display:block;
  3.       }
  4.       .show{
  5.         display:none; //会被覆盖。
  6.       }

3 混合方法

3.1 无参数方法

方法犹如 声明的集合，使用时 直接键入名称即可。

  1.       /* Less */
  2.       .card { // 等价于 .card()
  3.           background: #f6f6f6;
  4.           -webkit-box-shadow:  1px 2px rgba(, , , .);
  5.           box-shadow:  1px 2px rgba(, , , .);
  6.       }
  7.       #wrap{
  8.         .card;//等价于.card();
  9.       }
  10.       /* 生成的 CSS */
  11.       #wrap{
  12.         background: #f6f6f6;
  13.         -webkit-box-shadow:  1px 2px rgba(, , , .);
  14.         box-shadow:  1px 2px rgba(, , , .);
  15.       }

其中 .card 与 .card() 是等价的。

个人建议，为了避免 代码混淆，应写成 :

  1.       .card(){
  2.         //something...
  3.       }
  4.       #wrap{
  5.         .card();
  6.       }
  1. 要点：
  2.   `.` 与 `#` 皆可作为 方法前缀。
  3.   方法后写不写 `()` 看个人习惯。
3.2 默认参数方法

Less 可以使用默认参数，如果 没有传参数，那么将使用默认参数。

@arguments 犹如 JS 中的 arguments 指代的是 全部参数。

传的参数中 必须带着单位。

  1.       /* Less */
  2.       .border(@a:10px,@b:50px,@c:30px,@color:#){
  3.           border:solid 1px @color;
  4.           box-shadow: @arguments;//指代的是 全部参数
  5.       }
  6.       #main{
  7.           .border(0px,5px,30px,red);//必须带着单位
  8.       }
  9.       #wrap{
  10.           .border(0px);
  11.       }
  12.       #content{
  13.         .border;//等价于 .border()
  14.       }
  15.  
  16.       /* 生成的 CSS */
  17.       #main{
  18.           border:solid 1px red;
  19.           box-shadow:0px,5px,30px,red;
  20.       }
  21.       #wrap{
  22.           border:solid 1px #;
  23.           box-shadow: 0px 50px 30px #;
  24.       }
  25.       #content{
  26.           border:solid 1px #;
  27.           box-shadow: 10px 50px 30px #;
  28.       }
3.3 方法的匹配模式

与 面向对象中的多态 很相似

  1.       /* Less */
  2.       .triangle(top,@width:20px,@color:#){
  3.           border-color:transparent  transparent @color transparent ;
  4.       }
  5.       .triangle(right,@width:20px,@color:#){
  6.           border-color:transparent @color transparent  transparent ;
  7.       }
  8.  
  9.       .triangle(bottom,@width:20px,@color:#){
  10.           border-color:@color transparent  transparent  transparent ;
  11.       }
  12.       .triangle(left,@width:20px,@color:#){
  13.           border-color:transparent  transparent  transparent @color;
  14.       }
  15.       .triangle(@_,@width:20px,@color:#){
  16.           border-style: solid;
  17.           border-width: @width;
  18.       }
  19.       #main{
  20.           .triangle(left, 50px, #)
  21.       }
  22.       /* 生成的 CSS */
  23.       #main{
  24.         border-color:transparent  transparent  transparent #;
  25.         border-style: solid;
  26.         border-width: 50px;
  27.       }

要点

  • 第一个参数 left 要会找到方法中匹配程度最高的，如果匹配程度相同，将全部选择，并存在着样式覆盖替换。
  • 如果匹配的参数 是变量，则将会匹配，如 @_ 。
3.4 方法的命名空间

让方法更加规范

  1.       /* Less */
  2.       #card(){
  3.           background: #;
  4.           .d(@w:300px){
  5.               width: @w;
  6.  
  7.               #a(@h:300px){
  8.                   height: @h;//可以使用上一层传进来的方法
  9.                   width: @w;
  10.               }
  11.           }
  12.       }
  13.       #wrap{
  14.           #card > .d > #a(100px); // 父元素不能加 括号
  15.       }
  16.       #main{
  17.           #card .d();
  18.       }
  19.       #con{
  20.           //不得单独使用命名空间的方法
  21.           //.d() 如果前面没有引入命名空间 #card ，将会报错
  22.  
  23.           #card; // 等价于 #card();
  24.           .d(20px); //必须先引入 #card
  25.       }
  26.       /* 生成的 CSS */
  27.       #wrap{
  28.         height:100px;
  29.         width:300px;
  30.       }
  31.       #main{
  32.         width:300px;
  33.       }
  34.       #con{
  35.         width:20px;
  36.       }

要点

  • 在 CSS 中> 选择器，选择的是 儿子元素，就是 必须与父元素 有直接血源的元素。
  • 在引入命令空间时，如使用 > 选择器，父元素不能加 括号。
  • 不得单独使用命名空间的方法 必须先引入命名空间，才能使用 其中方法。
  • 子方法 可以使用上一层传进来的方法
3.5 方法的条件筛选

Less 没有 if else，可是它有 when

  1.     /* Less */
  2.     #card{
  3.  
  4.         // and 运算符 ，相当于 与运算 &&，必须条件全部符合才会执行
  5.         .border(@width,@color,@style) when (@width>100px) and(@color=#){
  6.             border:@style @color @width;
  7.         }
  8.  
  9.         // not 运算符，相当于 非运算 !，条件为 不符合才会执行
  10.         .background(@color) when not (@color>=#){
  11.             background:@color;
  12.         }
  13.  
  14.         // , 逗号分隔符：相当于 或运算 ||，只要有一个符合条件就会执行
  15.         .font(@size:20px) when (@size>50px) , (@size<100px){
  16.             font-size: @size;
  17.         }
  18.     }
  19.     #main{
  20.         #card>.border(200px,#,solid);
  21.         #card .background(#);
  22.         #card > .font(40px);
  23.     }
  24.     /* 生成后的 CSS */
  25.     #main{
  26.       border:solid # 200px;
  27.       background:#;
  28.       font-size:40px;
  29.     }

要点

  • 比较运算有： > >= = =< <。
  • = 代表的是等于
  • 除去关键字 true 以外的值都被视为 false
3.6 数量不定的参数

如果你希望你的方法接受数量不定的参数，你可以使用... ，犹如 ES6 的扩展运算符。

  1.       /* Less */
  2.       .boxShadow(...){
  3.           box-shadow: @arguments;
  4.       }
  5.       .textShadow(@a,...){
  6.           text-shadow: @arguments;
  7.       }
  8.       #main{
  9.           .boxShadow(1px,4px,30px,red);
  10.           .textShadow(1px,4px,30px,red);
  11.       }
  12.  
  13.       /* 生成后的 CSS */
  14.       #main{
  15.         box-shadow: 1px 4px 30px red;
  16.         text-shadow: 1px 4px 30px red;
  17.       }
3.7 方法使用important！

使用方法 非常简单，在方法名后 加上关键字即可。

  1.       /* Less */
  2.       .border{
  3.           border: solid 1px red;
  4.           margin: 50px;
  5.       }
  6.       #main{
  7.           .border() !important;
  8.       }
  9.       /* 生成后的 CSS */
  10.       #main {
  11.           border: solid 1px red !important;
  12.           margin: 50px !important;
  13.       }
3.8 循环方法

Less 并没有提供 for 循环功能，但这也难不倒 聪明的程序员，使用递归去实现。

下面是官网中的一个 Demo，模拟了生成栅格系统。

  1.       /* Less */
  2.       .generate-columns();
  3.  
  4.       .generate-columns(@n, @i: ) when (@i =< @n) {
  5.         .column-@{i} {
  6.           width: (@i * % / @n);
  7.         }
  8.         .generate-columns(@n, (@i + ));
  9.       }
  10.       /* 生成后的 CSS */
  11.       .column- {
  12.         width: %;
  13.       }
  14.       .column- {
  15.         width: %;
  16.       }
  17.       .column- {
  18.         width: %;
  19.       }
  20.       .column- {
  21.         width: %;
  22.       }
3.9 属性拼接方法

+_ 代表的是 空格；+ 代表的是 逗号。

  • 逗号

    1.       /* Less */
    2.  .boxShadow() {
    3.      box-shadow+: inset   10px #;
    4.  }
    5.  .main {
    6.    .boxShadow();
    7.    box-shadow+:   20px black;
    8.  }
    9.  /* 生成后的 CSS */
    10.  .main {
    11.    box-shadow: inset   10px #,   20px black;
    12.  }

  • 空格

  1.       /* Less */
  2.       .Animation() {
  3.         transform+_: scale();
  4.       }
  5.       .main {
  6.         .Animation();
  7.         transform+_: rotate(15deg);
  8.       }
  9.  
  10.       /* 生成的 CSS */
  11.       .main {
  12.         transform: scale() rotate(15deg);
  13.       }
3.10 实战技巧

下面是官网中的一个非常赞的 Demo

  1.       /* Less */
  2.       .average(@x, @y) {
  3.         @average: ((@x + @y) / );
  4.       }
  5.  
  6.       div {
  7.         .average(16px, 50px); // 调用 方法
  8.         padding: @average;    // 使用返回值
  9.       }
  10.  
  11.       /* 生成的 CSS */
  12.       div {
  13.         padding: 33px;
  14.       }

可以说 Less 是一门优雅编程语言。

4 继承

extend 是 Less 的一个伪类。它可继承 所匹配声明中的全部样式。

4.1 extend 关键字的使用
  1.       /* Less */
  2.       .animation{
  3.           transition: all .3s ease-out;
  4.           .hide{
  5.             transform:scale();
  6.           }
  7.       }
  8.       #main{
  9.           &:extend(.animation);
  10.       }
  11.       #con{
  12.           &:extend(.animation .hide);
  13.       }
  14.  
  15.       /* 生成后的 CSS */
  16.       .animation,#main{
  17.         transition: all .3s ease-out;
  18.       }
  19.       .animation .hide , #con{
  20.           transform:scale();
  21.       }
4.2 all 全局搜索替换

使用选择器匹配到的 全部声明。

  1.       /* Less */
  2.       #main{
  3.         width: 200px;
  4.       }
  5.       #main {
  6.         &:after {
  7.           content:"Less is good!";
  8.         }
  9.       }
  10.       #wrap:extend(#main all) {}
  11.  
  12.       /* 生成的 CSS */
  13.       #main,#wrap{
  14.         width: 200px;
  15.       }
  16.       #main:after, #wrap:after {
  17.           content: "Less is good!";
  18.       }
4.3 减少代码的重复性

从表面 看来，extend 与 方法 最大的差别，就是 extend 是同个选择器共用同一个声明，而 方法 是使用自己的声明，这无疑 增加了代码的重复性。

方法示例 与上面的 extend 进行对比：

  1.       /* Less */
  2.       .Method{
  3.         width: 200px;
  4.         &:after {
  5.             content:"Less is good!";
  6.         }
  7.       }
  8.       #main{
  9.         .Method;
  10.       }
  11.       #wrap{
  12.         .Method;
  13.       }
  14.  
  15.       /* 生成的 CSS */
  16.       #main{
  17.         width: 200px;
  18.         &:after{
  19.           content:"Less is good!";
  20.         }
  21.       }
  22.       #wrap{
  23.         width: 200px;
  24.         &:after{
  25.           content:"Less is good!";
  26.         }
  27.       }

5 导入

5.1 导入 less 文件 可省略后缀

  1. import "main";
  2. //等价于
  3. import "main.less";
  4.  
  5. 5.2 @import 的位置可随意放置
  6.  
  7. #main{
  8.   font-size:15px;
  9. }
  10. @import "style";
5.3 reference

Less 中 最强大的特性

使用 引入的 Less 文件，但不会 编译它。

  1. /* Less */
  2. @import (reference) "bootstrap.less"; 
  3.  
  4. #wrap:extend(.navbar all){}
使用@import (reference)导入外部文件，但不会添加 把导入的文件 编译到最终输出中，只引用。
5.3 once
@import语句的默认行为。这表明相同的文件只会被导入一次，而随后的导入文件的重复代码都不会解析。
  1. @import (once) "foo.less";
  2. @import (once) "foo.less"; // this statement will be ignored
5.4 multiple
使用@import (multiple)允许导入多个同名文件。
  1. /* Less */
  2.  
  3. // file: foo.less
  4. .a {
  5.   color: green;
  6. }
  7. // file: main.less
  8. @import (multiple) "foo.less";
  9. @import (multiple) "foo.less";
  10.  
  11. /* 生成后的 CSS */
  12. .a {
  13.   color: green;
  14. }
  15. .a {
  16.   color: green;
  17. }

6 函数

6.1 判断类型
  • isnumber
判断给定的值 是否 是一个数字。
  1. isnumber(#ff0);     // false
  2. isnumber(blue);     // false
  3. isnumber("string"); // false
  4. isnumber();     // true
  5. isnumber(56px);     // true
  6. isnumber(7.8%);     // true
  7. isnumber(keyword);  // false
  8. isnumber(url(...)); // false
  • iscolor
判断给定的值 是否 是一个颜色。
  • isurl
判断给定的值 是否 是一个 url 。
6.2 颜色操作
  • saturate
增加一定数值的颜色饱和度。
  • lighten
增加一定数值的颜色亮度。
  • darken
降低一定数值的颜色亮度。
  • fade
给颜色设定一定数值的透明度。
  • mix
根据比例混合两种颜色。
6.3 数学函数
  • ceil
向上取整。
  • floor
向下取整。
  • percentage
将浮点数转换为百分比字符串。
  • round
四舍五入。
  • sqrt
计算一个数的平方根。
  • abs
计算数字的绝对值，原样保持单位。
  • pow
计算一个数的乘方。

由于 文章 篇幅有限，所以 只能介绍一些 使用效率高的函数。

如果你想了解更多，可以去官网的函数链接

7 其他

7.1 注释
  • /* */ CSS原生注释，会被编译在 CSS 文件中。
  • / / Less提供的一种注释，不会被编译在 CSS 文件中。
7.2 避免编译
  1.       /* Less */
  2.       #main{
  3.         width:~'calc(300px-30px)';
  4.       }
  5.  
  6.       /* 生成后的 CSS */
  7.       #main{
  8.         width:calc(300px-30px);
  9.       }
  1. 结构： `~' 值 '`

8 使用 JS

因为 Less 是由 JS 编写，所以 Less 有一得天独厚的特性：代码中使用 Javascript 。

  1.     /* Less */
  2.       @content:`"aaa".toUpperCase()`;
  3.       #randomColor{
  4.         @randomColor: ~"rgb(`Math.round(Math.random() * 256)`,`Math.round(Math.random() * 256)`,`Math.round(Math.random() * 256)`)";
  5.       }
  6.       #wrap{
  7.         width: ~"`Math.round(Math.random() * 100)`px";
  8.         &:after{
  9.             content:@content;
  10.         }
  11.         height: ~"`window.innerHeight`px";
  12.         alert:~"`alert(1)`";
  13.         #randomColor();
  14.         background-color: @randomColor;
  15.       }
  16.       /* 生成后的 CSS */
  17.  
  18.       // 弹出 1
  19.       #wrap{
  20.         width: 随机值（~）px;
  21.         height: 743px;//由电脑而异
  22.         background: 随机颜色;
  23.       }
  24.       #wrap::after{
  25.         content:"AAA";
  26.       }

前几个月 ， 有个 CSS in JS 的概念非常火，现在 看来 JS in CSS 也未曾不可。 我觉得完全可以根据 Less 这个特性来造个轮子，JS来控制 CSS ，形成 动态属性，如果成功 很可能会改变 现在前端的打开姿势。

less使用方法总结的更多相关文章

  1. javaSE27天复习总结

    JAVA学习总结    2 第一天    2 1:计算机概述(了解)    2 (1)计算机    2 (2)计算机硬件    2 (3)计算机软件    2 (4)软件开发(理解)    2 (5) ...

  2. mapreduce多文件输出的两方法

    mapreduce多文件输出的两方法   package duogemap;   import java.io.IOException;   import org.apache.hadoop.conf ...

  3. 【.net 深呼吸】细说CodeDom（6）：方法参数

    本文老周就给大伙伴们介绍一下方法参数代码的生成. 在开始之前,先补充一下上一篇烂文的内容.在上一篇文章中,老周检讨了 MemberAttributes 枚举的用法,老周此前误以为该枚举不能进行按位操作 ...

  4. IE6、7下html标签间存在空白符，导致渲染后占用多余空白位置的原因及解决方法

    直接上图:原因:该div包含的内容是靠后台进行print操作,输出的.如果没有输出任何内容,浏览器会默认给该空白区域添加空白符.在IE6.7下,浏览器解析渲染时,会认为空白符也是占位置的,默认其具有字 ...

  5. 多线程爬坑之路-Thread和Runable源码解析之基本方法的运用实例

    前面的文章:多线程爬坑之路-学习多线程需要来了解哪些东西?(concurrent并发包的数据结构和线程池,Locks锁,Atomic原子类) 多线程爬坑之路-Thread和Runable源码解析 前面 ...

  6. [C#] C# 基础回顾 - 匿名方法

    C# 基础回顾 - 匿名方法 目录 简介 匿名方法的参数使用范围 委托示例 简介 在 C# 2.0 之前的版本中,我们创建委托的唯一形式 -- 命名方法. 而 C# 2.0 -- 引进了匿名方法,在 ...

  7. ArcGIS 10.0紧凑型切片读写方法

    首先介绍一下ArcGIS10.0的缓存机制: 切片方案 切片方案包括缓存的比例级别.切片尺寸和切片原点.这些属性定义缓存边界的存在位置,在某些客户端中叠加缓存时匹配这些属性十分重要.图像格式和抗锯齿等 ...

  8. [BOT] 一种android中实现“圆角矩形”的方法

    内容简介 文章介绍ImageView(方法也可以应用到其它View)圆角矩形(包括圆形)的一种实现方式,四个角可以分别指定为圆角.思路是利用"Xfermode + Path"来进行 ...

  9. JS 判断数据类型的三种方法

    说到数据类型,我们先理一下JavaScript中常见的几种数据类型: 基本类型:string,number,boolean 特殊类型:undefined,null 引用类型:Object,Functi ...

  10. .NET Core中间件的注册和管道的构建（3） ---- 使用Map/MapWhen扩展方法

    .NET Core中间件的注册和管道的构建(3) ---- 使用Map/MapWhen扩展方法 0x00 为什么需要Map(MapWhen)扩展 如果业务逻辑比较简单的话,一条主管道就够了,确实用不到 ...

随机推荐

  1. 多项式拟合的cpp实现

    当我们拥有一组散点图数据时,通常更愿意看到其走势. 对现有数据进行拟合,并输出拟合优度是常用的方法之一. 拟合结果正确性的验证,可以使用excel自带的功能. 下面是c++代码的实现: #ifndef ...

  2. boost的单例模式

    template <typename T> struct singleton_default {   private:     struct object_creator     {    ...

  3. Stanford概率图模型： 第一讲 有向图-贝叶斯网络

    原文链接(系列):http://blog.csdn.net/yangliuy/article/details/8067261 概率图模型(Probabilistic Graphical Model)系 ...

  4. js页面传值，cookie

    // 获取页面穿值 function GetQueryString(name) { var reg = new RegExp("(^|&)" + name + " ...

  5. 提示 npm update check failed

    执行npm命令时出现以下提示 虽然不影响代码运行,但总觉得看了很碍事, 查找资料后发现是因为文件夹权限的问题, .config / configstore文件夹中包含一个文件:update-notif ...

  6. JavaScript 字符串匹配 | JS 的正则用法 | 从后边匹配

    // 字符串匹配命令是 match,不是 replace var text = "http://123.com/456.html" ; window.alert(text.matc ...

  7. [CodeForces]981C Useful Decomposition

    李煜东dalao今天给我们讲课了QwQ ppt上一道题 英文题说一下题意吧,以后又看不懂了 将一棵树分割成多个简单路径,每个边只能在一条路径上,但至少有一个公共节点. 输出简单路径分割方法/No 由题 ...

  8. CF409C Magnum Opus

    CF409C Magnum Opus 题意翻译 题目背景 愚人节题目,题面似乎是一位名叫Nicolas Flamel的炼金术士用拉丁文写的某种物质的配方,结合谷歌尝试翻译了一下: 吾友: 哲人石所言不 ...

  9. 由free命令想到的

    root@xdj-Z9PA-D8-Series:~# free -m total used free shared buffers cached Mem: 15977 1683 14293 0 132 ...

  10. POJ 2133

    类似于DP一样做,但这题有个大坑,自己看DIS吧.... #include <iostream> #include <cstdio> #include <cstring& ...