JavaScriptのnew Set() って何?? Arrayと何が異なるのか

new Set()ってなに? 先日ChatGPTでコード生成したところ、new Set()というオブジェクトが登場した。 そういえば使ったことあると思い調べてみると、JavaScriptの配列で重複したものを削除し、ユニークな配列を作成するで使っていた。どうやら配列を削除するのに使っていたよう。 実際に調べてみると、 Set オブジェクトは値のコレクションです。 Set に重複する値は格納出来ません。 Set 内の値はコレクション内で一意になります。 とのこと。 簡単に言うと「要素の重複を許可しない配列のこと」だと思う。 じゃあ、配列と何が違うのか。 配列と何が違うのか 配列との違いは、 重複を許さない インデックスでアクセスできない あとは追加とか削除とかのメソッドが異なる 高次関数(map, filter, reduce)を使用できない という点。 重複を許さない const setValue = new Set([1, 2, 3, 4, 5, 6, 1, 2, 3, 4, 5, 6]); console.log(setValue); // [LOG]: Set (6) {1, 2, 3, 4, 5, 6} このように重複した値はなかったことになる。 インデックスでアクセスできない const setValue = new Set([1, 2, 3, 4, 5, 6, 1, 2, 3, 4, 5, 6]); console....

投稿日 · 2024-06-18 · 更新日 · 2024-07-07 · 1 分 · nove-b

JavaScriptで1行足すだけで、以降の処理を5秒間待つことができる

domの操作をしていると、 「あれ、動かない、domの生成がまだ行われていない? 試しに5秒待った後に実行してみよう」 みたいなことが良くある。 その都度、下記のように実行してきた。 window.setTimeout(() => { operation() }, 5000) という風に、setTimeoutの中に該当する関数を入れていく。 ただこれだと、入れるべき関数がたくさんあると面倒くさい。 そこで以降すべて5秒後に実行されるというワンライナーを覚えることにした。 それ以降の行はすべて5秒後に実行されますよっと await new Promise((resolve) => setTimeout(resolve, 5000)); ただこれだけのこと。 ただこれだとasyncをつけたメソッドを用意する必要があるけれど。

投稿日 · 2023-09-02 · 更新日 · 2024-06-07 · 1 分 · nove-b

JavaScriptにおけるcount++と++countの違いについて調べてみた

なんとなく怪しいので、count++と++countについて調べてメモしておく。 実行してみる const pre = () => { let count = 0 console.log(++count, 'pre') } const post = () => { let count = 0 console.log(count++, 'post') } pre() // [LOG]: 1, "pre" post() // [LOG]: 0, "post" 前置インクリメント演算子 pre()の方はcountの値が1増えてから更新された値が返されるので、1が出力される。 後置インクリメント演算子 post()の方はcount の現在の値を返し、その後に1を加算するので、0が出力される。 それぞれ適宜場合を見て使用する必要がある。

投稿日 · 2023-06-28 · 更新日 · 2024-06-07 · 1 分 · nove-b

letの仕様に関する知識を問うJavaScriptの問題

先日、とあるSNSを見ていたら、JavaScriptの問題が出されていた。 さて、ここで問題 let a = 10 if(true) { let a = 20 console.log(a, 'inside') } console.log(a, 'outside') // Q. What is the output of thie below code? // 1. 20, 'inside' and 20, 'output // 2. 20, 'inside' and 10, 'output // 3. 10, 'inside' and 10, 'output // 4. 10, 'inside' and 20, 'output このコードを実行した結果、どのような結果が求められるでしょう。 予想 面白そうなので実行する前に推測してみる。 まず、If文がtrueなので当然のようにIfの中身が実行される。 ここでLetの仕様の話になるのだが、Letは関数内でスコープされるので、先頭で定義されたLetとIf文の中のLetは違うものだということになる。 結果、If文の中のaは20となり、outsideのaはどこからも影響を受けずに10のままになる。 つまり2が正解になると予想される。 結果 [LOG]: 20, "inside" [LOG]: 10, "outside" 正しいと証明された。...

投稿日 · 2023-06-21 · 更新日 · 2024-06-07 · 1 分 · nove-b

JavaScriptでUnary plus (+)を使いかっこよくNumber型に変換する

他人のコードを盗み見ていた時+'0'なるコードを発見しなんだろうと調べてみた。 職人の技は目で盗め ってよく昔気質な職業で聞かれる言葉だけど、有名で最先端の技術がオープンソースで誰でも見れる状態であるプログラミングにも言えるんじゃないかと思っている。 暇さえあれば、Githubで他人のコードを読んでますってかっこいいので言ってみたいけど、噓になるので言えない。 ただ仕事中はできる限り、時間が空いた時にコードをを読むようにしている。 特に自分に関係のないプルリクなんかも追いかけるようにしている。 そこで+'0'なるコードを発見した。 ぱっと見、計算をしているようだと思ったけど、どうやら違いそうなので調べてみた。 単項プラス (+) / Unary plus (+) 簡単に言うとNumberに変換してくれるもの。 つまり+'0'はNumber(0)と同様の扱い。 ただNumber()関数の方がぱっと見でわかりやすいので、あえて 単項演算子を使うメリットはないかもしれない。

投稿日 · 2023-06-13 · 更新日 · 2024-06-07 · 1 分 · nove-b