[深圳|结业弟子]JS-黄俊杰|2019年12月26日的日报-技能树.IT修真院

发表于： 2019-12-26 22:25:49

1 1328

今天完成的事

图片列表渲染出来了

今天的收获

随机的一种颜色

颜色表示方式有多种，一种是以3个或6个十六进制的数子表示，一种是RGB（红绿蓝）的数字形式，还有一种是直接以颜色的英文来表示。这三种都是不支持透明色的。所以还有RGBA的表式方式，在RGB的的基础上加入了Alpha透明

JS中，有随机取值的方法，再配合颜色的表现形式，就可以取出随机颜色。

以下为随机数方法

Math.ceil(); //向上取整。

Math.floor(); //向下取整。

Math.round(); //四舍五入。

Math.random(); //0.0 ~ 1.0 之间的一个伪随机数。【包含0不包含1】 //比如0.8647578968666494

Math.ceil(Math.random()*10); // 获取从1到10的随机整数，取0的概率极小。

Math.round(Math.random()); //可均衡获取0到1的随机整数。

Math.floor(Math.random()*10); //可均衡获取0到9的随机整数。

Math.round(Math.random()*10); //基本均衡获取0到10的随机整数，其中获取最小值0和最大值10的几率少一半。

因为结果在0~0.4 为0，0.5到1.4为1…8.5到9.4为9，9.5到9.9为10。所以头尾的分布区间只有其他数字的一半。

随机颜色的几种形式

16进制、RGB、HSL

function color() {

    return “#” + (“00000” + ((Math.random() * 16777215 + 0.5) >> 0).toString(16)).slice(-6)
    
    }

    function color(){
        var r = Math.floor(Math.random()*256);
        var g = Math.floor(Math.random()*256);
        var b = Math.floor(Math.random()*256);
        var rgb = ‘rgb(’+r+’,’+g+’,’+b+’)’;
        console.log(rgb);
        return rgb;
    }

function color(){
    var h = Math.floor(Math.random()*361);
    var s = Math.floor(Math.random()*101)+"%";
    var l = Math.floor(Math.random()*101)+"%";
    var hsl = ‘hsl(’+h +’,’+ s +’,’+ l +’)’;
    console.log(hsl);
    return hsl;
}