あなたをエキスパートに見せるための 13 個の JavaScript ワンライナー

あなたをエキスパートに見せるための 13 個の JavaScript ワンライナー

1. ランダムなブール値( true / false )を取得する

この関数はMath.random()メソッドを使用し、ブール値 ( trueまたはalse ) を返します。 Math.random は 0 から 1 の間の乱数を生成し、それが 0.5 より大きいか小さいかをチェックするだけで、true または false になる確率は 50% になります。

const randomBoolean = () => Math.random() >= 0.5;
コンソールにログ出力します。

2. 指定された日付が営業日であるかどうかを確認する

このメソッドを使用すると、関数で指定された日付が平日か週末かを確認できます。

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

console.log(isWeekday(新しい日付(2021, 7, 6)));
// 金曜日なので trueconsole.log(isWeekday(new Date(2021, 7, 7)));
// 土曜日なのでfalse

3. 文字列を反転する

文字列を反転する方法はいくつかあります。これは、split()、reverse()、join() メソッドを使用する最も単純な方法です。

const 逆 = str => str.split('').reverse().join('');
逆('hello world');     
// 'ダウンロード'

4. 現在のタブが非表示になっているかどうかを確認する

Document.hidden (読み取り専用プロパティ) は、ページが非表示になっているか ( true )、そうでないか ( false ) を示すブール値を返します。

const isBrowserTabInView = () => document.hidden;
ブラウザタブがビュー内にあるかどうかを確認します。

オフサイト: iQiyi 広告の再生時間は、現在のタブがアクティブになっているときのみカウントダウンされることを偶然発見しました。現在のタブを離れると、カウントダウンは停止します。Baidu で検索したところ、 document.hidden見つけました。

document.hidden h5 に追加された新しい API であり、使用すると互換性の問題が生じます。

var 非表示
if (typeof document.hidden !== "undefined") {
    hidden = "隠し";
} そうでない場合 (typeof document.mozHidden !== "undefined") {
    非表示 = "mozHidden";
} そうでない場合 (typeof document.msHidden !== "undefined") {
    非表示 = "msHidden";
} そうでない場合 (typeof document.webkitHidden !== "undefined") {
    非表示 = "webkitHidden";
}
console.log("現在のページは非表示ですか: " + document[hidden])

5. 数字が偶数か奇数かを確認する

const isEven = num => num % 2 === 0;
コンソールログ(isEven(2));
// 真実
コンソールログ(isEven(3));
// 間違い

6. 日付から時間を取得する

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

コンソールにログ出力します。 
// "17:30:00"

コンソールにログ出力します。
// 現在の時刻を出力します

7. 小数点以下n桁を保持する

const toFixed = (n, fixed) => ~~(Math.pow(10, fixed) * n) / Math.pow(10, fixed);
// 例 toFixed(25.198726354, 1); // 25.1
固定(25.198726354, 2); // 25.19
固定(25.198726354, 3); // 25.198
toFixed(25.198726354, 4); // 25.1987
toFixed(25.198726354, 5); // 25.19872
toFixed(25.198726354, 6); // 25.198726

8. 要素が現在フォーカスされているかどうかを確認する

document.activeElementプロパティを使用して、要素が現在フォーカスされているかどうかを確認できます。

要素がフォーカスされているかどうかをconstで指定します。
要素がフォーカスされているかどうか(任意の要素)
// フォーカスされている場合は true を返し、フォーカスされていない場合は false を返します

9. 現在のブラウザがタッチイベントをサポートしているかどうかを確認する

定数 touchSupported = () => {
  (ウィンドウ内の 'ontouchstart' || window.DocumentTouch && ドキュメントの instanceof window.DocumentTouch);
}
コンソールにログを記録します。
// タッチ イベントがサポートされている場合は true が返され、そうでない場合は false が返されます。

10. 現在のブラウザがAppleデバイス上にあるかどうかを確認する

const isAppleDevice = /Mac|iPod|iPhone|iPad/.test(navigator.platform);
console.log(AppleDevice がデバイスであるかどうか)

11. ページの先頭までスクロールします

const goToTop = () => window.scrollTo(0, 0);
先頭へ移動します。

12. パラメータの平均値を取得する

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

13. 華氏/摂氏変換

const celsiusToFahrenheit = (摂氏) => 摂氏 * 9/5 + 32;
const fahrenheitToCelsius = (華氏) => (華氏 - 32) * 5/9;
// 例 celsiusToFahrenheit(15); // 59
摂氏から華氏(0); // 32
摂氏から華氏(-20); // -4
華氏から摂氏へ(59); // 15
華氏から摂氏へ(32); // 0

これで、エキスパートのように見える 13 個の JavaScript ワンライン プログラムに関する記事は終了です。JavaScript に関するその他のコンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • JavaScript でのカスタム スワイパー コンポーネントの詳細な説明
  • JavaScript の矢印関数と通常の関数の違いの詳細な説明
  • JavaScript でカルーセル効果を実装する
  • ボタンをクリックして画像を切り替える JavaScript
  • JavaScriptで配列かどうかを判断するためのさまざまな方法のまとめ
  • 花火効果を実現するJavaScript(オブジェクト指向)
  • JavaScript Canvas で三目並べゲームを実装
  • JavaScriptのループの違いについての詳細な説明
  • JavaScript コードを省略する一般的な方法の概要

<<:  この構成ファイルの排他ロックに失敗したという VMware 仮想マシンのプロンプトの解決方法

>>:  MySQL が group by をサポートしない場合の解決策の概要

推薦する

MySQLデータベースは重複データを削除し、メソッドインスタンスを1つだけ保持します

1. 問題の紹介ユーザー テーブルに 3 つのフィールドが含まれているシナリオを想定します。 id、...

jQuery の CSS スタイル属性 css() と width() の完全ガイド

目次1. css() の基本的な使用法: 1.1 CSSプロパティを取得する1.2 CSSプロパティ...

ジョセフリング問題を解決する 3 つの JavaScript メソッド

目次概要問題の説明循環リンクリスト順序付き配列数学的再帰要約する概要ジョセフ・リング問題は、ジョセフ...

内部 IP アクセスのみを許可する Nginx プロキシ設定を追加する方法

位置 / { インデックス index.jsp; proxy_next_upstream http...

コマンドラインを使用してUbuntuのバージョンを検出する方法

方法1: lsb_releaseユーティリティを使用するlsb_release ユーティリティは、L...

ドラッグ効果を実現するための純粋なCSSコード

目次1. ドラッグ効果の例2. CSS実装の原則3. CSS実装の詳細4. CSSレイアウト1. 固...

nginx+php実行リクエストの動作原理の詳細な説明

PHPの仕組みまず、よく耳にするcgi、php-cgi、fastcgi、php-fpmの関係を理解し...

ミニプログラムは、カスタムのマルチレベル単一選択と複数選択を実装します

この記事では、参考のために、ミニプログラムでカスタムのマルチレベル単一選択および複数選択機能を実装す...

Dockerはローカルイメージをパッケージ化し、他のマシンに復元します

1. docker imagesを使用して、このマシン上のすべてのイメージファイルを表示します。 2...

Linux SSHポートを転送する3つの方法

ssh は私が最も頻繁に使用する 2 つのコマンドライン ツールのうちの 1 つです (もう 1 つ...

MySQLデータベースを誤って削除した後にデータを回復するための手順

日々の運用・保守作業において、MySQL データベースのバックアップは重要です。ウェブサイトにとって...

CSS3を使って歌詞進行テキストカラー塗りつぶし変更の動的効果を実装するアイデアの詳細な説明

音楽を再生すると、曲が進むにつれて歌詞が徐々に色づきます。色は単語ごとに変わるのではなく、左から右へ...

Vue で video.js を使用して m3u8 形式のビデオを再生する方法

目次1. インストール2. videojsの紹介3. コンポーネントでのテストと使用1. 基本的な自...

Linuxの基本コマンドmktempの詳しい説明

mptemp は安全な方法で一時ファイルまたはディレクトリを作成します。このコマンドの適用範囲: R...

Javascript で SessionStorage と LocalStorage を使用する方法

目次序文SessionStorage と LocalStorage の紹介SessionStorag...