JavaScriptのforEachでawaitが効かない理由 - Qiita
背景 JavaScriptでは forEach という配列から要素を取り出して反復処理できる関数があります。 前の記事 JavaScriptのforEach内でbreakができない理由【備忘録】 では、 forEach の中では break が使えず、途中でループを抜けることができない理由についてまとめました。 今回はその続きとして、forEach の内部で await を使った場合に、非同期処理の完了を待たずに次の処理へ進んでしまう、という挙動について理由を調べてみました。 forEach内でawaitしてみる forEach の中で await して得られた値を配列に追加し、 forEach の直後に配列を console.log で出力する例で確認します。 for文の感覚でいえば、イテレーション中の await で都度処理を待ってくれるイメージなので、全ての要素への処理が終わったら配
「型システムのしくみ」発売のお知らせ - まめめも
「型システムの仕組み - TypeScriptで実装しながら学ぶ型とプログラミング言語」という本を書きました。 「型システムの仕組み - TypeScriptで実装しながら学ぶ型とプログラミング言語」 どんな本？ 簡単な型チェッカを自作してみることで、型システムの仕組みを概観する本です。 型チェックする対象の言語はTypeScript（のサブセット言語）、型チェッカを実装するための言語もTypeScriptです。 たとえば、次のようなプログラムが型チェックできるようになります。 const add = (x: number, y: number) => { return x + y; } const a = add(1, 2); const b = a + true; 型チェッカは、それぞれの変数がどういう型を持つか管理しつつ、プログラムの各パートがどういう型になるかを判定していきます。
HTMX入門【はじめからそうやって教えてくれればいいのに！】
はじめに この記事の内容は、以下の動画でも解説しています。アニメーションでわかりやすくなっているので、ぜひ見てみてください。他にもWebに関する解説動画を投稿しているので、気になる人はチャンネル登録よろしくお願いします！ HTMXとは？ HTMX とは、一言で言うと、JavaScriptを書かずに動的なページを簡単に作成できるライブラリのことです。 htmx is a library that allows you to access modern browser features directly from HTML, rather than using javascript. （訳）htmx は、JavaScript を使用するのではなく、HTML から最新のブラウザー機能に直接アクセスできるようにするライブラリです。 </> htmx ~ Documentation ...と言っても
新たなJavaScript RPCライブラリをCloudflareがオープンソースで提供 ー Web開発・マイクロサービス開発を進化させる可能性も
4月6日、CloudflareはCloudflare WorkersにJavaScriptネイティブのRPC（Remote Procedure Call）システムを追加した。 4月6日、CloudflareはCloudflare WorkersにJavaScriptネイティブのRPC（Remote Procedure Call）システムを追加した。 この新機能により、クライアント・サーバー間はもちろん、Worker間の通信も、ほぼボイラープレートなしでシームレスに行えるようになる。 ※RPC（Remote Procedure Call）とは、異なるコンピュータシステム間、または同一システム内の異なるプロセス間で、あたかもローカルのプロシージャ（関数やメソッド）呼び出しのように通信を行う手法。この手法を用いることで、開発者はネットワークの詳細を意識することなく、簡単にシステム間でデータを交換
2024 年の JavaScript と TypeScript のトレンド: 開発者エコシステムアンケートのインサイト | The WebStorm Blog
JetBrains は過去 7 年間にわたり、変化し続ける開発者の状況と使用されている主要テクノロジーを関連付けるために開発者エコシステムアンケートを実施してきました。 その結果は生データと分析レポートの両方の形式でコミュニティと共有され、すべての関係者がこのエコシステムの状況を把握できるようになっています。 本日は今年の調査結果を JavaScript と TypeScript に焦点を当てて確認したいと思います。 アンケートの概要 2023 年の開発者エコシステムアンケートでは、世界中の 26,348 人の開発者からインサイトを収集しました。 このアンケートの結果を自分で確認し、プログラミング言語やツール、テクノロジーから回答者に関する有用な情報や豆情報に至るまで広範なトピックを網羅した情報を入手できます。 私たちは開発者独特のライフスタイルにも注目し、その情熱や興味を明らかにする予定
Denoで知ったJavaScriptの楽しさ
これ以外に新たにECMAを実装することを目指しているエンジンもあります。たとえば、なんでも再実装したいことで有名なRustコミュニティではBoaというエンジンがECMAScript準拠100%を目指して活発に開発中のようです。 Node.jsって何なの？ Node.jsは「V8上に構築されたJavaScriptランタイム」です。 ん？ エンジンの上にランタイムが乗ってるのか？ と、あらためて調べ始めた時は混乱しましたが、元々「ブラウザ＋エンジン」上でしか動かなかったJSが、Node.jsの登場によって「Node.js on V8」上で動くようになった…ということなんですね。 これによって、JavaScriptはブラウザの外側でも動くようになりました。 現在ではこの「ブラウザの外」というのは、乱暴に言えば「サーバーサイド」ということになっていて、Node.jsといえばサーバーサイド開発のため
"レガシー"と言われないためのJavaScript再入門
追記: 10/11 ハテブでバズっているようで、色々指摘があったので追記 getElement*は動作が早いのでIDやクラス名が自明の場合はgetElement*を使う方がいいと言う意見もあり、また、ページの表示で大量に呼び出されるわけではないからボトルネックにはならないと言う意見もある。 getElement*で返されるオブジェクトは動的な変化に対応しており、querySelector*は動的な変化に対応していないため、場合によってはgetElement*を使うといい。このサイトで遊んでみよう。 https://ja.javascript.info/searching-elements-dom#ref-263 for await ... ofは非推奨なので Promise.allを現代的な書き方にした 顧客先のブラウザが古い場合も考慮して、あえてレガシーな書き方もする場合があるらしい。現
小さなゲームを作るとして、ターゲットデバイスと開発環境、何向けに何で作るのがいいんだろう - ABAの日誌
じゃあ小さなゲームを作ってみようか、と思ったときに、まず考えないといけないことの一つに、PC、スマホ、ゲーム機などなど、どのデバイスで動くゲームを作るかということがある。 特にこだわりがないのであれば、PCのWebブラウザ向けのゲームを作るのがおススメだ。今のブラウザは様々な開発環境で開発されたゲームを動作させるためのプラットフォームとして成熟しているし、他の人にプレイしてもらうにも、ネット上のURL告知からシームレスに遊んでもらえてお手軽だ。 ゲーム作りを楽しむ、という面では、どの開発環境・プログラミング言語・ゲームエンジンでゲームを作りたいか、から考える手もある。これについては小さなゲームだからどうこう、ということは特になくて、自分の好みで決めて良いと思う。ただ、重厚な3Dゲームを主なターゲットとしているUnreal Engineなどは小さなゲームを作るにはリッチすぎる、などは考慮して
【図解】1から学ぶ JavaScript の 非同期処理 - Qiita
はじめに JavaScriptで非同期処理を書くシーンは数多くあると思います。 なのに、今までなんとなく使用してきました。これを機会にちゃんと勉強したいと思い体系化してまとめました。 それだけだとタダのメモになってしまうので、なるべく初学者の人が理解しやすいように書きました。 自分はこの記事を書くことで、JavaScriptの躓きポイントの代表格である非同期処理（Promise や async/await ）についても理解が深まったのでいい内容だと思ってます。長いけど。 主に初学者の方に読んでいただけたら幸いです。 JavaScript上級者の方は。何か間違っている記載があれば是非コメントください。 同期処理と非同期処理 まずは用語の定義からです。 同期処理は、最初のコードから次のコードへと順次処理（実行）されていくことです。 対して、非同期処理とは、ある処理が終了するのを待たずに、別の処
jQueryへの別れ：現代的な開発のための必須JavaScriptメソッド - Qiita
はじめに 私は長い間レガシーコードと共に仕事をしてきましたが、jQueryの重要性は依然として頻繁に話題に上がるトピックの一つです。ライブラリ自体は便利なままですが、それは別の時代のニーズを完璧に満たしていました。 現在、私たちは既にES2023について話していますが、過去にjQueryがカバーしていたほとんどの機能は、すでに2015年にリリースされたES6に取り込まれています。 ES6の標準は既に広範にサポートされており、96％のレベルに達しています（出典：caniuse.com）。そのため、特に要素の選択、スタイリング、アニメーション、データの取得などの基本的なタスクについては、ライブラリの使用を見直す良いタイミングかもしれません。 以下のトピックは、いくつかの標準的なjQueryのパターンと、それに相当するバニラJavaScriptでの手法を示す参考資料として役立つと思います。 要素
JavaScript解説書の決定版！ ES2022対応、開発に必要な確かな知識が身につく良書 -改訂3版JavaScript本格入門
待ち望んでいた人も多いと思います。 『改訂3版JavaScript本格入門』超ロングセラーの最新刊が発売されました！ JavaScriptを何となく触っていた人が確かな知識を身につけるために間違いなくお勧めです。基礎から中級向けの実践的な内容まで本当にわかりやすく解説されており、現場で使用される応用知識も詳しく踏み込んで解説されています。 本書は、先日発売されたばかり！ 改訂3版ではECMAScript 2022に対応、約200ページ増の大幅改訂版となっています。JavaScriptの最新の基本文法から、開発に欠かせない応用トピックまで詳しくていねいに解説されています。 ステップアップしたい人、最新の知識やテクニックを補完したい人にJavaScriptの教科書として手元に置いておきたい一冊です。
人気のJavaScriptバンドルツール「webpack」の開発はなぜ終わり、後継として「Turbopack」の開発が始まったのか。開発者がその理由を語る
人気のJavaScriptバンドルツール「webpack」の開発はなぜ終わり、後継として「Turbopack」の開発が始まったのか。開発者がその理由を語る 複数のJavaScriptやTypeScriptの依存関係などを解決し、コードやフォント、画像などのリソースなどをまとめるバンドルツール（あるいはモジュールバンドラやビルドツールなどとも呼ばれます）は、多数のライブラリやコンポーネントなどを用いてチームで開発するWebアプリケーションの開発には欠かせないツールとなっています。 そのバンドルツールの代表がwebpackです。約4万人のITエンジニアによるアンケート結果が示された「State of JavaScript 2022」でもwebpackはGulpやViteなどを抑えて最も人気のあるバンドルツールとなっています。 参考：「State of JavaScript 2022」公開。利用
ラズパイ、Arduino、ESP8266、ESP32 - マイコンで動くJavaScript環境を世代別に振り返る
本記事は、TechFeed Experts Night#10 〜 イマドキのIoTを支える技術のセッション書き起こし記事になります。 イベントページのタイムテーブルから、その他のセッションに関する記事もお読み頂けますので、一度アクセスしてみてください。 本セッションの登壇者 セッション動画 よろしくお願いします。「マイコンで動くJavaScript環境をまとめてみる」というタイトルで発表します。 「IoTLT」というコミュニティの主催をしていますのびすけと申します。普段はプロトタイピング専門スクールというプロトタイピング - ものづくりや試作開発ができる人を育てるスクールをやっております。個人の活動として、国内では最大のIoTコミュニティと言われているIoTLTの主催をしていたり、LINE APIエキスパート、Microsoft MVP、IBM Championなどの認定をいただいています
JSConf JP 2022 公開資料・Twitterリンクまとめ
2022/11/26(土)で開催された JSConf JP 2022に関する、現時点での公開資料と Twitter アカウントリンクをまとめました。 よろしければご活用ください。 ※2022/11/28追記 ねぎしさんからいただいたコメントを元に、各講演に時間指定をした YouTube リンクを追記しました。 （時間指定をすると流石に動画埋め込みはできないようだったので、リンクでご容赦ください🙏） はじめに 登壇者名は敬称略させていただいています。 Twitter アカウントについては、ご本人が当イベントで登壇されることに言及されている、スライドに記載など、確認できたものを記載しております。 リンクの間違い等ありましたらコメントいただけると助かります🙏 アーカイブ動画 当イベントは、3つのトラックに分かれて講演が行われました。 その3つともアーカイブ動画が残っているので、後から見直すこ
Webフロントエンドとアーキテクチャ事情の持論を喋る @ahomu
本記事は、TechFeed Experts Night#4 〜 フロントエンドアーキテクチャを語るのセッション書き起こし記事になります。 イベントページのタイムテーブルから、その他のセッションに関する記事もお読み頂けますので、一度アクセスしてみてください。 本セッションの登壇者 セッション動画 「Webフロントエンドとアーキテクチャ事情の持論を喋る」というタイトルでお話をします。今回の会全体を通したテーマはフロントエンドアーキテクチャということで、私の持論を交えつつ、前説的なポジションをつとめさせていただければと思います。よろしくおねがいします。 ハンドルネームは @ahomu と申します。Webフロントエンドがもともと専門ですけれども、最近はスタートアップで開発組織づくりなどをしております。 今回は、設計の肝の話は残しつつ、前説として「そもそもフロントエンドとは」という認識あわせと、ケー
JavaScriptのデザインパターンについて
どうもoreoです。 今回はモダンなJavaScript開発環境で役立つデザインパターンを紹介します。 この記事は、JavaScript Patterns WorkshopとPatterns.devを参考にしています。 有名な「Java言語で学ぶデザインパターン入門」などでは、古典的な23個のデザインパターンが紹介されていますが、JavaScript Patterns WorkshopではPatterns.devをベースとして、モダンなJavaScriptにおける6つのデザインパターンについて言及されています。この記事ではそれらについてまとめてみたいと思います！ ※本記事中のコードは、JavaScript Patterns WorkshopとPatterns.devから引用させていただいております。 1 Design Patternsとは？ デザインパターンとは、ソフトウェア開発で繰り返し
2022年秋版 最新React/Typescript開発環境の作成 - Qiita
はじめに Reactの開発環境は、CRA(Create React APP)がよく使われますが、CRAは沢山のモジュールの整合性の確認などのため、アップデートがリリースされるまでの間隔が結構あります。 また、使われているモジュールをアップデートするとエラーに悩まされたりします。 ゼロからReactの開発環境を作成していたのですが、いろいろとトライを繰り返すうちに以下の方法に落ち着きました。 比較的短時間で環境が作成できますし、全て最新のモジュールが使えます。 Vite nodejsを用いたJavaSriptプロジェクトは、、Webpackなどでプロジェクト内のJavaScriptモジュールをひとつのファイルにまとめるバンドルと呼ばれる作業が必要でした。 これは、ブラウザがESモジュールに対応していないことや、ひとつのHTMLファイルから沢山のjsファイルをダウンロードさせると、その数だけア
Scala（スカラ）とは？言語の特徴や開発手法、Javaとの違いや共通点について解説！ - システム開発のプロが発注成功を手助けする【発注ラウンジ】
近年、アメリカのIT企業での導入数が増加傾向にあるプログラミング言語の１つが「Scala（スカラ）」です。Javaとの互換性が良く、その使い勝手の良さで人気を集めています。今後、日本でも導入が増える可能性が高く、すぐにでも勉強したいと思っているエンジニアも多いでしょう。 今回は、Scalaの特徴や開発手法を解説するとともに、Javaとの関係についても触れていきます。Scalaを使ったシステム開発を考えている方は必見の内容です。 目次 Scalaは、2001年にスイス連邦工科大学のマーティン・オーダスキー教授によって開発され、2003年に内部で公開、2004年にJavaのプラットフォームにリリースされたプログラミング言語です。プログラミング言語として定着しているJavaが登場したのが1995年であり、Scalaは比較的新しい言語といえます。 Scalaは現在も進化を続けており、2006年には
Denoのライアン・ダール氏「親愛なるオラクル殿、どうかJavaScriptの商標を手放して」と呼びかけ
主要なJavaScriptランタイムであるNode.jsの作者であり、現在もDenoの開発を進めているライアン・ダール氏は、自身のブログで「Dear Oracle, Please Release the JavaScript Trademark」（親愛なるオラクル殿、どうかJavaScriptの商標を手放して）と呼びかけています。 JavaScriptはNetscapeがWebブラウザ用に開発したプログラミング言語であることはよく知られていますが、その名称はサン・マイクロシステムズが登録商標として所有し、同社がオラクルに買収されたことで現在はオラクルが所有しています。 ライアン・ダール氏はそのオラクルが唯一「Oracle JavaScript Extension Toolkit」以外にはJavaScript関連製品を持っておらず、V8やSpidermokeyといった主要なJavaScrip
【Vue.js入門】の執筆者が語る！ Vue.jsで押さえておきたい５つのポイント - FLEXY（フレキシー）
※本記事は2019年11月に公開された内容です。 JavaScript用のフレームワークの中でも高い採用率を誇るVue.js。そのVue.jsをこれから学び始める方は、学び方を教えてほしい、有識者の話を聞きたいと考えたことはありませんか。本記事では、「Vue.js入門 基礎から実践アプリケーション開発まで」の著者である手島拓也氏にVue.jsを学ぶ前に知っておきたいポイントを語っていただきます。Vue.jsの勉強方法や手島氏の経験を知ることができるので、ぜひご覧ください。 学ぶ前にまずはどんな案件があるか知りたい方は、FLEXYで取り扱っているVue.js案件をご覧ください。 私のエンジニア史とVue.jsに出会うまで 先日、慶應義塾大学矢上賞（起業支援）授与式で招待講演をする機会がありました。その際にも強烈に感じたのですが、Vue.jsと私のエンジニア史を切り離して語ることはできません。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
