current position:Home>13 JavaScript one-line programs that make you look like an expert

13 JavaScript one-line programs that make you look like an expert

2021-08-23 10:31:18 .Der_ Rabe

watermark,size_14,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_100,g_se,x_10,y_10,shadow_20,type_ZmFuZ3poZW5naGVpdGk=JavaScript Can do a lot of fun , From complex frameworks to processing API, There's so much to learn . however , It also allows us to do great things in one line .

1. Get a random Boolean value (true/false

This function uses Math.random() Method returns a Boolean value (true perhaps false).Math.random Create a 0 To 1 Random number between , We just need to check if it's above or below 0.5, There is 50% Opportunity to get true or false.

const randomBoolean = () => Math.random() >= 0.5;
console.log(randomBoolean());
 Copy code 
       
  • 1.
  • 2.
  • 3.

2. Check that the date provided is a working day

Using this method , We can check whether the date provided in the function is a weekday or weekend day .

const isWeekday = (date) => date.getDay() % 6 !== 0;

console.log(isWeekday(new Date(2021, 7, 6)));
// true   Because it's Friday 

console.log(isWeekday(new Date(2021, 7, 7)));
// false  Because it's Saturday 
 Copy code 
       
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.

3. Reverse string

There are several different ways to reverse a string . This is the simplest one , Use split()reverse() and join() Method .

const reverse = str => str.split('').reverse().join('');
reverse('hello world');     
// 'dlrow olleh'
 Copy code 
       
  • 1.
  • 2.
  • 3.
  • 4.

4. Check whether the current tag is hidden

Document.hidden ( Read-only property ) Returns a Boolean value , Indicates that the page is (true) no (false) hide .

const isBrowserTabInView = () => document.hidden;
isBrowserTabInView();
 Copy code 
       
  • 1.
  • 2.
  • 3.

Outside : Inadvertently found that iqiyi's advertisement playing time actually counts down when the current tab is activated , When leaving the current tab , The countdown stops , Baidu found document.hidden This east east .

document.hidden yes h5 New addition api There is a compatibility problem when using .

var hidden
if (typeof document.hidden !== "undefined") {
    hidden = "hidden";
} else if (typeof document.mozHidden !== "undefined") {
    hidden = "mozHidden";
} else if (typeof document.msHidden !== "undefined") {
    hidden = "msHidden";
} else if (typeof document.webkitHidden !== "undefined") {
    hidden = "webkitHidden";
}
console.log(" Whether the current page is hidden :" + document[hidden])
 Copy code 
       
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.

5. Check whether a number is even or odd

const isEven = num => num % 2 === 0;
console.log(isEven(2));
// true
console.log(isEven(3));
// false
 Copy code 
       
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.

6. Get the time from a date

const timeFromDate = date => date.toTimeString().slice(0, 8);

console.log(timeFromDate(new Date(2021, 0, 10, 17, 30, 0))); 
// "17:30:00"

console.log(timeFromDate(new Date()));
//  Print the current time 
 Copy code 
       
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.

7. Retain n Decimal place

const toFixed = (n, fixed) => ~~(Math.pow(10, fixed) * n) / Math.pow(10, fixed);
//  Example 
toFixed(25.198726354, 1);       // 25.1
toFixed(25.198726354, 2);       // 25.19
toFixed(25.198726354, 3);       // 25.198
toFixed(25.198726354, 4);       // 25.1987
toFixed(25.198726354, 5);       // 25.19872
toFixed(25.198726354, 6);       // 25.198726
 Copy code 
       
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.

8. Check if any element is currently in focus

We can use document.activeElement Property to check whether an element is currently in focus .

const elementIsInFocus = (el) => (el === document.activeElement);
elementIsInFocus(anyElement)
//  If you return in focus true, If you don't return in focus  false
 Copy code 
       
  • 1.
  • 2.
  • 3.
  • 4.

9. Check whether the current browser supports touch events

const touchSupported = () => {
  ('ontouchstart' in window || window.DocumentTouch && document instanceof window.DocumentTouch);
}
console.log(touchSupported());
//  If touch events are supported , Will return true, If not, return false.
 Copy code 
       
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.

10. Check whether the current browser is on the Apple device

const isAppleDevice = /Mac|iPod|iPhone|iPad/.test(navigator.platform);
console.log(isAppleDevice);
 Copy code 
       
  • 1.
  • 2.
  • 3.

11. Scroll to the top of the page

const goToTop = () => window.scrollTo(0, 0);
goToTop();
 Copy code 
       
  • 1.
  • 2.
  • 3.

12. Get the average value of the parameter

const average = (...args) => args.reduce((a, b) => a + b) / args.length;
average(1, 2, 3, 4);
// 2.5
 Copy code 
       
  • 1.
  • 2.
  • 3.
  • 4.

13. Fahrenheit / Celsius conversion

const celsiusToFahrenheit = (celsius) => celsius * 9/5 + 32;
const fahrenheitToCelsius = (fahrenheit) => (fahrenheit - 32) * 5/9;
//  Example 
celsiusToFahrenheit(15);    // 59
celsiusToFahrenheit(0);     // 32
celsiusToFahrenheit(-20);   // -4
fahrenheitToCelsius(59);    // 15
fahrenheitToCelsius(32);    // 0
 Copy code 
       
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.

~ End , I'm a dishwasher , Club massage walk up


author : The front end little wisdom
link :https://juejin.cn/post/6997930259953745950
source : Nuggets
The copyright belongs to the author . Commercial reprint please contact the author for authorization , Non-commercial reprint please indicate the source .

copyright notice
author[.Der_ Rabe],Please bring the original link to reprint, thank you.
https://en.qdmana.com/2021/08/20210823103114516u.html

Random recommended