Rumah > Artikel > hujung hadapan web > 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!