JavaScript Runtimes (Node.js, Deno, Bun)
はじめに Bun 1.0 がリリースされたので、主要な3つの JavaScript Runtime のそれぞれの特徴をまとめる目的で書きました。 情報は 2023年09月時点のものです。また筆者はそれぞれの JavaScript Runtime に精通しているわけではないので、不足や間違った情報があるかもしれませんので、その点ご了承ください。不足や間違いがありましたら、コメントいただけると嬉しいです。 JavaScript Runtime とは JavaScript を実行する環境全般を指します。 この記事では、ブラウザを除く以下の3つの JavaScript Runtime を対象にしています。 Node.js Deno Bun JavaScript Runtime のシェア State of JavaScript 2022 の調査結果によると、Node.js が圧倒的なシェアを持ってい
JetBrains、2023年に実施されたJavaScriptとTypeScriptにおける開発者エコシステム調査の結果を紹介
チェコのJetBrainsは、これまで7年間にわたって行ってきた、変化し続ける開発者の状況と使用されている主要なテクノロジを関連付けるための、開発者エコシステムアンケートにおける2023年の調査結果のうち、JavaScriptとTypeScriptの内容について、3月7日（現地時間）付の公式ブログ投稿にて紹介している。 2023年の開発者エコシステムアンケートは、世界中の26348名の開発者を対象に行われた。同調査では、7年連続でJavaScriptが世界でもっとも多く使用されているプログラミング言語であることが明らかになっており、JetBrainsはその理由として、JavaScriptがフロントエンドWeb開発のための、障壁の低い言語だからであると指摘する。なお、JavaScriptのシェアはここ3年間少しずつ低下しているものの、この低下はTypeScriptの採用増と同時に発生している
Dialog Widget | jQuery UI API Documentation
A dialog is a floating window that contains a title bar and a content area. The dialog window can be moved, resized and closed with the 'x' icon by default. If the content length exceeds the maximum height, a scrollbar will automatically appear. A bottom button bar and semi-transparent modal overlay layer are common options that can be added. Focus Upon opening a dialog, focus is automatically mov
TypeScriptで学ぶ！SOLID原則
はじめに 皆さんこんにちは、株式会社エムアイ・ラボのエンジニアです！ 今回はソフトウェア設計のSOLID原則について学習したので、弊社のメインの開発言語であるTypeScriptのサンプルコードを使って共有できればと思います。 SOLID原則は、オブジェクト思考プログラミングにおいて、ソフトウェアがメンテナンスしやすく、拡張や変更に強いソフトウェア設計を行うための原則です。 SOLID原則にはSOLIDの頭文字をそれぞれとった、５つの原則があります。 単一責任の原則（Single Responsibility Principle） 単一責任の原則とは、クラスが一つの機能や責任を持つべきで、クラスが変更される理由は一つであるべきというです。 クラスが一つの機能や責任のみを持つようにすることにより、コードは再利用可能でテストが容易になります。 単一責任の原則を遵守している例 以下のBirdクラ
フロントエンドのテスト基盤を Jest から Vitest に移行した話
こんにちは。ナレッジワークの torii です。 7 月にフロントエンドエンジニアとして入社してもうすぐ半年、そろそろ技術記事の一つも書きたいなと思っていたところに、ちょうどいいネタを見つけたので投稿してみます！ Jest から Vitest に移行してみた 早速やったことですが、フロントエンドのテストフレームワークを Jest から Vitest に移行しました。理由としては、Jest が CJS を前提として動作しており、ESM 前提のモジュールを動かすのに一手間も二手間もかかるからです。 ナレッジワークのフロントエンドは Next.js を採用しており、テストフレームワークには Next.js と相性の良い Jest を採用していました。関数単位のテストや UI コンポーネントのテストを書く分には問題なかったのですが、それより上層（ページなど）になるとたちまち ESM 互換性の問題を
スプレッド構文 - JavaScript | MDN
スプレッド構文 (...) を使うと、配列式や文字列などの反復可能オブジェクトを、0 個以上の引数 (関数呼び出しの場合) や要素 (配列リテラルの場合) を期待された場所で展開したり、オブジェクト式を、0 個以上のキーと値の組 (オブジェクトリテラルの場合) を期待された場所で展開したりすることができます。 スプレッド構文は、オブジェクトや配列のすべての要素を何らかのリストに入れる必要がある場合に使用することができます。 上記の例では、定義された関数は、引数として x、y、z を受け取り、これらの値の合計を返します。配列の値も定義されています。 この関数を呼び出す際には、スプレッド構文と配列名 — ...numbers を使って、配列内のすべての値を渡します。 配列に 3 つ以上の数値が含まれていた場合 ([1, 2, 3, 4] など)、4 つすべてが渡されることを除けば、それでも問題
オブジェクトのプロトタイプ - ウェブ開発を学ぶ | MDN
完全な初心者はこちらから!ウェブ入門ウェブ入門基本的なソフトウェアのインストールウェブサイトをどんな外見にするかファイルの扱いHTML の基本CSS の基本JavaScript の基本ウェブサイトの公開ウェブのしくみHTML — Structuring the webHTML概論HTML 入門HTML を始めようヘッド部には何が入る? HTML のメタデータHTML テキストの基礎ハイパーリンクの作成高度なテキスト整形文書とウェブサイトの構造HTML のデバッグ手紙のマークアップコンテンツのページの構造化Multimedia and embeddingマルチメディアとその埋め込みHTML の画像動画と音声のコンテンツobject から iframe まで — その他の埋め込み技術ウェブへのベクターグラフィックの追加レスポンシブ画像Mozilla のスプラッシュページHTML tablesH
throw - JavaScript | MDN
/* * ZipCode オブジェクトを生成します。 * * 郵便番号として受け入れられる書式は次のとおりです。 * 12345 * 12345-6789 * 123456789 * 12345 6789 * * もし ZipCode コンストラクターに渡された引数が、これらのパターンの * うちのどれにも一致しないのであれば、例外が発生します。 */ class ZipCode { static pattern = /[0-9]{5}([- ]?[0-9]{4})?/; constructor(zip) { zip = String(zip); const match = zip.match(ZipCode.pattern); if (!match) { throw new ZipCodeFormatException(zip); } // 郵便番号の値は文字列中で最初に一致した部分です
String.prototype.padStart() | MDN
標準組み込みオブジェクトStringコンストラクターString() constructorプロパティString: lengthメソッドString.prototype[@@iterator]()String.prototype.anchor() 非推奨 String.prototype.at()String.prototype.big() 非推奨 String.prototype.blink() 非推奨 String.prototype.bold() 非推奨 String.prototype.charAt()String.prototype.charCodeAt()String.prototype.codePointAt()String.prototype.concat()String.prototype.endsWith()String.prototype.fixed() 非推奨 S
【DOM】domをJavaScriptオブジェクトやjsonに変換する - domJSON < IT｜カキノタblog
FilterList 引数にFilterListを指定できるオプション（attributesやdomProperties）は、FilterListに指定することで出力をフィルタリングすることができます。 使用例 以後こちらのHtmlコードを元に出力していきます。 <h1 id="m1" class="m" data-db="shop" data-tbl="area">見出し1</h1> 最小限出力 膨大なDomプロパティを全部見る必要もないし、デフォルトの設定でも多すぎると感じるかもしれません。必要な部分だけを表示させたいので、まずは最小限の情報だけ出力してみました。 let tarEl = document.querySelector("h1") let opt = { attributes: false, // 属性を非表示 deep : 0, // 子階層を辿らない metadata
Remix - Build Better Websites
Focused on web standards and modern web app UX, you’re simply going to build better websites Remix is a full stack web framework that lets you focus on the user interface and work back through web standards to deliver a fast, slick, and resilient user experience. People are gonna love using your stuff. export async function loader({ request }) { return getProjects(); } export async function action
iOSアプリのGoogle Chromeは、V8搭載してないし普通のChromeじゃないぽい - nwtgck / Ryo Ota
#iOS #Google_Chrome 前置き Web系の開発者目線で普通のChromeじゃないという意味。（"普通"はV8とか使ってるChromeを意味しているつもり） iPhone/iPadで使えるApp StoreでインストールできるGoogle Chromeアプリはデスクトップ版で使える同様のWebの技術が使えないという話。iOS Safariと同様のWebの技術しか使えないのではないかと思われる。 AppleがiOS WebKitを使うことを強制 以下のように、AppleがiOSのブラウザはiOS WebKitを使うことを強制している。 Apps that browse the web must use the iOS WebKit framework and WebKit Javascript (引用: ) ( 2.5.6) そのため、App Storeでインストールできるすべ
How do I get the path to the current script with Node.js?
How would I get the path to the script in Node.js? I know there's process.cwd, but that only refers to the directory where the script was called, not of the script itself. For instance, say I'm in /home/kyle/ and I run the following command: node /home/kyle/some/dir/file.js If I call process.cwd(), I get /home/kyle/, not /home/kyle/some/dir/. Is there a way to get that directory?
Map.prototype.forEach() - JavaScript | MDN
forEach() メソッドは、指定された関数を Map オブジェクト内にあるキーと値のペアそれぞれに対して 1 回ずつ、挿入順に実行します。 js // アロー関数 forEach(() => { /* … */ } ) forEach((value) => { /* … */ } ) forEach((value, key) => { /* … */ } ) forEach((value, key, map) => { /* … */ } ) // コールバック関数 forEach(callbackFn) forEach(callbackFn, thisArg) // インラインコールバック関数 forEach(function() { /* … */ }) forEach(function(value) { /* … */ }) forEach(function(value, key
Azure Functions (JavaScript) と Blob Storage を使用してファイルをアップロードして分析する
このチュートリアルでは、画像を Azure Blob Storage にアップロードし、それを Azure Functions、Computer Vision、Cosmos DB を使用して処理する方法について学習します。 また、このプロセスの一環として Azure 関数のトリガーとバインドを実装する方法についても学習します。 これらのサービスを一緒に使用して、テキストを含むアップロードされた画像を分析し、テキストを抽出してから、その後の分析などの目的のためにデータベース行にテキストを格納します。 Azure Blob Storage は、クラウド用の Microsoft の非常にスケーラブルなオブジェクト ストレージ ソリューションです。 Blob Storage は、画像とドキュメントの格納、メディア ファイルのストリーミング、バックアップおよびアーカイブ データの管理などのために設計
【TypeScript / JavaScript】this = "これ" ← どれ？ 【備忘録】 - Qiita
この記事で分かること TypeScript（JavaScript）における関数の宣言方法 各宣言方法におけるthisの扱い 初めに 初めまして。新人エンジニアをしているものです。 先日TypeScriptにおける関数宣言について学習する一環で、thisの取り扱いについて学んだので備忘録として書き上げます。 （前提）TypeScriptの関数の宣言方法 まずは複数ある関数の宣言方法を簡単にまとめます。 ①function構文による宣言
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ハッキング大会「Pwn2Own」で陥落した「Firefox」、即座にセキュリティ更新を実施／深刻度「Critical」、「Firefox 124.0.1」「Firefox ESR 115.9.1」へのアップデートを
GitHub - yargs/yargs: yargs the modern, pirate-themed successor to optimist.
好きな部分を軽量ウィンドウに切り離し ～「Visual Studio Code」2023年11月更新／プロファイル機能の追加アイコンやJavaScript/Python向けの便利機能なども
VBScriptが非推奨、将来削除の対象に――自作管理用のスクリプトはどうする？ スクリプトの移植に生成AIは使える？
