前端開發中有一個函數叫Math.random()
,這個函數返回的是 0 到 1 之間的一個隨機數
那如果我們實際開發中想得到一個隨機顏色該怎麼辦呢
先使用Math.random()
得到一個數字,而數字有個toString()
函數,可以把數字轉換成字符串,關鍵是toString()
函數可以傳轉換的進制
比如Math.random().toString(2)
,得到的是二進制的
顏色的進制是 16 進制的,那麼傳個 16 不就行了
簡單進行個截取
簡單封裝個函數
但是這樣寫有點問題,因為隨機數是 0 到 1 之間,如果出現個 0.5 或者類似的,轉換後位數不夠,那明顯就不符合顏色的要求
那不夠的時候就要在字符串末尾自己拼接上,可以用padEnd()
表示當字符串不夠六位時,在後面拼足夠的 0,當然不一定要拼 0,只要符合顏色,大家可以自己拼
function randomColor () {
return '#' + Math.random().toString(16).slice(2,8).padEnd(6,'0');
}
console.log(randomColor())
除了生成隨機顏色,還能生成隨機的字符串Math.random().toString(36)
36 進制是什麼呢,10 個數字,26 個字母,一共剛好 36 個
簡單封裝個函數
還能指定字符串的長度,稍微改一下
但是這樣生成的字符串是有限的,因為一開始生成的隨機數就那麼多位,如果指定的長度大量的超過了生成的長度,就會在後面拼接過多的自定義字符串,這和我們想要的隨機字符串是不符的
數一下就會發現,一般隨機生成的長度是 11 位,那麼我們用遞歸修改一下函數
那麼這樣就能支持超長的字符串了
function randomString(len) {
if (len <= 11) {
return Math.random().toString(36).slice(2, 2 + len).padEnd(len, '0');
} else {
return randomString(11) + randomString(len - 11)
}
}
console.log(randomString(100))