Rumah > hujung hadapan web > Soal Jawab bahagian hadapan > 33 kod satu baris JavaScript yang sangat praktikal, adalah disyorkan untuk mengumpulnya!

33 kod satu baris JavaScript yang sangat praktikal, adalah disyorkan untuk mengumpulnya!

WBOY
Lepaskan: 2022-01-12 17:22:15
ke hadapan
1627 orang telah melayarinya

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.

33 kod satu baris JavaScript yang sangat praktikal, adalah disyorkan untuk mengumpulnya!

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
Salin selepas log masuk

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
Salin selepas log masuk

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());   // 307
Salin selepas log masuk
2021 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
Salin selepas log masuk

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
Salin selepas log masuk

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'
Salin selepas log masuk

3 Rentetan rawak

Kaedah ini digunakan untuk hasilkan rentetan rawak:

const randomString = () => Math.random().toString(36).slice(2);
randomString();
Salin selepas log masuk

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(&#39;Hi, I should be truncated because I am too loooong!&#39;, 36)   // &#39;Hi, I should be truncated because...&#39;
Salin selepas log masuk
5. Alih keluar HTML daripada rentetan

Kaedah ini digunakan untuk mengalih keluar elemen HTML daripada rentetan:

const stripHtml = html => (new DOMParser().parseFromString(html, &#39;text/html&#39;)).body.textContent || &#39;&#39;;
Salin selepas log masuk

3 🎜>1 Alih keluar item pendua daripada tatasusunan

Kaedah ini digunakan untuk mengalih keluar item pendua daripada susunan Pendua:

2 Tentukan sama ada tatasusunan kosong
const removeDuplicates = (arr) => [...new Set(arr)];
console.log(removeDuplicates([1, 2, 2, 3, 3, 4, 4, 5, 5, 6]));
Salin selepas log masuk

Kaedah ini digunakan untuk menentukan sama ada tatasusunan ialah tatasusunan kosong, ia akan mengembalikan nilai Boolean :

3. Cantumkan dua tatasusunan
const isNotEmpty = arr => Array.isArray(arr) && arr.length > 0;
isNotEmpty([1, 2, 3]);  // true
Salin selepas log masuk

Anda boleh menggunakan dua kaedah berikut untuk menggabungkan dua tatasusunan:

const merge = (a, b) => a.concat(b);
const merge = (a, b) => [...a, ...b];
Salin selepas log masuk
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 nombor
const isEven = num => num % 2 === 0;
isEven(996);
Salin selepas log masuk

3 Dapatkan rawak antara dua integer
const average = (...args) => args.reduce((a, b) => a + b) / args.length;
average(1, 2, 3, 4, 5);   // 3
Salin selepas log masuk

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);
Salin selepas log masuk

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
Salin selepas log masuk

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);  // &#39;#ffffff&#39;
Salin selepas log masuk

6. Operasi Pelayar

const randomHex = () => `#${Math.floor(Math.random() * 0xffffff).toString(16).padEnd(6, "0")}`;
randomHex();
Salin selepas log masuk

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");
Salin selepas log masuk

3 Dapatkan teks yang dipilih

Kaedah ini mendapatkan teks yang dipilih oleh pengguna melalui atribut getSelection terbina dalam:
const clearCookies = document.cookie.split(&#39;;&#39;).forEach(cookie => document.cookie = cookie.replace(/^ +/, &#39;&#39;).replace(/=.*/, `=;expires=${new Date(0).toUTCString()};path=/`));
Salin selepas log masuk

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();
Salin selepas log masuk

5 Tatal ke bahagian atas halaman

Kaedah ini digunakan untuk kembali ke bahagian atas halaman:
const isDarkMode = window.matchMedia && window.matchMedia(&#39;(prefers-color-scheme: dark)&#39;).matches
console.log(isDarkMode)
Salin selepas log masuk

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();
Salin selepas log masuk

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;
Salin selepas log masuk

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();
Salin selepas log masuk

9. Ubah hala ke URL

Kaedah ini digunakan untuk mengubah hala ke URL baharu:
const scrolledToBottom = () => document.documentElement.clientHeight + window.scrollY >= document.documentElement.scrollHeight;
Salin selepas log masuk

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/")
Salin selepas log masuk

Operasi lain

const showPrintDialog = () => window.print()
Salin selepas log masuk

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();
Salin selepas log masuk

3 Dapatkan jenis pembolehubah

Kaedah ini digunakan untuk mendapatkan jenis pembolehubah:
[foo, bar] = [bar, foo];
Salin selepas log masuk

<. 🎜>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
Salin selepas log masuk

5. 检测对象是否为空

该方法用于检测一个JavaScript对象是否为空:

const isEmpty = obj => Reflect.ownKeys(obj).length === 0 && obj.constructor === Object;
Salin selepas log masuk

【相关推荐: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!

Label berkaitan:
sumber:juejin.im
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan