タグ

javascriptに関するohnoryoのブックマーク (4)

  • すぐ消えてしまう要素をDevToolsで確認するTips集

    はじめに こんばんは! 皆さんは以下のようなすぐ消えてしまう要素をDevToolsで確認したいときはどうしますか? 常に表示されるようにわざわざコードを修正してから、DevToolsで要素を確認したりしていませんか?DevToolsをうまく使うことで、わざわざコードの修正をせずとも簡単に要素の確認をできるのでそのちょっとしたTipsのご紹介です! ① CSSイベントでの確認方法 まずはCSSイベントで要素の表示制御を行っているパターンでの確認方法です。以下のようにCSSイベントのhoverで表示制御をしている要素を例にDevToolsで確認する方法を見ていきましょう! import "./style.css"; export const Index = () => { return ( <div> <button className="myButton">Button</button> <

    すぐ消えてしまう要素をDevToolsで確認するTips集
  • ここ1~2年くらいで 使えるようになった(主要ブラウザーの最新版 がすべて対応した ) ウェブの新機能について ランダムに喋る!

    2024.03.15 福岡フロントエンド勉強会 #1

    ここ1~2年くらいで 使えるようになった(主要ブラウザーの最新版 がすべて対応した ) ウェブの新機能について ランダムに喋る!
  • useEffect: 基礎から使用すべきでない例まで

    はじめに useEffect について、きっちり調べようと思い調べてみた。公式ドキュメントのまとめ記事になっている。 useEffect 基礎編 useEffect とは Effect を用いるとレンダリングの後にコードを走らせることができ、React 外のシステムの要素と同期することが可能になる。 なぜ必要か まず、React コンポーネントの二種類のロジックについて整理する。 レンダリング レンダリングをする際、コードはpropsとstateを受け取り、変換し、画面で表示したいJSXを返す。コードのレンダリングは結果のみを計算するべきでそれ以上のことをするべきではない。 イベントハンドラ イベントハンドラはコンポーネントの中にある関数で、Input Field の更新やユーザを他の画面へ誘導したり等、単純な計算以上の役割を担う。イベントハンドラはユーザの行動(ボタンクリック等)による、

    useEffect: 基礎から使用すべきでない例まで
  • JSONとBigInt

    ちょっと前にblueskyで見かけた話題。もとは「GraphQLのスキーマではintが32ビットしかなくて、64ビット整数とかないのがイケてない」といった話だったかなと思う。直感的にはこれは「Javascriptではすべてが倍精度浮動小数点数だから64bit intがないから」ということになるが、よくよく調べてみるといろいろややこしい歴史的事情があるようだ。 たしかにJSにはもともとひとつのNumber型しかなく、いわゆるdouble型(倍精度浮動小数点)だけで数値を表現してきた。IEEE754の倍精度浮動小数点数は仮数部が52ビットあるので、実際には32ビット整数ていどであれば全て誤差なく表現できる。なので32ビット整数または倍精度浮動小数点数がどちらも使えるというふうに理解されてきた。 そうはいっても不便なので、現代のJSにはBigIntがある。ES2020で導入されたらしい。ただし普

    JSONとBigInt
  • 1