Cara Mengira Nilai nCr
Gabungan ialah konsep matematik. Ia merujuk kepada susunan beberapa objek yang susunannya tidak relevan. Formula asas menerangkan bilangan gabungan yang sah.
Belajar Membina Aplikasi Kamus Mudah Menggunakan JavaScript
JavaScript adalah salah satu bahasa pengaturcaraan yang paling popular di kalangan pembangun web. Semasa mempelajari JavaScript, semua orang bermula dengan asas dan membina aplikasi mudah menggunakan manipulasi DOM.
Dalam artikel ini, anda akan mempelajari cara anda boleh membina kamus menggunakan JavaScript dan manipulasi DOM. Artikel ini mengharapkan anda mengetahui asas JavaScript sebelum membaca.
Menyemak API
API adalah singkatan dari Application Programming Interface . API memudahkan pembangunan perisian dan inovasi dengan membolehkan aplikasi bertukar data dan fungsi dengan mudah dan selamat.
Projek ini menggunakan API dictionaryapi.dev . Ini ialah API percuma yang menyediakan berbilang takrifan, fonetik dan istilah tatabahasa lain yang berkaitan dengan perkataan yang anda cari.
Pautan ke API adalah seperti berikut:
https://api.dictionaryapi.dev/api/v2/entries/en/word
Reka Letak Hadapan Projek
Reka letak bahagian hadapan projek ini dibina menggunakan HTML dan TailwindCSS . Anda boleh mengimport TailwindCSS dalam fail HTML anda menggunakan CDN yang diberikan di bawah.
Halaman HTML mempunyai input dan butang di mana pengguna boleh memasukkan perkataan yang hendak dicari. Terdapat tiga lagi div untuk memaparkan bahagian pertuturan, pelbagai takrifan dan audio yang membantu anda menyebut perkataan dengan betul. Secara lalai, ketiga-tiga div ini tidak mempunyai sifat paparan. Apabila data diambil daripada API sifat paparan div ini akan ditetapkan untuk disekat.
Dictionary
<>
type="text"
placeholder="Enter the word"
id="word"
class="
py-2
w-1/4
focus:outline-none
border-2 border-green-600
rounded
px-3
"
/>
<>
id="search"
class="bg-green-600 text-white text-xl px-4 py-2 rounded">
Search
Bahagian hadapan ini akan kelihatan seperti ini
Menambah Fungsi Menggunakan JavaScript
Sebelum mengambil data melalui API dan memaparkannya, anda perlu mendapatkan akses kepada elemen HTML menggunakan idnya. Anda boleh mendapatkan akses kepada id menggunakan kaedah JavaScript getElementById() .
const word = document.getElementById("word"); const search = document.getElementById("search"); const display = document.getElementById("display"); const partOfSpeechDiv = document.getElementById("partOfSpeechDiv"); const partOfSpeechHeader = document.getElementById("partOfSpeechHeader"); const partOfSpeechPara = document.getElementById("partOfSpeechPara"); const meaningDiv = document.getElementById("meaningDiv"); const audioDiv = document.getElementById("audio"); const meaningHeader = document.getElementById("meaningHeader");
Menambah Pendengar Acara
Elemen input dalam halaman HTML mempunyai id bernama perkataan . Selepas mendapat akses kepada elemen input, anda boleh mendapatkan semula nilai teks dalam elemen input menggunakan atribut .value .
Butang carian mempunyai id bernama carian . Anda perlu menambah pendengar acara klik untuk mencetuskan acara dan membuat panggilan fungsi untuk mengambil data melalui API.
Async dan Tunggu
Sejak 2017, JavaScript telah memperkenalkan konsep async dan menunggu untuk melaksanakan permintaan asynchronous. Anda menggunakan async-await dan bukannya .then dan .catch untuk menyelesaikan dan menolak janji.
Berkaitan: Pengaturcaraan Segerak lwn. Tak Segerak: Bagaimanakah Ia Berbeza?
search.addEventListener("click", async () => { try { let url = `https://api.dictionaryapi.dev/api/v2/entries/en/${word.value.toLowerCase()}`; const res = await fetch(url); const data = await res.json(); displayData(data); } catch (error) { console.log(error); } });
Untuk bekerja dengan janji menggunakan async-await , anda perlu menambah kata kunci async sebelum definisi fungsi. Dan setiap kali anda membuat permintaan atau memanggil fungsi, anda perlu menambah kata kunci tunggu sebelum itu.
The Menanti kata kunci menjeda pelaksanaan selanjutnya fungsi sehingga permintaan sebelumnya tidak dapat disiapkan.
Anda perlu melakukan keseluruhan tindakan janji menunggu async dalam blok cuba-tangkap . Jika janji tidak dapat mengambil data maka ia akan memaparkan ralat dalam blok tangkapan . Sebelum menghantar perkataan kepada API, ia hendaklah dalam format huruf kecil untuk hasil yang tepat. Anda boleh menggunakan kaedah rentetan .huruf kecil() untuk menukar perkataan.
Kaedah pengambilan hendaklah mendapatkan semula data daripada API. Anda perlu menambah kata kunci tunggu supaya fungsi berhenti seketika semasa kaedah pengambilan sedang mendapatkan data.
Selepas mendapatkan semula data, anda perlu menukarnya dalam format JSON menggunakan kaedah .json() pada respons.
Memaparkan Data pada Halaman Web
Selepas mendapatkan semula data dan menukarnya kepada format JSON , anda perlu memaparkannya pada halaman web. Anda perlu memanggil kaedah displayData() dan menghantar data kepadanya.
Struktur tindak balas API adalah seperti berikut:
API mengembalikan bahagian pertuturan, pelbagai takrifan dan fonetik perkataan dalam respons.
Anda boleh mendapatkan semua definisi perkataan yang diberikan menggunakan:
const meanings = data[0].meanings[0].definitions;
Makna pembolehubah ialah tatasusunan yang mengandungi semua definisi perkataan yang diberikan.
Untuk mendapatkan Bahagian Ucapan perkataan yang diberikan:
const partOfSpeech = data[0].meanings[0].partOfSpeech;
Anda boleh menambah Bahagian Pertuturan perkataan menggunakan atribut .innerHTML . Kod HTML, pihak div ucapan mempunyai harta paparan tidak secara lalai tetapi, kod JavaScript, selepas semasa mengambil data, anda perlu menetapkan harta paparan untuk blok .
Memaparkan Definisi
Anda perlu mencipta pembolehubah bernama meaningList . Selepas melampirkan semua definisi pada pembolehubah ini, anda perlu memberikannya atribut .innerHTML untuk memaparkannya pada halaman web.
Berkaitan: Helaian Penipuan HTML Essentials: Teg, Atribut dan Banyak Lagi
Gelung melalui tatasusunan makna dan jejaki definisi tunggal dan indeks di mana ia hadir. Tambahkan definisi dan indeks tunggal pada pembolehubah meaningList di dalam elemen perenggan HTML.
Sebaik sahaja anda keluar dari gelung, anda perlu lulus kepada .innerHTML sifat meaningDiv .
Paparkan Elemen Audio pada Halaman Web
Respons yang diterima oleh API mengandungi fonetik yang membantu pengguna memahami sebutan perkataan. Untuk menambah bunyi ini pada halaman web, anda perlu mencipta elemen audio dan lulus fonetik dalam atribut src unsur tersebut. Akhir sekali, anda perlu meletakkan elemen audio dalam audioDiv menggunakan atribut .innerHTML .
const displayData = (data) => { console.log(data); const partOfSpeech = data[0].meanings[0].partOfSpeech; const meanings = data[0].meanings[0].definitions; partOfSpeechDiv.className = "bg-gray-100 px-2 py-3 flex flex-col w-1/4 justify-center items-center border-2 border-green-500 rounded block"; partOfSpeechHeader.innerHTML = "Part of Speech"; partOfSpeechPara.innerHTML = partOfSpeech; let meaningList = ``; meanings.forEach((meaning, ind) => { meaningList += `
${ind + 1}) ${
meaning.definition
}
`;
});
meaningDiv.className =
"pusat teks w-1/4 bg-kelabu-100 my-6 sempadan-2 sempadan-hijau-500 blok bulat";
meaningHeader.innerText = "Maksud";
meaningDiv.innerHTML = meaningList;
biarkan aud = `
`;
audioDiv.className = "blok";
audioDiv.innerHTML = aud;
};
Tambahkan Satu Lagi Projek ke Senarai Anda
Memandangkan anda telah belajar membina apl kamus menggunakan JavaScript, tiba masanya untuk anda membina sendiri beberapa projek yang menarik. Projek pembinaan bukan sahaja akan menyempurnakan asas anda tetapi juga menambah projek pada resume anda.
Mencari lebih banyak latihan tentang konsep manipulasi JavaScript dan DOM? Berikut ialah satu lagi projek yang boleh anda bina untuk mengukuhkan kemahiran anda.
Cara Menulis & Menyusun Kod Soliditi Pertama Anda
Solidity ialah bahasa pengaturcaraan yang digunakan oleh kontrak pintar pada blockchain Ethereum. Ia adalah bahasa pengaturcaraan berorientasikan objek yang ditaip secara statik.
SQL vs. NoSQL: Apakah Pangkalan Data Terbaik untuk Projek Anda Seterusnya?
SQL vs. NoSQL: Apakah Pangkalan Data Terbaik untuk Projek Anda Seterusnya?
Cara Mencari Kiub dan Petak Sempurna N-Digit Menggunakan Python, C++ dan JavaScript
Ramai pengaturcara suka menyelesaikan masalah matematik rumit menggunakan kod. Ia membantu menajamkan minda dan meningkatkan kemahiran menyelesaikan masalah. Dalam artikel ini, anda akan belajar cara mencari petak dan kiub sempurna n-digit terkecil dan terbesar menggunakan Python, C++ dan JavaScript. Setiap contoh juga mengandungi output sampel untuk beberapa nilai yang berbeza.
Cara Menggunakan Python sebagai Kalkulator Baris Perintah
Walaupun anda boleh menggunakan kalkulator grafik pada komputer anda, penterjemah bahasa pengaturcaraan Python boleh berfungsi sebagai kalkulator meja. Ia adalah jenaka yang popular dalam komuniti Python yang disebut dalam tutorial rasmi. Inilah cara anda boleh menggunakan Python sebagai kalkulator.
Bermula Dengan Buku Nota Jupyter: Satu Tutorial
Jika anda seorang saintis data yang bercita-cita tinggi yang bekerja dengan Python atau R, anda perlu tahu cara menggunakan Jupyter Notebook. Ia adalah IDE sumber terbuka dan berasaskan pelayan untuk memanipulasi data, berkongsi kod langsung, serta mengurus aliran kerja sains data.
Pengekodan Bukan untuk Semua Orang: 9 Pekerjaan Teknologi yang Anda Boleh Dapatkan Tanpanya
Teknologi, tidak dinafikan, adalah industri masa depan. Jika anda salah seorang daripada berjuta-juta dewasa muda yang akan terjun ke peringkat pertama kerjaya anda, anda mungkin tertanya-tanya apa yang perlu dilakukan jika anda tidak suka pengekodan.
7 Perintah Penting untuk Bermula Dengan Python untuk Pemula
Mempelajari bahasa pengaturcaraan baharu seperti Python menjadi mudah jika anda mempunyai peta jalan yang komprehensif yang memperincikan konsep yang perlu dipelajari sebagai pemula dan cara untuk maju lebih jauh untuk mencapai pencapaian seterusnya. Malah pengaturcara perantaraan harus kerap meneliti asas mereka untuk membina asas yang kukuh untuk diri mereka sendiri.
Aplikasi Web ASP.NET Pertama Anda: Cara Bermula
ASP.NET ialah rangka kerja merentas platform percuma Microsoft untuk membina apl dan perkhidmatan web. Platform ASP.NET ialah sambungan kepada .NET, platform pembangun alat, bahasa pengaturcaraan dan perpustakaan yang digunakan untuk membina aplikasi yang berbeza.
9 Alternatif Docker Terbaik untuk Pengurusan Kontena
Bekas sangat bermanfaat untuk pembangunan perisian, penggunaan dan pengurusan dalam persekitaran maya. Docker berguna dalam proses kontena, tetapi ia bukan satu-satunya platform yang ada. Jika anda sedang mencari beberapa alternatif kepada Docker, jangan cari lagi. Senarai ini mempamerkan beberapa alternatif Docker yang kaya dengan ciri dan cekap untuk digunakan dalam projek anda yang seterusnya.
Adakah ARCore atau ARKit Lebih Baik Untuk Mencipta Pengalaman Realiti Diperkukuh?
Beberapa aplikasi dan pengalaman mudah alih yang paling banyak diperkatakan hari ini menggunakan teknologi realiti tambahan. Walaupun sesetengah pengalaman ini boleh berfungsi pada hampir mana-mana peranti mudah alih, yang lain hanya berfungsi pada model yang lebih baharu dan lebih mahal. Membangunkan dan menggunakan pengalaman yang lebih mantap ini memerlukan ARCore dan ARKit.
Cara Membuat Cawangan Baharu dalam Git
Cawangan adalah teras kepada konsep kawalan versi dalam pengaturcaraan, dan Git khususnya. Artikel permulaan ini memberitahu anda apa itu cawangan dan cara menciptanya menggunakan beberapa alatan yang berbeza.
Cara Menggunakan Python if Statement
Pernyataan if adalah penggerak pengaturcaraan logik. Akibatnya, pemahaman yang lebih baik tentang Pythons adalah tambahan penting kepada kemahiran pengaturcaraan Python anda.
5 Lencana Teratas Yang Akan Mengecas Repositori GitHub Anda
Lencana GitHub boleh meningkatkan kebolehbacaan repositori dengan menyediakan pengguna dengan cara yang pantas untuk menangkap metrik repositori. Lencana boleh dibenamkan dalam README.md anda untuk menjelaskan kepentingan dan keperluan projek anda kepada pembangun lain. Akibatnya, pembaca mendapat idea yang sangat pantas tentang repositori dengan menyemak lencana yang dilampirkan.
Bermula Dengan Redis dan PHP untuk Penyimpanan Data Pantas
Enjin storan Redis yang popular ialah alat yang sangat baik dan mesti ada dalam mana-mana senjata pembangun perisian. Enjin storan dalam memori membolehkan penyimpanan dan mendapatkan semula data yang sangat pantas, sehingga 32 juta pertanyaan sesaat yang mengagumkan, menjadikannya pelengkap utama kepada mana-mana enjin pangkalan data utama.
Apakah WYSIWYG?
Sebahagian daripada keajaiban pembangunan perisian berlaku apabila baris kod berubah menjadi lebih daripada jumlah bahagiannya. Anda akan mendapati anda memerlukan sedikit visualisasi kreatif apabila cuba membina secara abstrak dengan cara ini. Ini boleh berlaku untuk pemprosesan perkataan atau reka bentuk web, sama seperti yang boleh dilakukan untuk pengaturcaraan.
Cara Memasang .NET Framework Versi 3.5 pada Windows 10
Sebagai pengguna Windows, anda mungkin sekurang-kurangnya sekali menjumpai perkataan .NET Framework. Ia merupakan rangka kerja perisian yang dibangunkan oleh Microsoft yang membolehkan anda membina dan menjalankan program C#, C++, F# dan Visual Basic. Versi .NET terkini ialah 4.8, tetapi komputer anda mungkin memerlukan versi .NET yang lebih lama (seperti .NET 3.5) untuk menjalankan beberapa apl.
WordPress vs. Wix: Perbezaan Utama
Anda sering menghadapi dilema klasik semasa membina tapak web untuk diri sendiri atau perniagaan anda. WordPress vs. Wix—yang mana satu untuk dipilih dan apakah pilihan terbaik untuk anda?
10 Distro Linux Terbaik untuk Pembangun
Walaupun Linux mungkin bukan sistem pengendalian yang digemari untuk pengguna biasa, ia adalah pilihan utama untuk kebanyakan pembangun dan pengaturcara. Linux ialah OS yang lebih praktikal yang direka secara eksplisit dengan mengambil kira pengaturcaraan dan pembangun.
Cara Menyasarkan Bahagian Halaman Web Menggunakan Pemilih CSS
Cascading Style Sheets (CSS) membolehkan anda mengubah rupa halaman web anda. Daripada fon dan warna kepada jarak dan susun atur keseluruhan, semua jenis alatan reka bentuk berada di hujung jari anda. Walaupun CSS adalah bahasa yang rumit secara keseluruhannya, hanya terdapat dua konsep asas yang perlu anda fahami untuk bermula.
Cara Mengira Nilai nCr
Gabungan ialah konsep matematik. Ia merujuk kepada susunan beberapa objek yang susunannya tidak relevan. Formula asas menerangkan bilangan gabungan yang sah.
Cara Menulis & Menyusun Kod Soliditi Pertama Anda
Solidity ialah bahasa pengaturcaraan yang digunakan oleh kontrak pintar pada blockchain Ethereum. Ia adalah bahasa pengaturcaraan berorientasikan objek yang ditaip secara statik.
SQL vs. NoSQL: Apakah Pangkalan Data Terbaik untuk Projek Anda Seterusnya?
SQL vs. NoSQL: Apakah Pangkalan Data Terbaik untuk Projek Anda Seterusnya?
Cara Mencari Kiub dan Petak Sempurna N-Digit Menggunakan Python, C++ dan JavaScript
Ramai pengaturcara suka menyelesaikan masalah matematik rumit menggunakan kod. Ia membantu menajamkan minda dan meningkatkan kemahiran menyelesaikan masalah. Dalam artikel ini, anda akan belajar cara mencari petak dan kiub sempurna n-digit terkecil dan terbesar menggunakan Python, C++ dan JavaScript. Setiap contoh juga mengandungi output sampel untuk beberapa nilai yang berbeza.
Cara Menggunakan Python sebagai Kalkulator Baris Perintah
Walaupun anda boleh menggunakan kalkulator grafik pada komputer anda, penterjemah bahasa pengaturcaraan Python boleh berfungsi sebagai kalkulator meja. Ia adalah jenaka yang popular dalam komuniti Python yang disebut dalam tutorial rasmi. Inilah cara anda boleh menggunakan Python sebagai kalkulator.
Cara Membenamkan Tweet dalam Siaran WordPress Anda
Membenamkan perkhidmatan pihak ketiga pada siaran WordPress anda ialah cara yang menarik untuk memikat minat pelawat. Kandungan terbenam juga menyediakan isyarat visual yang memudahkan pengimbasan. WordPress telah memudahkan penambahan jenis kandungan ini.
Bermula Dengan Buku Nota Jupyter: Satu Tutorial
Jika anda seorang saintis data yang bercita-cita tinggi yang bekerja dengan Python atau R, anda perlu tahu cara menggunakan Jupyter Notebook. Ia adalah IDE sumber terbuka dan berasaskan pelayan untuk memanipulasi data, berkongsi kod langsung, serta mengurus aliran kerja sains data.
Pengekodan Bukan untuk Semua Orang: 9 Pekerjaan Teknologi yang Anda Boleh Dapatkan Tanpanya
Teknologi, tidak dinafikan, adalah industri masa depan. Jika anda salah seorang daripada berjuta-juta dewasa muda yang akan terjun ke peringkat pertama kerjaya anda, anda mungkin tertanya-tanya apa yang perlu dilakukan jika anda tidak suka pengekodan.
7 Perintah Penting untuk Bermula Dengan Python untuk Pemula
Mempelajari bahasa pengaturcaraan baharu seperti Python menjadi mudah jika anda mempunyai peta jalan yang komprehensif yang memperincikan konsep yang perlu dipelajari sebagai pemula dan cara untuk maju lebih jauh untuk mencapai pencapaian seterusnya. Malah pengaturcara perantaraan harus kerap meneliti asas mereka untuk membina asas yang kukuh untuk diri mereka sendiri.
Aplikasi Web ASP.NET Pertama Anda: Cara Bermula
ASP.NET ialah rangka kerja merentas platform percuma Microsoft untuk membina apl dan perkhidmatan web. Platform ASP.NET ialah sambungan kepada .NET, platform pembangun alat, bahasa pengaturcaraan dan perpustakaan yang digunakan untuk membina aplikasi yang berbeza.