TEST12138

TEST12138

长路漫漫,唯心作伴。

前端之隨機數妙用

前端開發中有一個函數叫Math.random(),這個函數返回的是 0 到 1 之間的一個隨機數

image

那如果我們實際開發中想得到一個隨機顏色該怎麼辦呢
先使用Math.random()得到一個數字,而數字有個toString()函數,可以把數字轉換成字符串,關鍵是toString()函數可以傳轉換的進制
比如Math.random().toString(2),得到的是二進制的

image

顏色的進制是 16 進制的,那麼傳個 16 不就行了

image

簡單進行個截取

image

簡單封裝個函數

image

image

但是這樣寫有點問題,因為隨機數是 0 到 1 之間,如果出現個 0.5 或者類似的,轉換後位數不夠,那明顯就不符合顏色的要求

image

那不夠的時候就要在字符串末尾自己拼接上,可以用padEnd()

image

表示當字符串不夠六位時,在後面拼足夠的 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 個

image

簡單封裝個函數

image

image

還能指定字符串的長度,稍微改一下

image

image

但是這樣生成的字符串是有限的,因為一開始生成的隨機數就那麼多位,如果指定的長度大量的超過了生成的長度,就會在後面拼接過多的自定義字符串,這和我們想要的隨機字符串是不符的

image

數一下就會發現,一般隨機生成的長度是 11 位,那麼我們用遞歸修改一下函數

image

image

那麼這樣就能支持超長的字符串了

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))
載入中......
此文章數據所有權由區塊鏈加密技術和智能合約保障僅歸創作者所有。