Thông thường, trong khi phát triển các dự án, bạn sẽ thấy mình đang tìm cách tạo ra các số ngẫu nhiên. Các trường hợp sử dụng phổ biến nhất để tạo số ngẫu nhiên là các trò chơi may rủi như tung xúc xắc, xáo bài và quay bánh xe roulette. Trong hướng dẫn này, bạn sẽ học cách tạo một

Bạn đang xem: hàm ngẫu nhiên toán học javascript

Thông thường, trong khi phát triển các dự án, bạn sẽ tự tìm cách để tạo số ngẫu nhiên.

Các trường hợp sử dụng phổ biến nhất để tạo các số ngẫu nhiên là các trò chơi may rủi như tung xúc xắc, đánh bài xáo trộn và quay bánh xe roulette.

Trong hướng dẫn này, bạn sẽ học cách tạo một số ngẫu nhiên sử dụng phương thức Math.random () bằng cách xây dựng một trò chơi xúc xắc nhỏ.

Phương thức Math.random ()

Đối tượng Math trong JavaScript là một đối tượng dựng sẵn có các thuộc tính và phương thức để thực hiện các phép tính toán học.

Cách sử dụng phổ biến của đối tượng Math là tạo một số ngẫu nhiên bằng phương thức random () .

  const randomValue = Math.random ();  

Nhưng phương thức Math.random () không thực sự trả về toàn bộ con số. Thay vào đó, nó trả về giá trị dấu phẩy động giữa 0 (bao gồm) và 1 (loại trừ). Ngoài ra, hãy lưu ý rằng giá trị được trả về từ Math.random () về bản chất là giả ngẫu nhiên.

Các số ngẫu nhiên được tạo bởi Math.random () có thể có vẻ ngẫu nhiên, nhưng những số đó sẽ lặp lại và cuối cùng hiển thị một mẫu không ngẫu nhiên trong một khoảng thời gian.

Điều này là do việc tạo số ngẫu nhiên theo thuật toán không bao giờ có thể thực sự ngẫu nhiên về bản chất. Đây là lý do tại sao chúng tôi gọi chúng là trình tạo số giả ngẫu nhiên (PRNG).

Để tìm hiểu thêm về phương thức Math.random () , bạn có thể xem này hướng dẫn.

Hàm tạo số ngẫu nhiên

Bây giờ hãy sử dụng phương thức Math.random () để tạo một hàm sẽ trả về một số nguyên ngẫu nhiên giữa hai giá trị (bao gồm).

  const getRandomNumber = (min, max) = & gt; {
  return Math.floor (Math.random () * (max - min + 1)) + min;
};  

Hãy phân tích logic ở đây.

Phương thức Math.random () sẽ trả về một số dấu phẩy động giữa 0 và 1 (độc quyền).

Vì vậy, các khoảng thời gian sẽ như sau:

  [0 ....................... ............. 1)

[tối thiểu .................................... tối đa)  

Để tính khoảng thứ hai, trừ min ở cả hai đầu. Vì vậy, điều đó sẽ cung cấp cho bạn khoảng từ 0 đến max-min .

  [0 ................. ................... 1)

[0 .................................... tối đa - tối thiểu)  

Vì vậy, bây giờ, để nhận một giá trị ngẫu nhiên, bạn sẽ thực hiện như sau:

  const x = Math.random () * (max - min)  

< p> Đây x là giá trị ngẫu nhiên.

Hiện tại, max bị loại trừ khỏi khoảng thời gian. Để làm cho nó bao gồm, hãy thêm 1. Ngoài ra, bạn cần thêm lại min đã bị trừ trước đó để nhận giá trị trong khoảng [min, max) .

  const x = Math.random () * (max - min + 1) + min  

Được rồi, bây giờ còn lại bước cuối cùng là đảm bảo rằng x luôn là số nguyên.

  const x = Math.floor (Math.random () * (max - min + 1)) + min  

Bạn có thể sử dụng phương thức Math.round () thay vì floor () , nhưng điều đó sẽ cung cấp cho bạn một phân phối không đồng nhất. Điều này có nghĩa là cả max min sẽ có một nửa cơ hội xuất hiện dưới dạng kết quả. Sử dụng Math.floor () sẽ cung cấp cho bạn phân phối hoàn toàn đồng đều.

Xem Thêm  Hộp văn bản trong HTML - Thẻ HTML của trường nhập liệu - hộp tin nhắn đầu vào html

Vì vậy, bây giờ bạn đã hiểu rõ về cách thức hoạt động của một thế hệ ngẫu nhiên, hãy sử dụng hàm này để mô phỏng xúc xắc lăn .

The Rolling Dice Game

Trong phần này, chúng ta sẽ tạo một trò chơi xúc xắc mini thực sự đơn giản. Hai người chơi nhập tên của họ và sẽ tung xúc xắc. Người chơi có xúc xắc có số cao hơn sẽ thắng vòng.

Đầu tiên, hãy tạo một hàm rollDice mô phỏng hành động để tung xúc xắc.

Bên trong thân hàm, gọi hàm getRandomNumber () với 1 6 làm đối số. Điều này sẽ cung cấp cho bạn bất kỳ số ngẫu nhiên nào từ 1 đến 6 (bao gồm cả hai) giống như cách hoạt động của xúc xắc thực.

  const rollDice = () = & gt; getRandomNumber (1, 6);  

Tiếp theo, tạo hai trường nhập và một nút như hình dưới đây:

 & lt; div id = "app" & gt;
      & lt; div & gt;
        & lt; input id = "player1" placeholder = "Nhập Tên 1 Người chơi" / & gt;
      & lt; / div & gt;
      & lt; div & gt;
        & lt; input id = "player2" placeholder = "Nhập Tên Người chơi 2" / & gt;
      & lt; / div & gt;
      & lt; button id = "roll" & gt; Roll Dice & lt; / button & gt;
      & lt; div id = "kết quả" & gt; & lt; / div & gt;
    & lt; / div & gt;  

Khi nhấp vào nút ‘Xúc xắc xúc xắc’, lấy tên người chơi từ các trường nhập và gọi hàm rollDice () cho từng trình phát.

  const getRandomNumber = (min, max) = & gt; Math.floor (Math.random () * (max - min + 1)) + min;


const rollDice = () = & gt; getRandomNumber (1, 6);

document.getElementById ("roll"). addEventListener ("click", function () {
  // tìm nạp tên người chơi từ các trường đầu vào
  const player1 = document.getElementById ("player1"). value;
  const player2 = document.getElementById ("player2"). value;

  // tung xúc xắc cho cả hai người chơi
  const player1Score = rollDice ();
  const player2Score = rollDice ();

  // khởi tạo chuỗi trống để lưu trữ kết quả
  cho kết quả = "";

  // xác định kết quả
  if (player1Score & gt; player2Score) {
    result = `$ {player1} đã thắng vòng`;
  } else if (player2Score & gt; player1Score) {
    result = `$ {player2} đã thắng vòng`;
  } khác {
    result = "Vòng này bị ràng buộc";
  }

  // hiển thị kết quả trên trang
  document.getElementById ("kết quả"). innerHTML = `
  & lt; p & gt; $ {player1} = & gt; $ {player1Score} & lt; / p & gt;
  & lt; p & gt; $ {player2} = & gt; $ {player2Score} & lt; / p & gt;
  & lt; p & gt; $ {result} & lt; / p & gt;
  `;
});
 

Bạn có thể xác thực các trường tên của người chơi và kiểm tra đánh dấu bằng một số CSS. Với mục đích ngắn gọn, tôi sẽ đơn giản hóa hướng dẫn này.

Chỉ vậy thôi. Bạn có thể xem bản demo tại đây .

Kết luận

Vì vậy, xét cho cùng thì việc tạo số ngẫu nhiên trong JavaScript không phải là ngẫu nhiên. Tất cả những gì chúng tôi đang làm là nhập một số đầu vào, sử dụng một số Toán học và viết ra một số giả ngẫu nhiên.

Xem Thêm  Sắp xếp mảng JavaScript - chuỗi sắp xếp mảng javascript

Đối với hầu hết các ứng dụng và trò chơi dựa trên trình duyệt, sự ngẫu nhiên như vậy là đủ và phục vụ cho mục đích của nó.

Đó là nó cho hướng dẫn này. Giữ an toàn và tiếp tục viết mã như một con thú.


Xem thêm những thông tin liên quan đến chủ đề hàm ngẫu nhiên toán học javascript

[Javascript căn bản] | Bài 17: Sử dụng Math.max, min, random trong javascript | Nodemy

  • Tác giả: Nodemy
  • Ngày đăng: 2020-05-18
  • Đánh giá: 4 ⭐ ( 6017 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: ✪ Nội dung bài học:
    1. math.round(x) làm tròn
    2.math.pow(x,y) x mũ y
    3.math.sqrt(x) căn bậc hai
    4.math.abs(x ) giá trị tuyệt đối

    👇 LỘ TRÌNH LÊN FULLSTACK, trọn bộ serial course MIỄN PHÍ 👇:
    • HTML: http://bit.ly/3olTbrL​
    • CSS: http://bit.ly/3sWvABq​
    • JS: http://bit.ly/2MtUI1u​
    • NodeJS: http://bit.ly/3iOeiC3​
    • ExpressJS: http://bit.ly/2NGoUYd​
    • ReactJS: http://bit.ly/3ok67yf​

    Ngoài ra nếu bạn muốn học hiệu quả hơn, có kinh nghiệm đi làm ngay thì nên học tập tại:

    • Học OFF (2 – 4 tháng): https://Nodemy.vn​
    Được đưa vào làm dự án, giảng viên hỗ trợ 1-1, trực tiếp hướng dẫn làm task. Đầu ra cam kết việc làm có lương ngay.

    • Học ONLINE: https://class.nodemy.vn/​
    Video call, giải đáp trực tiếp, hỗ trợ 1-1, teamview review sửa code. Hướng dẫn code dự án thực tế.

    ❓Tại sao mình nói học OFF hoặc ONLINE qua https://class.nodemy.vn/​ lại hiệu quả hơn ?
    Vì khi bạn tham gia các chương trình đào tạo trên, bạn sẽ được giảng viên hỗ trợ trực tiếp. Đó là cách bạn lên kinh nghiệm nhanh nhất, học từ người đi trước.
    Có người hướng dẫn bạn sẽ học tập trung kiến thức trọng tâm, kiến thức chuyên sâu, tránh sai lầm khi code. Những điều đó thôi cũng giúp bạn rút ngắn gần 1 năm so với tự học lập trình.

    ✪ Để học tập ONLINE qua youtube hiệu quả :
    ⚠️⚠️ ⚠️ Các bạn không nên quá phụ thuộc vào video. Video chỉ giúp các bạn hiểu kiến thức, để vận dụng thành thạo các bạn cần luyện tập nhiều và làm dự án thực tế, cần 1 người đi trước chỉ dẫn.
    ⭐ Nên tự code lại kiến thức đã học (tắt video đi code lại),
    ⭐ Làm bài tập cần pause video, tự nghĩ và làm bài tập trước, rồi mới xem đáp án
    ⭐ Xem hiểu hết video không có nghĩa là bạn đã biết code. Vì vậy các bạn đừng vội xem nhanh và nhiều video trong 1 ngày. Các bạn có thể thực hiện theo công thức bên dưới:
    1. Xem video, khoảng 5 – 10 phút thì dừng lại để luyện tập
    2. Tóm tắt những kiến thức trong 5-10 phút vừa xem theo cách bạn dễ nhớ
    3. Tắt video, code lại những gì đã học trong video (không được mở video tham khảo, chỉ nhìn vào bản tóm tắt để làm, nếu không nhớ thì google search)
    4. Tự lấy thêm ví dụ để kiểm chứng xem mình đã hiểu đúng về kiến thức chưa.
    5. Nếu tự code được bằng chính khả năng của mình thì tiếp tục xem tiếp video.

    ☝️CHÚ Ý: Thường các video có dài hơn 30 phút đến 1 tiếng thì vẫn phải áp dụng 5 bước trên, mỗi lần xem video chỉ 10 phút rồi phải thực hành lại ngay.
    ❓ Nếu có bất kì thắc mắc nào về bài giảng có thể để lại comment, mình sẽ trả lời sớm nhất cho các bạn. Mọi người có thể cùng nhau học lập trình, tham gia group bên dưới:

    Nodemy là một startup trường học công nghệ đào tạo chuyên sâu về Nodejs – Javascript, được nhóm admin NodeJs Việt Nam – cộng đồng Js lớn nhất Việt Nam thành lập.

    ✪ Follow Me :
    • Fanpage: https://www.facebook.com/nodemy.vn​
    • Website: https://www.edmforyou95.com​
    •Group học tập: https://www.facebook.com/groups/nodemy​
    •Website: https://nodemy.vn​

    ✪ Cộng đồng:
    • Nodejs Việt Nam: https://www.facebook.com/groups/congd…​
    • Diễn đàn: http://nodejs.vn​
    • Fanpage Nodejs Việt Nam: https://www.facebook.com/nodejs.vn​

    ✪ Các bạn có thể liên hệ trực tiếp với mình qua:
    📞 08 666 33 805
    🙋‍♂: https://www.facebook.com/nam.nodemy​

    Nodemy javascript javascript_căn_bản

Hàm Random trong JavaScript

  • Tác giả: laptrinhtudau.com
  • Đánh giá: 3 ⭐ ( 1075 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Hàm Random trong JavaScript – Lập Trình Từ Đầu 1 JavaScript Căn Bản

Math.random() có thực sự là random hay không?

  • Tác giả: hocjavascript.net
  • Đánh giá: 5 ⭐ ( 5716 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Khi bạn làm việc với JavaScript, và bạn cần 1 số ngẫu nhiên thì ngay lập tức bạn sẽ nghĩ đến là Math.random(). Một trong những lý do chính cho

Math.random() có thực sự có random

  • Tác giả: viblo.asia
  • Đánh giá: 4 ⭐ ( 8139 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Math.random() không thực sự random như bạn nghĩ. Có bao giờ bạn dùng phân dã hạt nhân để lấy số random

Kỹ thuật tạo một số ngẫu nhiên trong JavaScript

  • Tác giả: dienloi.com
  • Đánh giá: 5 ⭐ ( 7649 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: – Ở bài học trước, tôi đã giới thiệu sơ qua về phương thức random() của đối tượng Math, nó dùng để tạo một số ngẫu nhiên trong khoảng từ 0 đến 1 (không bao gồm số 1) – Tuy nhiên không dừng lại ở đó, nếu phương thức random() được sử dụng kết hợp

Tạo số ngẫu nhiên trong JavaScript

  • Tác giả: completejavascript.com
  • Đánh giá: 4 ⭐ ( 4556 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Bài viết này mình sẽ tổng hợp lại một số biến thể của việc tạo số ngẫu nhiên trong JavaScript với phương thức Math.random() và các ứng dụng của chúng.

Cách tạo số ngẫu nhiên trong Javascript

  • Tác giả: freetuts.net
  • Đánh giá: 4 ⭐ ( 8527 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Hướng dẫn cách tạo một số ngẫu nhiên trong Javascript bằng cách sử dụng hàm Math.random, qua đó bạn có thể giới hạn phạm vi min và max của số random.

Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình

Xem Thêm  Vòng lặp Python qua một danh sách - cách lặp lại một danh sách

By ads_php