Want to see more topics?

06 May 2021

Bagaimana cara mendapatkan warna acak di discord.js ataupun javascript umum?

 ~By: Ahmad Mu'Arif

mistergaje.blogspot.com


   Hai Gajeers! Kali ini Mr. Gaje kembali membawa topik programming, yang akan berfokus tentang cara menghasilkan warna acak di Javascript, atau secara spesifik untuk penggunaan Bot Discord dalam menggunakan discord.js.

   Beberapa di antara kalian mungkin penasaran tentang bagaimana cara menghasilkan warna secara acak, alih-alih terus menerus menggunakan warna yang sama setiap saat. Mr. Gaje sendiri akan memberikan beberapa metode yang bisa kalian pilih sendiri. Namun khusus untuk penggunaan Bot Discord, saya sangat merekomendasikan metode terakhir.

  • Daftar Isi :
    1. Acak Warna Sesuai Daftar Keinginan
    2. 100% Acak Warna (Metode Pertama)
    3. 100% Acak Warna (Metode Kedua)
    4. Kode "RANDOM" untuk Discord Embed

1. Acak Warna Sesuai Daftar Keinginan

   Yang dimaksud Daftar di sini adalah Array, yaitu kumpulan string, atau sederhananya sebut saja sebagai sebuah keranjang. Prinsipnya adalah komputer akan mengambil salah satu item yang kita letakkan di dalam keranjang secara acak.

   Wikipedia: Dalam ilmu komputer, array adalah suatu tipe data terstruktur yang dapat menyimpan banyak data dengan suatu nama yang sama dan menempati tempat di memori yang berurutan serta bertipe data sama pula. Array dapat diakses berdasarkan indeksnya.

   Ok, daripada basa-basi lebih panjang lagi, ini dia contoh kodenya :


var warna = [
  '#C70E0E',
// Merah
  '#E87C00', // Oranye
  '#FFF305', // Kuning
  '#04D108', // Hijau
  '#0B7BD6', // Biru
  '#AE0BD6', // Ungu
  '#D60B99', // Pink
  '#F2D8A2', // Krim
  '#825D41', // Coklat
  '#000000', // Hitam
  '#6E6E6E', // Abu-abu
  '#FFFFFF' // Putih
];

const acak = Math.floor(Math.random() * warna.length);

console.log(warna[acak]);

   Coba kode di atas disini!

   Cara kerja kode di atas adalah memanggil item array dengan menggunakan angka hasil acakan. Yaitu ketika array[index] dipanggil, item sesuai angka urutan di dalam array itu yang akan menjadi hasil. Contoh jika acakan menghasilkan angka 0, maka warna[acak] akan berubah menjadi warna[0], dan item #C70E0E sebagai warna merah akan muncul sebagai hasilnya.
Di dalam Javascript, angka bermula dari 0, 1, 2, 3, dan seterusnya, bukan dari 1.

---

2. 100% Acak Warna (Metode Pertama)

   Kali ini dari berasal dari dev.to, ini adalah metode yang paling banyak digunakan dalam Javascript untuk menghasilkan warna secara acak.


var apaAja = '#' + Math.floor(Math.random() * 16777215).toString(16);

console.log(apaAja);

Coba kode di atas disini!

   Cara kerja kode di atas adalah dengan memunculkan angka secara acak di Math.random(), dan mengalikannya menggunakan * dengan 16777215 untuk menghasilkan 6 karakter (a-z 0-9) secara acak, yang bisa kamu lihat sebelumnya ditambahkan dengan string '#', maka apa yang akan dihasilkan kurang lebih seperti ini: #2c323c. Sedangkan .toString(16) sendiri bertujuan untuk mengembalikan representasi string dari objek, atau sederhananya mengubah objek menjadi string, pada kasus ini agar dapat menyatu dengan '#'.

---

3. 100% Acak Warna (Metode Kedua)

   Mirip dengan sebelumnya, perbedaan antara yang satu ini dengan sebelumnya hanyalah tidak adanya 16777215, namun tetap memberikan output hasil yang sama.


const kykArisanNjir = '#' + (Math.random() * 0xFFFFFF << 0).toString(16).padStart(6, '0');

console.log(kykArisanNjir);

Coba kode di atas disini!

   Pada akhirnya output akan sama-sama menghasilkan kode Hex dengan # dan 6 karakter (a-z 0-9) mengikuti di belakangnya. Tapi ada sesuatu yang bertambah di sini, yaitu .padStart(). Apakah sebenarnnya itu?

   .padStart() berfungsi untuk mengisi string saat ini dengan string lain (beberapa kali, jika diperlukan) hingga string yang dihasilkan mencapai panjang yang ditentukan. Padding diterapkan dari awal string saat ini.

   Toh, intinya kode itu akan menghasilkan seperti contohnya 
#2C323C, kodenya tetap akan berjalan semestinya meskipun kamu tidak mengerti apa yang terjadi.

---

4. Kode "RANDOM" untuk Discord Embed

   Seperti judulnya, metode terakhir ini khusus untuk Bot Discord. Metode ini sangat sederhana, begitu sederhana hingga orang yang tidak mengenal programming pun pasti mengerti apa yang terjadi ketika melihatnya.

   Karena itu, Mr. Gaje tidak akan membuat contoh web console seperti ketiga metode di atas untuk melakukan pengetesan. Lagipula, web console yang digunakan untuk pengetesan seperti itu tidak cocok untuk discord.js, discord.js adalah sebuah package npm yang harus diinstall terlebih dahulu, yang berarti kita membutuhkan storage untuk itu. Jika kamu ingin melakukan pengetesan, mungkin kamu bisa salin kode di bawah ke repl.it atau glitch.com, atau langsung ke proyek bot milikmu.


const Discord = require('discord.js');
const client = new Discord.Client();

client.on('ready', () => {
  console.log(`${client.user.tag} telah online dan siap ditest.`);
});

client.on('message', (message) => {

  if (message.content === '!acak') {
// Coba command !acak di Discord

    let embed = new Discord.MessageEmbed()
      .setColor("RANDOM") // Di sini warnanya diacak
      .setDescription('Tuh, jadi acak kan warnanya? Gak percaya? Coba aja lagi commandnya, `!acak`.');

    message.channel.send(embed);

  }

});

client.login('TOKEN-BOT-KAMU-DISINI');

   Kode "RANDOM" tersebut diletakkan di dalam function .setColor() dari .MessageEmbed(). Hanya dengan menggunakan kata kunci itu, semua warna secara acak bisa kamu dapatkan. Tunggu apa lagi?

🔸🔹🔶🔷🔰🔷🔶🔹🔸


   Baiklah, itu saja kiranya untuk topik kali ini. Semoga bermanfaat bagi yang membutuhkan. Jangan lupa untuk mengirim request topik melalui Email atau Facebook jika kalian memiliki sesuatu untuk diminta.


   Kunjungi juga kami di Facebook!


0 komentar

Post a Comment

Motto:

"Jangan berharap lebih, jika tidak berusaha lebih." ~Gray