序文JavaScript は習得が最も簡単な言語の 1 つであるため、成長と繁栄を続けており、市場に新しい技術オタクの扉を開いています。 また、JavaScript の初心者であっても、プロの開発者であっても、何か新しいことを学ぶことは常に良いことです。 この記事では、作業効率の向上に役立つ非常に便利なワンライナーをいくつかまとめました。 ワンラインコードとは何ですか?
1行のコード例1. クリップボードにコピー navigator.clipboard.writeText を使用すると、任意のテキストを簡単にクリップボードにコピーできます。 const copyToClipboard = (テキスト) => navigator.clipboard.writeText(テキスト); クリップボードにコピーします("Hello World"); 2. 日付が有効かどうかを確認する 指定された日付が有効かどうかを確認するには、次のコード スニペットを使用します。 const isDateValid = (...val) => !Number.isNaN(new Date(...val).valueOf()); isDateValid("1995年12月17日 03:24:00"); // 結果: true 3. 年の何日目か調べる 指定された日付の曜日を検索します。 const dayOfYear = (date) => Math.floor((date - new Date(date.getFullYear(), 0, 0)) / 1000 / 60 / 60 / 24); dayOfYear(新しい日付()); // 結果: 272 4. 最初の文字列を大文字にする Javascript には大文字関数が組み込まれていないため、次のコードを使用できます。 const capitalize = str => str.charAt(0).toUpperCase() + str.slice(1)capitalize("follow for more") // 結果: Follow for more 5. 2つの日付の間の日数を求める 指定された 2 つの日付間の日数を見つけるには、次のコード スニペットを使用します。 const dayDif = (date1, date2) => Math.ceil(Math.abs(date1.getTime() - date2.getTime()) / 86400000)dayDif(new Date("2020-10-21"), new Date("2021-10-22"))// 結果: 366 6. すべてのクッキーを消去する document.cookie を使用して Cookie にアクセスし、それをクリアすることで、Web ページに保存されているすべての Cookie を簡単にクリアできます。 const clearCookies = document.cookie.split(';').forEach(cookie => document.cookie = cookie.replace(/^ +/, '') .replace(/=.*/, `=;expires=${new Date(0).toUTCString()}; パス=/`)); 7. ランダムな16進数を生成する Math.random と padEnd プロパティを使用して、ランダムな 16 進数の色を生成できます。 const randomHex = () => `#${Math.floor(Math.random() * 0xffffff).toString(16).padEnd(6, "0")}` console.log(ランダム16進数()); //結果: #92b008 8. 配列から重複を削除する JavaScript の Set を使用すると、重複を簡単に削除できます。 const removeDuplicates = (arr) => [...new Set(arr)]; console.log(重複を削除([1, 2, 3, 3, 4, 4, 5, 5, 6])); // 結果: [ 1, 2, 3, 4, 5, 6 ] 9. URLからクエリパラメータを取得する window.location または元の URL goole.com?search=easy&page=3 を渡すことで、URL からクエリ パラメータを簡単に取得できます。 const getParameters = (URL) => { URL = JSON.parse('{"' + decodeURI(URL.split("?")[1]).replace(/"/g, '\"').replace(/&/g, '","').replace( /=/g, '":"') + '"}'); JSON.stringify(URL) を返します。 }; getParameters(window.location) // 結果: { search : "easy", page : 3 } 10. 日付から時間を記録 指定した日付から、時間::分::秒の形式で時間を記録できます。 const timeFromDate = date => date.toTimeString().slice(0, 8); コンソールにログ出力します。 // 結果: "17:30:00" 11. 数字が偶数か奇数かを調べる const isEven = num => num % 2 === 0; console.log(isEven(2)); // 結果: True 12. 数値の平均を求める 複数の数値の平均を求めるには、reduce メソッドを使用します。 const average = (...args) => args.reduce((a, b) => a + b) / args.length; 平均(1, 2, 3, 4); // 結果: 2.5 13. 文字列を反転する split、reverse、join メソッドを使用して、文字列を簡単に反転できます。 const reverse = str => str.split('').reverse().join('');reverse('hello world'); // 結果: 'dlrow olleh' 14. 配列が空かどうか確認する 配列が空かどうかをチェックする簡単なワンライナーは、true または false を返します。 const isNotEmpty = arr => Array.isArray(arr) && arr.length > 0; 空ではありません([1, 2, 3]); // 結果: true 15. 選択したテキストを取得する 組み込みの getSelectionproperty を使用して、ユーザーが選択したテキストを取得します。 const getSelectedText = () => window.getSelection().toString(); 選択されたテキストを取得します。 16. 配列をシャッフルする sort メソッドと random メソッドを使用して配列をシャッフルするのは非常に簡単です。 const shuffleArray = (arr) => arr.sort(() => 0.5 - Math.random()); console.log(shuffleArray([1, 2, 3, 4])); // 結果: [ 1, 4, 3, 2 ] 17. ダークモードを検出する 次のコードを使用して、ユーザーのデバイスがダーク モードになっているかどうかを確認します。 const isDarkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matchesconsole.log(isDarkMode) // 結果: True または False 18. RGBを16進数に変換する const rgbToHex = (r, g, b) => "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);rgbToHex(0, 51, 255); // 結果: #0033ff 要約するJavaScript ワンラインコードに関するこの記事はこれで終わりです。JavaScript ワンラインコードに関するより関連性の高いコンテンツについては、123WORDPRESS.COM の過去の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。 以下もご興味があるかもしれません:
|
同時アクセスの場合、非反復読み取りやその他の読み取り現象が発生する可能性があります。高い同時実行性に...
ウェブサイトの構築を始めたばかりの初心者には、理解し、学ぶべきことがたくさんあります。ウェブサイトを...
1. HTMLフォントカラー設定HTML では、フォント タグを使用してフォント コンテンツの色を設...
何?何のスターコートですか?さて、もっとわかりやすくするために写真を見てみましょう。 よく見ると、パ...
execute、executeUpdate、executeQuery の違い (およびそれらの戻り値...
目次MySQL フェデレーテッド クエリ実行戦略。実行計画フェデレーテッドクエリオプティマイザーMy...
目次1. 重複排除前後のデータの比較2. 使い方1. フィルターとマップを使用する2. 削減を使用す...
1. 最初の方法は、ローカルのTomcatを起動してJSPを表示することです。 tomcatのweb...
目次1. はじめに2. RC および RR 分離レベル2.1. RRトランザクション分離レベルでのク...
MySQL は、ユーザーごとに 2 つの異なるバージョンを提供します。 MySQL コミュニティ サ...
目次新しい HTML ファイルを作成します。初期テンプレートを作成するHTML の追加CSS パディ...
目次1. jsステートメント2番目、js配列3. js関数4. メイヴンV. 結論1. jsステート...
この記事では、例を使用して、MySQL ストアド プロシージャの原理と使用方法を説明します。ご参考ま...
今日、私の同僚が MYSQL クエリ ステートメントの作成時に非常に奇妙な問題に遭遇しました。MyS...
今回は、Google Chrome のタブバーのような、特殊な丸い角を持つナビゲーション バーのレイ...