タグ

JavaScriptに関するfuyu77のブックマーク (730)

  • String (文字列) - MDN Web Docs 用語集 | MDN

  • URLSearchParams - Web API | MDN

    This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2018. * Some parts of this feature may have varying levels of support. Learn moreSee full compatibilityReport feedback URLSearchParams インターフェイスは、URL のクエリー文字列の操作に役立つメソッドを定義します。 URLSearchParams オブジェクトは反復可能ですので、for...of 構造の中で直接使用して、キーと値のペアをクエリー文字列に現れるのと同じ順序で反復処理することができま

    URLSearchParams - Web API | MDN
  • 【追記あり】ES2022 Array#at がちょっとおかしい #fix_ecmascript_at - Qiita

    既に Stage 4 になっているので諦めていたんですが、流石に見逃せないかなと思ったので TC39 の Discourse にトピックをたててみました。意見がある方はこちらにお願いします。 https://es.discourse.group/t/fix-at/983 議論に伴って私が実際に欲しかったものをモジュールにして公開してみました。 https://github.com/petamoriken/safe-at それといまいちユーザーからの声が伝わっていない感じがしたのでハッシュタグ #fix_ecmascript_at を用意してみました。協力をよろしくおねがいします。 String#char{At, CodeAt} という存在を忘れてたんですが、この似た名前のメソッドたちが引数を整数に丸めるのに String#at が丸めないのはたしかに変だということに気づいてしまったので、自

    【追記あり】ES2022 Array#at がちょっとおかしい #fix_ecmascript_at - Qiita
  • JavaScript クイズ解説: NaN === NaN の結果はどうなる?

    先日、このようなツイートを書きました。 久しぶりの JavaScript クイズ。 JavaScript において NaN === NaN の結果は次のうちどれになるでしょうか? — Takuo Kihira (@tkihira) September 7, 2021 答えは 4 の「状況によって上記以外もありうる」です。でも、2 や 3 を選んだ方も、もはや正解だといって差し支えないと思います。 解説が長くなったので、ブログ記事にまとめました。 そもそも NaN とは NaN は “Not a Number” を意味する数値です。数値なのに「Not a Number」というのは違和感があるかもしれませんが、数値表現することが出来ない状態を保持するために便宜的に用意された数値、というようなものです。 NaN は、浮動小数点演算において数値では表現出来ない計算をしようとすると登場します。例えば

  • フロントエンドの慣習のまとめ - Qiita

    Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

    フロントエンドの慣習のまとめ - Qiita
  • ちょっと複雑なシェルスクリプトをJavaScriptで書く - lacolaco-engineering

    ちょっと複雑なシェルスクリプトを https://github.com/google/zx を使って書くとJavaScriptプログラマにとってはメンテナンスしやすい /lacolaco/lacolaco.iconはzx歴 3-4ヶ月ってところ (2021-08) 嬉しいところ async/awaitが使える 配列が扱いやすい モジュールで再利用しやすい 他のNode.jsライブラリと併用できる Prettierでフォーマットしやすい Lintしやすい エディタ支援が安心 Made by Google 微妙なところ JavaScriptプログラマ以外にとっては無用 とはいえシェルスクリプトによほど慣れてる人以外はよく整理されたJavaScriptのほうがセマンティクスを読み取りやすいのではないか スクリプト自体はこんな感じ(公式READMEより) code:js #!/usr/bin/en

    ちょっと複雑なシェルスクリプトをJavaScriptで書く - lacolaco-engineering
  • JavaScript で文字数を length で数えるのはやめようの実例

    はじめに JavaScript において文字数を String の length で取得すると、期待した値が得られないことがある。この記事では、実際に String の length を使うことによって発生した Prettier のバグを紹介する。 前提 JavaScript の String には length というプロパティが存在する。このlengthプロパティは文字列の文字数を表すものではない。 実際には、文字列中に含まれるUTF-16のコードユニットの数を返す。つまり、ASCIIをはじめとしたBMPに含まれるものであれば我々の期待する文字数が返ってくるが、一部の漢字やemojiなどについてはそうはならない。 たとえば、漢字の𠮟(U+20B9F)はサロゲートペアであり、2つのコードユニットで表される。そのため、length は 2 になる。

    JavaScript で文字数を length で数えるのはやめようの実例
  • JavaScriptでイミュータブルに配列を操作するメソッドまとめ

    Reactでアプリケーションを作っていくときなど、純粋な(副作用のない)関数を最大限使うことが推奨される。 純粋関数(Pure Function)であるためには、基的に以下の条件を満たしておく必要がある。 関数は少なくとも1つの引数を持たなくてはならない 関数は1つの値、または1つの関数を返さなくてはならない 関数は引数を変化させてはいけない 3つ目の条件がなかなかのくせもので、意識せずにいると思わぬ副作用を起こしてしまうので注意が必要。特にJavaScriptの場合、配列を操作するときにはもとの配列を直接操作してしまっていないか意識する必要がある。 JavaScriptのArrayオブジェクトに属するメソッドには「破壊的な」メソッドが存在しており、「破壊的な」メソッドはもとの配列を直接操作(破壊)してしまう。一方で「非破壊的な」メソッドとは、配列を直接操作するのではなく、もとの配列のコ

    JavaScriptでイミュータブルに配列を操作するメソッドまとめ
  • Default page

    You Are All Set to Go! All you have to do now is upload your website files and start your journey. Check out how to do that below:

  • 【JavaScript】文字列を任意の文字数で分割し、配列を作成する方法 - Qiita

    Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

    【JavaScript】文字列を任意の文字数で分割し、配列を作成する方法 - Qiita
  • SharedArrayBuffer - JavaScript | MDN

    This feature is well established and works across many devices and browser versions. It’s been available across browsers since December 2021. Learn moreSee full compatibilityReport feedback SharedArrayBuffer オブジェクトは、一般的な、生のバイナリーデータバッファーを表すために使用されます。ArrayBuffer オブジェクトと似ていますが、こちらは共有メモリー上にビューを生成するために使用されます。SharedArrayBuffer は移譲可能オブジェクトではありません。この点では ArrayBuffer が移譲可能であるのとは異なります。 SharedArrayBuffer オブジェ

    SharedArrayBuffer - JavaScript | MDN
  • JSエコシステムぶらり探訪(5): CommonJSモジュールバンドラー - Qiita

    ←前 目次 次→ モジュールバンドラーとは 前3回までで説明したNode.jsのモジュールシステムとnpmのパッケージシステムは、再利用可能なJavaScriptプログラムを作り、配布し、利用する仕組みとして非常によくできたものでした。そのため、このNode.jsのモジュールシステムをブラウザでも利用したいという需要が生じることになりました。正確には以下の2つの需要がありました。 Node.js用に書いたプログラムをブラウザでも再利用したい。 純粋にブラウザ向けのJavaScriptコードでも、モジュールシステムやパッケージシステムを使いたい。 これらの願いを同時に叶えるべく、Browserifyをはじめとしたモジュールバンドラーというツールが開発されました。モジュールバンドラーは複数のJavaScriptモジュールを結合し、ひとつのJavaScriptファイルを生成します。 モジュールバ

    JSエコシステムぶらり探訪(5): CommonJSモジュールバンドラー - Qiita
  • require('./module').defaultについて - ゆずめも

    GWから乃木坂にハマりました、お久しぶりです。 後輩氏がjsやってて、なんだこれってツイート見たので書いとこうってモチベ jsのモジュール JSのモジュールはけっこういっぱいある(nodeのcommonjsがcommonjsじゃない問題はめんどくさいので置いとく) よく見るのは下の2種類 ES Modules: ECMA Scriptの仕様 CommonJS: Node.jsが採用してるモジュールシステム ES Modulesの実装状況 chromeとかedgeみたいな一部だと実装されてるけど ES Modulesで書かれたものは基動かない なのでNode.jsで動かす時なんかはcommonjsに変換する commonjsへの変換 esmodules => commonjsの変換はBabelやTypescript使う気がする www.typescriptlang.org babeljs.

    require('./module').defaultについて - ゆずめも
  • フェッチ API の使用 - Web API | MDN

    フェッチ API は、HTTP リクエストを行い、レスポンスを処理するための JavaScript インターフェイスを提供します。 フェッチは XMLHttpRequest の現代の置き換えです。コールバックを使用する XMLHttpRequest とは異なり、フェッチはプロミスベースで、サービスワーカーやオリジン間リソース共有 (CORS) のような現代のウェブの機能と統合されています。 フェッチ API では、fetch() を呼び出してリクエストを行います。これは ウィンドウとワーカーの両方のコンテキストでグローバル関数として利用できます。このコンテキストには Request オブジェクトか、フェッチする URL を格納した文字列、およびリクエストを構成するためのオプション引数を渡します。 fetch() 関数は Promise を返します。このプロミスはサーバーのレスポンスを表す

    フェッチ API の使用 - Web API | MDN
  • throw - JavaScript | MDN

    This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. Learn moreSee full compatibilityReport feedback throw 文は、ユーザー定義の例外を発生させます。 現在の関数の実行を停止し(throw の後の文は実行されません)、コールスタック内の最初の catch ブロックに制御を移します。呼び出し元の関数に catch ブロックが存在しない場合は、プログラムが終了します。 function getRectArea(width, height) { if (isNaN(width) || isNaN(height)) { thro

    throw - JavaScript | MDN
  • 「意図的なawait書き忘れ問題」との戦い方を考える ~JavaScriptと非同期処理の話~ - Qiita

    はじめに ここで紹介する「意図的なawait書き忘れ問題との戦い方」は私のオリジナルの戦い方です。(もしかしたら他にもやっている人はいるかも知れませんが・・・) オリジナルということは、まず一般的な方法ではない、ということですし、 世の中にはもっと素晴らしい方法や、あるいは問題を解決できるOSSライブラリなどが落ちている可能性が非常に高いということです。 けっしてここに書かれていることを鵜呑みにはせず、「ふーん、そんな事を考える人もいるんだ。まあ俺はやらないけどね」ぐらいのスタンスで読むのが良いと思います。 また、もしよりよい「戦い方」をご存じの方がいればぜひ教えて下さい。 よろしくお願いします。 「await書き忘れ」とは? ES2017から導入されたasync/await。便利ですよね。 今までのJavaScriptの非同期処理関係の構文がゴミクズに見えるぐらい すごく便利で直感的な構

    「意図的なawait書き忘れ問題」との戦い方を考える ~JavaScriptと非同期処理の話~ - Qiita
  • async await の使い方 - Qiita

    Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

    async await の使い方 - Qiita
  • 「Tween24.js」の新機能!ループやテキストアニメーションなど、ウェブサイトの演出に役立つ機能を追加 - ICS MEDIA

    「Tween24.js」の新機能!ループやテキストアニメーションなど、ウェブサイトの演出に役立つ機能を追加 「Tween24.js」はメソッドチェーンで記述するのが特徴で、たった1行でアニメーションが実装可能なJavaScriptライブラリです。このライブラリを筆者が開発しているのですが、今年4月に公開したところ大変好評いただきました。 たくさんの要望もいただき、新しい機能を追加したのでアップデート内容を紹介します。今回はアニメーション制作において必要度の高い機能追加をメインに、各機能のブラッシュアップを行っています。 基的な使い方や導入方法は、前回の記事「新感覚!メソッドチェーンでアニメーションがスラスラ書ける「Tween24.js」を作りました」をご覧ください。 今回のアップデート内容 新機能:トゥイーンを繰り返すloop() 新機能:トゥイーンを連続で遅延させるlag() 遅延させ

    「Tween24.js」の新機能!ループやテキストアニメーションなど、ウェブサイトの演出に役立つ機能を追加 - ICS MEDIA
  • JavaScriptのES2021で追加された新機能まとめ

    2022/06/22追記 最新仕様ES2022がリリースされたので、新しく記事を書きました。 JavaScriptの仕様はECMAScriptで、ECMAScript 2015(ES2015)、ECMAScript 2016(ES2016)...というように毎年進化を続けています。 これまでの仕様はES2020でしたが、先日2021年6月22日にES2021が正式仕様として承認されました。 22.06.2021 Ecma International approves new standards - Ecma International ブラウザ対応も完了しており、全モダンブラウザ(Google Chrome・Firefox・Safari・Microsoft Edge)でES2021の全機能が使えます。 記事では、ES2021すべての新機能をまとめて紹介します。 大きな数値を_区切りで書け

    JavaScriptのES2021で追加された新機能まとめ
  • レトロエンジニアのための近代Webフロントエンド事情 - Qiita

    Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? フロントエンド開発という言葉があちらこちらから聞こえてくる。 「反対語はバックエンド開発だから、サーバとかCUIじゃない、アプリとかGUIあたりのことを指す広い意味の言葉だよね。」 ・・・とか思ってたらとんでもない。 世の中ではJavaScript界隈を限定している風な使われ方をしている。 私のような C/C++ メインのレトロエンジニアは肩身が狭くなるばかりである。 文は、近年のWeb技術に追いつこうと調査した結果のメモ書きである。 n番煎じの内容だが、Web業界にいない人間の視点 なので、私と同類のレトロエンジニア等、一部の人には

    レトロエンジニアのための近代Webフロントエンド事情 - Qiita