js生成隨機顏色

2022-03-06 14:59:11 字數 1375 閱讀 6923

方法一:

var getrandomcolor = function

())('');

}

隨機生成6個字元然後再串到一起,閉包呼叫自身與三元運算子讓程式變得內斂。

方法二: 

var getrandomcolor = function

())(math,'0123456789abcdef',5)

}

把math物件,用於生成hex顏色值的字串提取出來,並利用第三個引數來判斷是否還繼續呼叫自身。

方法三:

array.prototype.map = function

(fn, thisobj)

return

a;};

var getrandomcolor = function

()).join('');

}

這個要求我們對陣列做些擴充套件,map將返回乙個陣列,然後我們再用join把它的元素串成字元。

方法四:

var getrandomcolor = function

()

這個實現非常逆天,雖然有點小bug。我們知道hex顏色值是從#000000到#ffffff,後面那六位數是16進製制數,相當於"0x000000"到"0xffffff"。這實現的思路是將hex的最大值ffffff先轉換為10進製,進行random後再轉換回16進製制。我們看一下,如何得到16777215 這個數值的。

方法五:

var getrandomcolor = function

()

基本實現4的改進,利用左移運算子把0xffffff轉化為整型。這樣就不用記16777215了。由於左移運算子的優先順序比不上乘號,因此隨機後再左移,連math.floor也不用了。

方法六:

var getrandomcolor = function

())((math.random()*0x1000000<<0).tostring(16))

}

修正上面版本的bug(無法生成純白色與hex位數不足問題)。0x1000000相當0xffffff+1,確保會抽選到0xffffff。在閉包裡我們處理hex值不足6位的問題,直接在未位補零。

方法七:

var getrandomcolor = function

()

這次在前面補零,連遞迴檢測也省了。

上面版本生成顏色的範圍算是大而全,但隨之而來的問題是顏色不好看,於是實現8搞出來了。它生成的顏色相當鮮豔。

方法八:

var getrandomcolor = function

()

關於隨機生成顏色

本人暫時算是css新手,對以下方法並沒有完全弄明白,此篇隨筆收集顏色隨機生成方法,以備急用。方法1 隨機生成6個字元然後再串到一起,閉包呼叫自身與三元運算子讓程式變得內斂,初心者應該好好學習這種寫法 var getrandomcolor function 方法2 把math物件,用於生成hex顏色值...

js隨機生成

math.random只是生成了乙個偽隨機數,之後還要經過處理才行。w3school的random 教程 定義和用法 random 方法可返回介於 0 1 之間的乙個隨機數。語法 math.random 返回值 0.0 1.0 之間的乙個偽隨機數。例項 取 0 到 1 之間的乙個隨機數 輸出 0.1...

隨機生成顏色的類

由於繪圖需要生成一些隨機的顏色,所以做了乙個類來實現。實現的原理就是使用隨機數生成器random類來得到顏色的四種分量alpha,red,green和blue,然後使用color.fromargb方法來合成顏色。randomcolor類有3種不同的建構函式,原型分別為 public randomco...