JavaScript中隨機數(shù)方法?Math.random()
前言:
我們學習項目的時難免遇到一些問題,比如;遇到一個功能需要隨機返回多條不重復的數(shù)據(jù),也可以是拿了就用,下次再需要時已經(jīng)忘記如何使用了;雖然接觸使用的場景很少,但也有必要單獨拿出來講一講
定義
js中的生成隨機數(shù)操作是基于 Math
方法下的 random()
方法
Math.random() : 隨機獲取范圍內(nèi)的一個數(shù) ( 精確到小數(shù)點后14位 )
基礎(chǔ)寫法
隨機生成一個 0 ~ 1 之間的數(shù):
?// 語法: Math.random()
生成指定范圍內(nèi)的隨機數(shù)
生成 小于 m 的隨機數(shù)(含小數(shù)):
?// 語法: Math.random() * m ?Math.random() * 60
生成 小于m 的整數(shù):
可以使用 parseInt
去除小數(shù)點的形式將生成的隨機數(shù)轉(zhuǎn)換為整數(shù)
?// 語法: Math.random() * m ?parseInt(Math.random()* 60)
生成向下取整的隨機整數(shù):
使用Math
方法下的floor
屬性進行舍棄小數(shù)向下取整, 當然你也可以使用 Math.ceil
向上取整
?// 語法: Math.random() * m ?Math.floor(Math.random()* 60)
生成兩個數(shù)之間的隨機數(shù)
表示生成 n~m+n 之間的隨機數(shù):
?// 語法: Math.random() * m + n ?// 范圍:n ~ m+n ?Math.random() * 10 + 8 ?// 8 ~ 18
生成 -n~m+n 之間的隨機數(shù):
?// 語法: Math.random() * m - n ?// 范圍:-n ~ m+n ?Math.random() * 10 - 8 ?// -8 ~ 2
生成 -m~0 之間的隨機數(shù):
?// 語法: Math.random() * m - m ?// 范圍:-m - 0 ?Math.random() * 10 - 10 ?// -10 - 0
生成 n~m 之間的隨機整數(shù)(包括n與m):
?// 語法: Math.floor(Math.random() * (m - n)) + n ?// 范圍:n ~ m ?Math.floor(Math.random() * (8 - 100)) + 100 ?// 8~100
常用場景
看完語法,接下來講一個我項目中用到的場景 - 熱榜,將每次隨機獲取3條不重復的熱門數(shù)據(jù)
function random_pick(list, target) { /** * @param {number[]} list - 數(shù)據(jù) * @param {number} target - 獲取的條數(shù) */ // 1. 保存熱榜 let hot = []; // 2. 保存熱榜的索引 for (let index = 0; index < list.length; index++) { // 3. 如果熱榜采集完,則直接返回 if (hot.length >= target) return hots(hot); // 4. 每次隨機取出一個數(shù) let r = Math.floor(Math.random() * list.length); // 5. 如果隨機數(shù)不在熱榜里,則加入熱榜 if (hot.indexOf(r) == -1) { hot.push(r); } } // 熱榜過濾函數(shù) function hots(params) { return params.map(item => { return list[item] }); } } let r = random_pick([22, 33, 44, 55, 66, 77, 88], 3)
到此這篇關(guān)于JavaScript中隨機數(shù)方法 Math.random()的文章就介紹到這了,更多相關(guān)JS - Math.random() 內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
JavaScript實現(xiàn)計數(shù)器基礎(chǔ)方法
這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)計數(shù)器的基礎(chǔ)方法2017-10-10
,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下Echarts折線圖實現(xiàn)一條折線顯示不同顏色的方法
這篇文章主要給大家介紹了關(guān)于Echarts折線圖實現(xiàn)一條折線顯示不同顏色的相關(guān)資料,Echarts的折線圖可以通過設(shè)置series中的itemStyle屬性來改變折線的顏色,文中通過代碼介紹的非常詳細,需要的朋友可以參考下2024-02-02echarts如何實現(xiàn)動態(tài)曲線圖(多條曲線)
這篇文章主要介紹了echarts如何實現(xiàn)動態(tài)曲線圖(多條曲線),具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-07-07javascript HTML5 canvas實現(xiàn)打磚塊游戲
這篇文章主要介紹了基于javascript HTML5 canvas實現(xiàn)打磚塊游戲的具體實現(xiàn)代碼,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-04-04JavaScript實現(xiàn)獲取網(wǎng)絡通信進度
這篇文章主要為大家詳細介紹了如何使用Fetch?API和XMLHttpRequest(XHR)來執(zhí)行網(wǎng)絡請求,并重點說明如何獲取這兩種方法的網(wǎng)絡請求進度,感興趣的可以了解下2023-12-12