


33 kod satu baris JavaScript yang sangat praktikal, adalah disyorkan untuk mengumpulnya!
Artikel ini membawakan anda 33 kod satu baris JavaScript yang sangat praktikal, disusun dan dikongsi dengan anda Kaedah ini menggunakan beberapa API untuk memudahkan operasi, tetapi beberapa kaedah tidak begitu elegan untuk menulis satu baris, jadi inilah yang utama. Ketahui cara menggunakan API! Semoga ia membantu semua orang.
1. Pemprosesan tarikh
1 >
Kaedah ini digunakan untuk menyemak sama ada tarikh yang diberikan adalah sah:const isDateValid = (...val) => !Number.isNaN(new Date(...val).valueOf()); isDateValid("December 17, 1995 03:24:00"); // true
2. Kira selang antara dua tarikh
Ini kaedah Digunakan untuk mengira selang antara dua tarikh:const dayDif = (date1, date2) => Math.ceil(Math.abs(date1.getTime() - date2.getTime()) / 86400000) dayDif(new Date("2021-11-3"), new Date("2022-2-1")) // 90
3 Cari hari dalam tahun di mana tarikh itu terletak
Kaedah ini digunakan untuk. mengesan Tarikh yang diberikan adalah pada hari apa dalam tahun:const dayOfYear = (date) => Math.floor((date - new Date(date.getFullYear(), 0, 0)) / 1000 / 60 / 60 / 24); dayOfYear(new Date()); // 3072021 telah berlalu
4 Pemformatan masa
Kaedah ini Format yang boleh digunakan untuk menukar masa kepada jam:minit:saat:const timeFromDate = date => date.toTimeString().slice(0, 8); timeFromDate(new Date(2021, 11, 2, 12, 30, 0)); // 12:30:00 timeFromDate(new Date()); // 返回当前时间 09:00:00
2. Pemprosesan rentetan
1. Gunakan huruf besar pada huruf pertama rentetan
Kaedah ini digunakan untuk menggunakan huruf besar rentetan bahasa Inggeris:const capitalize = str => str.charAt(0).toUpperCase() + str.slice(1) capitalize("hello world") // Hello world
2. Balikkan rentetan
Kaedah ini digunakan untuk membalikkan rentetan dan mengembalikan rentetan terbalik:const reverse = str => str.split('').reverse().join(''); reverse('hello world'); // 'dlrow olleh'
3 Rentetan rawak
Kaedah ini digunakan untuk hasilkan rentetan rawak:const randomString = () => Math.random().toString(36).slice(2); randomString();
4 Potong rentetan
Kaedah ini boleh memotong rentetan daripada panjang yang ditentukan:const truncateString = (string, length) => string.length < length ? string : `${string.slice(0, length - 3)}...`; truncateString('Hi, I should be truncated because I am too loooong!', 36) // 'Hi, I should be truncated because...'5. Alih keluar HTML daripada rentetan
Kaedah ini digunakan untuk mengalih keluar elemen HTML daripada rentetan:
const stripHtml = html => (new DOMParser().parseFromString(html, 'text/html')).body.textContent || '';
3 🎜>1 Alih keluar item pendua daripada tatasusunan
Kaedah ini digunakan untuk mengalih keluar item pendua daripada susunan Pendua:
2 Tentukan sama ada tatasusunan kosongconst removeDuplicates = (arr) => [...new Set(arr)]; console.log(removeDuplicates([1, 2, 2, 3, 3, 4, 4, 5, 5, 6]));
Kaedah ini digunakan untuk menentukan sama ada tatasusunan ialah tatasusunan kosong, ia akan mengembalikan nilai Boolean :
3. Cantumkan dua tatasusunanconst isNotEmpty = arr => Array.isArray(arr) && arr.length > 0; isNotEmpty([1, 2, 3]); // true
Anda boleh menggunakan dua kaedah berikut untuk menggabungkan dua tatasusunan:
const merge = (a, b) => a.concat(b); const merge = (a, b) => [...a, ...b];4. Operasi nombor
1 Tentukan sama ada nombor ganjil atau genap
Kaedah ini digunakan untuk menentukan sama ada nombor Ganjil atau genap:
2 Dapatkan purata set nomborconst isEven = num => num % 2 === 0; isEven(996);
3 Dapatkan rawak antara dua integer
const average = (...args) => args.reduce((a, b) => a + b) / args.length; average(1, 2, 3, 4, 5); // 3
Kaedah ini digunakan untuk mendapatkan integer rawak antara dua integer
4. digunakan untuk membundarkan nombor mengikut digit yang ditentukan:const random = (min, max) => Math.floor(Math.random() * (max - min + 1) + min); random(1, 50);
5 Operasi warna
const round = (n, d) => Number(Math.round(n + "e" + d) + "e-" + d) round(1.005, 2) //1.01 round(1.555, 2) //1.56
1 mekanisme penukaran Kaedah ini boleh menukar nilai warna RGB kepada nilai heksadesimal:
2 Dapatkan Warna Tersuai perenambelasan rawak
Kaedah ini digunakan untuk mendapatkan nilai warna heksadesimal rawak:const rgbToHex = (r, g, b) => "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1); rgbToHex(255, 255, 255); // '#ffffff'
6. Operasi Pelayar
const randomHex = () => `#${Math.floor(Math.random() * 0xffffff).toString(16).padEnd(6, "0")}`; randomHex();
1. Salin kandungan ke papan keratan Kaedah ini menggunakan navigator.clipboard.writeText untuk menyalin teks ke papan keratan:
Kosongkan semua kuki
Kaedah ini boleh mengakses kuki dan mengosongkan semua kuki yang disimpan dalam halaman web dengan menggunakan document.cookie:const copyToClipboard = (text) => navigator.clipboard.writeText(text); copyToClipboard("Hello World");
3 Dapatkan teks yang dipilih
Kaedah ini mendapatkan teks yang dipilih oleh pengguna melalui atribut getSelection terbina dalam:const clearCookies = document.cookie.split(';').forEach(cookie => document.cookie = cookie.replace(/^ +/, '').replace(/=.*/, `=;expires=${new Date(0).toUTCString()};path=/`));
4 Kesan sama ada ia adalah Mod gelap
Kaedah ini digunakan untuk mengesan sama ada persekitaran semasa ialah mod gelap, ia ialah nilai Boolean:const getSelectedText = () => window.getSelection().toString(); getSelectedText();
5 Tatal ke bahagian atas halaman
Kaedah ini digunakan untuk kembali ke bahagian atas halaman:const isDarkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches console.log(isDarkMode)
6 Tentukan sama ada halaman tab semasa diaktifkan
Kaedah ini digunakan untuk mengesan Sama ada. halaman tab semasa telah diaktifkan:const goToTop = () => window.scrollTo(0, 0); goToTop();
7 Tentukan sama ada peranti semasa ialah peranti Apple
Kaedah ini digunakan untuk mengesan sama ada peranti semasa adalah. peranti Apple:const isTabInView = () => !document.hidden;
8 Sama ada hendak menatal ke bahagian bawah halaman
Kaedah ini digunakan untuk menentukan sama ada halaman itu berada di bahagian bawah:const isAppleDevice = () => /Mac|iPod|iPhone|iPad/.test(navigator.platform); isAppleDevice();
9. Ubah hala ke URL
Kaedah ini digunakan untuk mengubah hala ke URL baharu:const scrolledToBottom = () => document.documentElement.clientHeight + window.scrollY >= document.documentElement.scrollHeight;
10. Buka kotak cetakan penyemak imbas
Kaedah ini digunakan untuk membuka kotak cetakan penyemak imbas:const redirect = url => location.href = url redirect("https://www.google.com/")
Operasi lain
const showPrintDialog = () => window.print()
1. Nilai Boolean RawakKaedah ini boleh mengembalikan nilai Boolean rawak Gunakan Math.random() untuk mendapatkan nombor rawak dari 0-1. Bandingkan dengan 0.5, dan anda akan mempunyai separuh kebarangkalian Dapatkan nilai benar atau salah.
2. Pertukaran pembolehubah
Anda boleh menggunakan borang berikut untuk menukar nilai dua pembolehubah apabila pembolehubah ketiga tidak berkenaan:const randomBoolean = () => Math.random() >= 0.5; randomBoolean();
3 Dapatkan jenis pembolehubah
Kaedah ini digunakan untuk mendapatkan jenis pembolehubah:[foo, bar] = [bar, foo];
<.>4. Penukaran Fahrenheit antara darjah Celsius
该方法用于摄氏度和华氏度之间的转化:
const celsiusToFahrenheit = (celsius) => celsius * 9/5 + 32; const fahrenheitToCelsius = (fahrenheit) => (fahrenheit - 32) * 5/9; celsiusToFahrenheit(15); // 59 celsiusToFahrenheit(0); // 32 celsiusToFahrenheit(-20); // -4 fahrenheitToCelsius(59); // 15 fahrenheitToCelsius(32); // 0
5. 检测对象是否为空
该方法用于检测一个JavaScript对象是否为空:
const isEmpty = obj => Reflect.ownKeys(obj).length === 0 && obj.constructor === Object;
【相关推荐:javascript学习教程】
Atas ialah kandungan terperinci 33 kod satu baris JavaScript yang sangat praktikal, adalah disyorkan untuk mengumpulnya!. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Ya, reactapplicationscanbeseo-friendlywithpropstrategies.1) useserver-siderendering (ssr) withtoolslikenext.jstogeneratenerlhtmlforindexing.2) pelaksanaan stationsitationeration (ssg) forcontent-heavysitestopre-renderpageStoStoStoStoStoStoStoStoStoStoStoStoStoStoStoStoStoStoStoStoStoStoStetBuild

Kesesakan prestasi bertindak balas terutamanya disebabkan oleh rendering yang tidak cekap, pengubahsuaian semula dan pengiraan komponen berat dalaman komponen. 1) Gunakan ReactDevTools untuk mencari komponen perlahan dan gunakan pengoptimuman reaksi. 2) Mengoptimumkan useeffect untuk memastikan bahawa ia hanya berjalan apabila perlu. 3) Gunakan usememo dan usecallback untuk pemprosesan memori. 4) Pecahkan komponen besar ke dalam komponen kecil. 5) Untuk senarai data besar, gunakan teknologi menatal maya untuk mengoptimumkan rendering. Melalui kaedah ini, prestasi aplikasi React dapat ditingkatkan dengan ketara.

Seseorang mungkin mencari alternatif untuk bertindak balas kerana masalah prestasi, lengkung pembelajaran, atau meneroka kaedah pembangunan UI yang berbeza. 1) Vue.js dipuji kerana kemudahan integrasi dan lengkung pembelajaran ringan, sesuai untuk aplikasi kecil dan besar. 2) Angular dibangunkan oleh Google dan sesuai untuk aplikasi besar, dengan sistem jenis yang kuat dan suntikan ketergantungan. 3) Svelte menyediakan prestasi dan kesederhanaan yang sangat baik dengan menyusunnya ke dalam JavaScript yang cekap pada masa membina, tetapi ekosistemnya masih berkembang. Apabila memilih alternatif, mereka harus ditentukan berdasarkan keperluan projek, pengalaman pasukan dan saiz projek.

KekunciSinreacTarespecialTributSassignedtoElementSinarrayStableIdentity, crucialforthereconcililiatiationalgorithmwhichupdatesthedomefficiently.1)

ToreduceSetupoverheadinreactprojects, usetoolslikecreatereactapp (CRA), next.js, gatsby, orstarterkits, andmaintainamodularstructur E.1) crasimplifiessetupwithasinglecommand.2) next.jsandgatsbyofforefeaturesbutalearningcurve.3) starterkitsprovideecomprehensi

useState () isareacthookusedtomanagestateinfunctionalcomponents.1) itinitializesandupdatesstate, 2) harusbecalledatthetoplevelofcomponents, 3) canleadto'stalestate'ifnotusedCorrecly, dan4)

Reactispopularduetoitscomponent-berasaskan-berasaskan, virtualdom, richecosystem, anddeclarativenature.1) komponen-berasaskan komponen yang tidak dapat dipisahkan.

TODEBUGREACTAPPLICATIONSEFECTIVELY, USETHESESTRATION


Alat AI Hot

Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool
Gambar buka pakaian secara percuma

Clothoff.io
Penyingkiran pakaian AI

Video Face Swap
Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Artikel Panas

Alat panas

Pelayar Peperiksaan Selamat
Pelayar Peperiksaan Selamat ialah persekitaran pelayar selamat untuk mengambil peperiksaan dalam talian dengan selamat. Perisian ini menukar mana-mana komputer menjadi stesen kerja yang selamat. Ia mengawal akses kepada mana-mana utiliti dan menghalang pelajar daripada menggunakan sumber yang tidak dibenarkan.

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

DVWA
Damn Vulnerable Web App (DVWA) ialah aplikasi web PHP/MySQL yang sangat terdedah. Matlamat utamanya adalah untuk menjadi bantuan bagi profesional keselamatan untuk menguji kemahiran dan alatan mereka dalam persekitaran undang-undang, untuk membantu pembangun web lebih memahami proses mengamankan aplikasi web, dan untuk membantu guru/pelajar mengajar/belajar dalam persekitaran bilik darjah Aplikasi web keselamatan. Matlamat DVWA adalah untuk mempraktikkan beberapa kelemahan web yang paling biasa melalui antara muka yang mudah dan mudah, dengan pelbagai tahap kesukaran. Sila ambil perhatian bahawa perisian ini

EditPlus versi Cina retak
Saiz kecil, penyerlahan sintaks, tidak menyokong fungsi gesaan kod

VSCode Windows 64-bit Muat Turun
Editor IDE percuma dan berkuasa yang dilancarkan oleh Microsoft
