Netscape 社の JavaScript と、Microsoft 社の JScript の動作を統一するために作られた、プログラミング言語の仕様。 Java 言語のようなクラスベースではなく、プロトタイプベースのオブジェクト指向を採用している。
ECMAScript をベースとしている言語として、
などがある。
先月出版された「JavaScript Primer 改訂2版 迷わないための入門書」の内容レビューに関わらせていただきました。 先日出版社の方から、完成した書籍をご恵贈いただきました。ありがとうございます。 www.kadokawa.co.jp JavaScript Primer 改訂2版 迷わないための入門書作者:azu,Suguru InatomiKADOKAWAAmazon efcl.info 第1版からの主なアップデートとして、ECMAScriptの新しいバージョン(ES2020, ES2021, ES2022)で取り入れられた機能を取り上げたり、Promise, Async Func…
前提 トランスパイラ利用の有無に関わらず、ES2017 相当の(2021/10 時点でブラウザの対応率が十分に高い)記述がユーザーのブラウザで動くようにする、という方針 トランスパイラを用いても、ECMAScript の全ての記述を変換してくれるわけではないことは薄々気づいていた ESLint を用いても、ECMAScript の全ての記述を解析してくれるわけではないことは薄々気づいていた 目的 ECMAScript を利用した場合に トランスパイラは何を変換し、何を無視するのかを検証する ESLint は何を解析し、何を無視するのかを検証する 検証用の入力 ES6 〜 ESNext の規格に…
ECMAScriptはJavaScriptの標準規格で、2015年以降毎年改定されています。この記事を読むとES2022に採用された仕様、ES2023に決まっている仕様、次に盛り込まれそうな仕様がわかります。 ECMAScriptとは ECMAScriptとはJavaScriptの標準規格 ECMAScriptのバージョン ECMAScriptの策定プロセス ES2022 .at() Top-level await クラスにプライベートなインスタンスフィールド、アクセッサ クラスに静的なフィールドとメソッド クラスに静的イニシャライザブロック Object.prototype.hasOwn E…
IE11の考慮が不要となった場合に、特定のブラウザバージョン以降で使えるようになる機能一覧を列挙して表示するサイトを作った。 the-world-after-ie-left.vercel.app リポジトリはこちら github.com デフォルトでは Chrome > 90 Edge > 90 Firefox > 90 Safari > 13 以降で使える機能を確認できる。 ※ ちなみに雑にVercelにデプロイしてるので、レスポンスが巨大すぎるとVercel自体の制限に引っかかって死ぬことがあるので、落ちる場合は絞り込み用のブラウザバージョンをちゃんと入れてください。 IE卒業式という社内…
はじめに v-bindの基本 v-bindでクラス名を固定値+動的にしたい場合どうする? APIの帰り値をクラス名に設定したい aタグのhref属性を動的にしたい時 aタグのtarget="_blnak"を動的するにはどうしたらいいか まとめ はじめに こんにちは。エンジニアの仕事をしている、たかふみです。 本日はVue.jsでよく使う、v-bindの値でattributeを動的にするにはどうしたらいいのか、TIPSをまとめていきたいと思います。 v-bindの基本 根本的にv-bindの基礎から説明いたしますが、v-bindとは、HTMLの属性を動的にするためのvue.jsの機能です。 下記…
ECMAScriptはJavaScriptの標準規格で、2015年以降毎年改定されています。この記事を読むとECMAScriptの仕様策定プロセスが理解でき、ES2021に採用された仕様、ES2022に決まっている仕様、次に盛り込まれそうな仕様がわかります。 ECMAScriptとは ECMAScriptのバージョン ECMAScriptの策定プロセス ES2021 String.prototype.replaceAll Promise.any WeakRefs Logical Assignment Operators Numeric separators ES2022(確定分) Class …
最近Webフロントを入門したことで、JavaScriptを勉強する機会が増えたが、ECMAScriptについての理解が曖昧だったので軽くメモ👷♀️ ブラウザでのJavaScript JavaScriptのコードをプログラムとして動作させるには、JavaScriptエンジンでコードをコンパイルして実行させる必要があります。ChromeやSafariを始めとしたブラウザは、それぞれJavaScriptエンジンがあり、これにより同じJavaScriptでもブラウザによって挙動が変わっています。 ちなみに、JavaScriptエンジンには下記のようなものがあります。 エンジン 内容 V8 Googl…
ビザスクWebチームエンジニアの小柳(@mascii_k)です。先週の6/6(木)に弊社が会場提供した Meguro.es #21 について、当日の様子をレポートしたいと思います。Meguro.es公式のレポートもぜひご覧ください: Meguro.es #21 を開催しました イベント概要 Meguro.esは2ヶ月に一度、目黒駅周辺、目黒区、目黒川沿い、敷地の一部が目黒といった、目黒っぽい会場で開催されるJavaScript (ECMAScript)に関するコミュニティーイベントです。弊社は隣のビルに "SHIBUYA" と書いてあるなど、なんとも渋谷感あふれる立地ですが、目黒区青葉台に所在…
こんにちは、CX開発Gでエンジニアをしているn-black-catです。 弊社の一部のプロダクトではWebpackを利用してビルドを行っていますが、使用している箇所のビルド時間が長くなっていることが社内で話題に上がりました。 問題の原因を探るために、Webpackのビルドログの詳細を出力したいと考えました。 しかし、その方法を調べる中で、日本語の記事や資料が極端に少なくとても苦労しました。 そこで、これから同じ問題に直面する方のため、また自分のための備忘録として、その方法をこちらに記録しておきたいと思います。 TL;DR コマンドラインでの設定 --stats verboseを追加 webpa…
今ではウェブ開発において必須とも言える JavaScript ですが、初期は Flash 人気の影に隠れておりそれほど利用される言語ではありませんでした。2000年代後半頃から Google による Ajax の利用や jQuery の登場などから JavaScript 人気は徐々に高まり、Safari ブラウザの Flash 非サポートなどを経て現在の人気言語に至るような歴史を辿ってきました。 そのような変遷の中で、JavaScript の記法や関数などを定義している EcmaScript も次第に整備され、2015年の ES2015 をひとつのターニングポイントとして、現在は毎年最新バージ…
請求予定日の自動メール通知 GASコード 今回は、GoogleスプレッドシートとGoogle Apps Script(GAS)を連携させて「取引先への請求予定日が近づくと、自動で通知メールを送信する」処理を行うコードをご紹介します。 ※コピペで使用できるサンプルコード付き 以前も似たような自動メール通知コードをご紹介しましたが、今回はChat GPT-4の助けもあり、さらに改良されたものとなっています。▼前回の「仕入予定日の自動メール通知」コードに関する記事はこちら blog.sugiokasystem.co.jp 請求予定日の自動メール通知 GASコード コード処理の流れと主な内容 GASコ…
こんにちは。N予備校 Webフロントエンド開発チームの堀です。 先日 TypeScript@5.2 が正式リリースされました。 TypeScript@5.2 で新しく追加された using Declarations and Explicit Resource Management (using 構文と明示的リソース管理)によって、N予備校のフロントエンドのテストでの本質的でない処理をカプセル化し、コード上のノイズを削減することができました。 この記事では、using 構文の活用方法や利用するまでの手順、調査した using 構文の挙動について紹介します。 N予備校のPCブラウザ向けフロントエン…
www.itmedia.co.jp ⇧ お金の問題に行き着く感じですかね... う~む、 news.yahoo.co.jp ⇧ 妥当な予算を研究に回せているんだろうか... 話は変わりますが、 www.huffingtonpost.jp ⇧ 22年が経過したのか... アメリカがだいぶ叩かれてるけど、自爆テロを計画・実行した輩が諸悪の根源であることに変わりはない気はするが、未だ真相は闇の中なんかね? DHH(David Heinemeier Hansson)、TypeScriptやめるってよ 見出しは、 桐島、部活やめるってよ (本編BD+特典DVD 2枚組) [Blu-ray] ⇧ へのオマ…
小ネタ。 前提 なし 詳細 私が関わっているシステムでは、001, 002等で種類を表すコード値を使っていることがあります。基本的には文字列で処理するので問題はほとんど発生しないのですが、状況によっては8進数の文字列と解釈されることがあります。可能な限りE001, I001等のprefixを付与するか、0埋めのコード値を使うことを回避してください。 参考 各進数表現のフォーマットを記載します。 8進数は言語によってフォーマットが異なるので注意してください。 2進数 0bを先頭に付与する 0b01 8進数 0を先頭に付与する 07 C言語やC++言語、Java、JavaScript(ES5以前)…
Zenn にメモしたのをまとめたものです 環境 vite 4.4.9 typescript 5.1.6 jest 29.6.4 ts-jest 29.1.1 @types/jest 29.5.4 Jest の導入 $ npm i -D jest ts-jest @types/jest # Jestの設定ファイル作成 $ npx ts-jest config:init # jest.config.js が生成される jest.config.js /** @type {import('ts-jest').JestConfigWithTsJest} */ module.exports = { pre…
Software Design 2023年9月号を読んで、ちょこっとずつ感想を書いてます。 gihyo.jp いつも参加しているSoftware Design輪読会に向けての予習でもあります。 softwaredesign.connpass.com 特に気になったこと JavaScript非同期処理の記事、よかったです。 普段あんまり考えずにやってましたが…裏側の話などもあって、理解が進んだ気がします。 特に、2章のトラップ。 カオスエンジニアリング、みなさんやってますか?やろうとしてますか? うちは…全くです…。 でも、実際に問題を起こして復旧させることを定期的にやったら、だいぶよさそうに思…
目次 JavaScriptで文字列の前方一致を検査する方法 startsWithメソッドの使用 正規表現の利用 sliceやsubstringメソッドを利用 JavaScriptで文字列の前方一致を検査する方法 文字列の前方一致を検査する際、JavaScriptには複数のアプローチが存在します。 この記事では、3つの主要な方法を紹介します。 startsWithメソッドの使用 ES6(ECMAScript 2015)で導入されたstartsWithメソッドを使用すると、文字列が指定された文字列で開始されるかどうかを簡単に確認することができます。 const str = "こんにちは、世界"; …
目次 TypeScriptとは何か? TypeScriptのメリット TypeScriptを始めるために必要なもの 基本的なTypeScript構文 クラスとインターフェース ジェネリックスと型推論 まとめ 1.TypeScriptとは何か? TypeScriptはJavaScriptのスーパーセットで、JavaScriptに型安全性やクラスベースオブジェクト指向プログラミングなどを追加します。これにより、大規模で複雑なアプリケーションをより簡単に管理し、デバッグすることが可能になります。 let isDone: boolean = false; 2.TypeScriptのメリット 型安全性:…
Jest を使ったテストをしていて axios を使っているコンポーネントのテストで下記のようなエラーになった SyntaxError: Cannot use import statement outside a module > 1 | import axios from 'axios'; | ^ SyntaxError: Cannot use import statement outside a module axios が import できないっぽい。なんでや! 環境 jest 26.6.3 axios 1.4.0 axios が ESM で提供されていて、Jest が CommonJ…
はじめに JavaScriptの文法の勉強にJavaScript Primerという本を読みました。 今回はJavaScript Primerを読んでの感想をまとめていきたいと思います。 学んだこと JavaScriptとECMAScript ECMASctiptはどの実行環境でも共通な動作のみが定義されており、JavaScriptはECMAScriptと実行環境の固有機能を含んだものを表す。 変数と宣言 varの問題点 const,let→同じ変数名で再定義しようとすると構文エラー var→同じ変数名で再定義可能 varは同じ変数名で再定義可能であるため、意図せずに再定義した場合もエラーとな…
Webpackを使ってrequireを擬似的に再現する方法を説明します: Webpackをセットアップする:プロジェクトディレクトリにpackage.jsonを作成し、Webpackや必要なローダーをインストールします。 bash Copy code npm init -y npm install webpack webpack-cli babel-loader @babel/core @babel/preset-env --save-dev Save to grepper Babelの設定:.babelrcファイルを作成し、Babelの設定を追加します。 json Copy code { "…
はじめに JavaScript や TypeScript のテストで、Jest を使う機会は多いかと思います。 この記事は、Jest の使い方を逆引きリファレンスの形式で掲載します。 今まで Jest でテストを行う際は webpack を使用することが多かったのですが、webpack はすでに開発が終了していてます。 人気のJavaScriptバンドルツール「webpack」の開発はなぜ終わり、後継として「Turbopack」の開発が始まったのか。開発者がその理由を語る - Publickey この記事では webpack の代わりに、Vite(ヴィート) というフロントエンドツールを使用し…
はじめに 先日、AWSのクラウドセキュリティ、コンプライアンスに特化したカンファレンスであるre:Inforce 2023 がアナハイムで開催され、 そこで脆弱性の静的解析サービスの Amazon CodeGuru Security のプレビュー版が発表されました。 aws.amazon.com AWSでは既に様々な脆弱性検知サービスが存在しており、何が違うの?と思われる方も多いかと思います。 今回はCodeGuru Securityの具体的な機能について他の脆弱性検知サービスとの違いも含めて紹介します。 またCodeGuru SecurityをCI/CDに組み込んでみて、DevSecOpsの…