Moment.js | Docs
Moment.js has been successfully used in millions of projects, and we are happy to have contributed to making date and time better on the web. As of September 2020, Moment gets over 12 million downloads per week! However, Moment was built for the previous era of the JavaScript ecosystem. The modern web looks much different these days. Moment has evolved somewhat over the years, but it has essential
あなたの window.open はなぜ開かないのか，Chrome で - マンガ〜ノ伊藤ノ〜ト
先日 window.open をしようとしたらポップアップブロッカーに阻まれて open することができなかった． Blocked まあ，これならよくあることなのだが，いかんせん自分の記憶では onClick のようなユーザーのアクション内で開かれた window.open は阻まれないことになってると思っていた．だからそのときも onClick のイベントハンドラ内で window.open したから大丈夫だろう，と思っていたら，見事にブロックされてしまったのでなぜだろう，となっていた． 検証 なので，検証するために 3 つのケースを用意してみた: 検証ページを用意したのであなたの環境でも試してみてね♥ 今回試すブラウザは Google Chrome を前提にしてます ケース1 const immediate = () => { window.open('https://www.goog
NaN === NaN が false な理由とutil.isDeepStrictEqual - from scratch
NaN === NaN は false NaN、つまりは Not a Number 同士の同値比較が false になるのは、よく JavaScript とかで罠だと言われていますが、罠でもなんでもないです。 false が返るという仕様です。仕様の経緯を追うとすぐに『 IEEE754 という浮動小数点の標準規格で決められているから』、という理由がヒットします。 では IEEE754 ではなんで NaN == NaN を false にしようという話になったのか、というのを調べてみました。 今回はそういう歴史の話です。 IEEE754 現在のプログラミング言語の処理系の多くが採用している浮動小数点の標準規格です。 この標準規格は以下のことを定義している。 - 基本形式: 二進および十進の浮動小数点数データの集合。有限な数（符号付ゼロと非正規化数を含む）、無限、特殊な「数ではない」値（NaN
Blob, ArrayBuffer, Uint8Array, DataURI の変換 : (*x).b=z->a+y/c
2016/06/26 03:37 Blob, ArrayBuffer, Uint8Array, DataURI の変換 ◆ Blob からは FileReader をつかって非同期で変換処理 ◆ ArrayBuffer, DataURI, text, BinaryString ◆ ArrayBuffer や BinaryString, Uint 系配列 から Blob は Blob のコンストラクタでできる ◆ Uint 系配列の buffer プロパティが ArrayBuffer ◆ ArrayBuffer を Uint 系のコンストラクタに入れるとその TypedArray に変換できる 色々あって変換するときにどうすればいいんだっけと思うのでまとめ 今回の対象はこれ BlobArrayBufferUintXXArrayFileBinaryStringDataURI UintXXArr
Pure javascript immutable arrays
Vincent Billey aka Fenn's blog. The opinions in this blog are my own and do not represent anyone else's. About a year ago, I started developping an app in React. I chose React on a whim because I wanted to learn a new framework and was not fond of the java angular way of doing things. I learned about immutability shortly after but did not pay so much attention to it. In my mind, the state of a Rea
Private Class Field の導入に伴う JS の構文拡張 | blog.jxck.io
Intro ECMAScript の Private Class Field の仕様策定と各ブラウザの実装が進んでいる。 これにより、従来の JS にはなかった Class の Private フィールドが使えるようになる。 提案されている構文や、挙動について解説する。 Class Field Declaration まず前提として、現状の Class の フィールドはコンストラクタで定義する必要がある。 例えば count フィールドを持つ Counter クラスを定義した場合、以下のようになる。 class Counter { constructor() { this.count = 0 } increment() { this.count ++ } display() { console.log(this.count) } } const c = new Counter() c.in
Callback を撲滅せよ
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。言語サポート（Node.js）チームの伊藤（@koh110）です。 Node.js v10 も10月にLTSとなり async/await によるフロー制御は当たり前のように利用されるようになってきました。JavaScriptの非同期処理は async/await から覚える人も今後増えていくでしょう。今回はそんな非同期処理について、社内での事例を交えて記事を書いていこうと思います。 index Promise 化がなぜ重要なのか ユーザーに promisify をさせる落とし穴 Road to Promise まとめ Promise 化がなぜ重要なのか ちょうど3年前のアドベントカレンダーで、今後はいろいろなモジュー
JavaScriptセキュリティの基礎知識 記事一覧 | gihyo.jp
第3回Webセキュリティのおさらい その3 CSRF・オープンリダイレクト・クリックジャッキング はせがわようすけ 2016-07-13
ECMAScript 2015以降のJavaScriptの`this`を理解する
この記事はJavaScriptの入門書として書いているjs-primerのthisに関する部分をベースにしています。 またjs-primerでは書けなかった現在時点(2018年1月1日)でのブラウザの挙動についてを加えたものです。 次の場所にjs-primer版（書籍版）のthisについての解説があります。 この記事と違って実際にコードを実行しながら読めるので、学習ソースとしては書籍版を推奨します。 書籍版: 関数とthis · JavaScriptの入門書 #jsprimer また、バグ報告やPRも直接リポジトリにして問題ありません。 asciidwango/js-primer: JavaScriptの入門書 おかしい場所を選択した状態で右下にある”Bug Report”ボタンを押せば、簡単にtypoとかのバグを報告できます。(PRでも歓迎) 前置きはこの辺までで、ここから本編。 この記
JavaScriptの { } を理解する - Qiita
結果はどうなったでしょうか。 自分が今使っているGoogle Chromeだとこうなりました。 結果は{a: 10}というオブジェクトです。まあ、これは当然ですね。3 + 5と入力すれば実行されて8が返ってくるのですから、{a: 10}というオブジェクトリテラルを書けば{a: 10}というオブジェクトが作られるのは当然です。 ……。 ここで、一部の人は「おいふざけんなよ」と思っているかもしれません。というのも、この例は環境によっては違う結果になるのです。具体的には、Chrome以外2のブラウザのREPL（FirefoxやEdgeなど）が該当します。あと、ts-nodeのREPLも該当するらしいです。これらの環境では、結果は{a: 10}ではなく次のようになります。 オブジェクトを作ったはずなのに結果が10とか意味不明ですね。そもそも、こんな簡単なプログラムで結果が全然違うとか、JavaSc
JavaScript Primer - 迷わないための入門書 #jsprimer
JavaScript Primer 迷わないための入門書 Tweet Watch Star Twitterのハッシュタグ: #jsprimer これからJavaScriptを学びたい人が、ECMAScript 2015以降をベースにして一からJavaScriptを学べる書籍です。 プログラミングをやったことがあるが、今のJavaScriptがよくわからないという人が、 今のJavaScriptアプリケーションを読み書きできるように書かれています。 初めてのプログラミング言語としてJavaScriptを学ぶ人は、まずは「はじめに」から読んでみてください。 書籍版 このウェブサイトの内容はアスキードワンゴから書籍として出版されています。 書籍版の内容はウェブサイト版と同一ですが、本として読めるように最適化されています。 書籍版は次のサイトから購入できます。 Amazon 達人出版会（電子書籍版
「Reactの難しさ」を分解しよう - タオルケット体操
他のライブラリと比べるまえに まず、ReactとjQueryと比べるのはやめよう 「テンプレートエンジン」として捉えて、シンタックスを攻撃するのをやめよう ライブラリとしてのReactはとても簡単 Reactの思想を理解するのはチョットムズカシイ 環境構築が難しい JavaScriptそのものが難しい GUIが難しい jQuery時代からのパラダイムシフト フレームワーク関係者の情報量が多い SPAはとりわけ難しい まとめ ずっと感じてたもやもやを書き連ねたら長くなってしまったが、ぼんやりとReactとかなんか難しそうだしめんどくさいから新規案件だけどjQueryでやろっかなどうしよっかなーと迷っている人の指針になってくれればうれしい。 他のライブラリと比べるまえに まず、ReactとjQueryと比べるのはやめよう 出た時から延々と言われ続けているものの、やっぱり今でもjQueryとRe
TodoMVC
Introduction Developers have a number of choices today when it comes to selecting a JavaScript framework or UI library for building scalable web apps. React / Next.js, Vue / Nuxt, Angular…the list of solutions continues to grow, but just how do you decide on which to use in a sea of so many options? To help you understand the options, we created TodoMVC - a project which has offered the same Todo
JavaScript における文字コードと「文字数」の数え方 | blog.jxck.io
Intro textarea などに入力された文字数を、 JS で数えたい場合がある。 ここで .length を数えるだけではダメな理由は、文字コードや JS の内部表現の話を理解する必要がある。 多言語や絵文字対応なども踏まえた上で、どう処理するべきなのか。 それ自体は枯れた話題ではあるが、近年 ECMAScript に追加された機能などを交えて解説する。 なお、文字コードの仕組みを詳解すること自体が目的では無いため、 BOM, UCS-2, Endian, 歴史的経緯など、この手の話題につき物な話の一部は省くこととする。 1 文字とは何か Unicode は全ての文字に ID を振ることを目的としている。 例えば 😭 (loudly crying face) なら 0x1F62D だ。 1 つの文字に 1 つの ID が割り当てられているのだから、文字の数を数える場合は、この ID
モダンなフロントエンド開発環境をつくる | // sakura note
最近、趣味で作りたいWebアプリがあって、結構クライアント側が要になりそうなので、思い切って勢いで Deep Dive してみた話。かなり長いです。 モダンって言ってるけど、TypeScriptが苦手ならES2015+ES7も全然アリだと思う。前回の記事で触れてるから、TypeScriptの代わりに書き換えればうまく載るはず。というか人口的にはTypeScriptよりES2015使う人のが当然多いだろうけど、今回はTypeScript使ってみたかったんです・・・。 背景 わたしは今までフロンドエンド開発っていうと、CSS3+HTML5で特別な開発環境も使わず、気合いで頑張って作ってきた勢です。 一応、フリーランスでバックもフロントもまとめて依頼されたり、趣味で書いたり、プログラミングスクールで先生やってた頃はフロントも教えていたんですが、とても苦手でした。特にデザインとか全くセンス無いし、
JavaScriptエンジニアなら知ってるよね？ エラー処理のいい書き方、悪い書き方
JavaScriptのエラー処理、ちゃんと書いていますか？ エラーを無視せず、どこに問題があるのか、きちんと確認できるコードの書き方をデモで紹介。 この記事はTim SeverienとMoritz Krögerが査読を担当しています。最良の記事を提供することができ、SitePointの査読担当者の皆さんに感謝します。 JavaScriptのエラー処理には危険が潜んでことを知っていますか？ もしマーフィーの法則を信頼しているとしたら、不具合が生じる可能性が本当に高いです！ この記事では、JavaScriptのエラー処理について考え、その落とし穴から便利な実践例までを説明します。さらに最後には、非同期コードとAjaxにも触れます。 JavaScriptはイベント駆動型プログラムで、プログラミングをより豊かなものにしてくれます。ブラウザーをイベント駆動型プログラムと考えると、発生するエラーは同一
ES Modules と Node.js について - from scratch
書こう書こうと思いながらこのタイミングまでのがしてしまいました。 今一番 Node.js の中で hot な discussion の一つと言えるでしょう、『ES Modules が Node.js の中でどうなるか』です。 ES Modules 現況 ES2015 が発刊されてそろそろ一年です。 ES2015 にある機能は Node.js v6でも 93% 程度カバーされています。モダンブラウザでも大体が90%を超えています。しかし、 ES Modules だけはまだどのブラウザも実装しきれていません(kangax compat table は ES Modules は省かれてます)。 そもそも ECMAScript 2015 自身で定義されたのは構文だけなので、構文はともかく、どうやってモジュールを取ってくるかという Loader の部分がまだ決まりきっていません。 https://w
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
最近の Web パフォーマンス改善について知っておきたいコト
Incremental DOM and Recent Trend of Frontend Development
ブラウザのPerformance APIの話
