Netscape 社の JavaScript と、Microsoft 社の JScript の動作を統一するために作られた、プログラミング言語の仕様。 Java 言語のようなクラスベースではなく、プロトタイプベースのオブジェクト指向を採用している。
ECMAScript をベースとしている言語として、
などがある。
ES6(ECMAScript 2015)以降ではvarの使用を避けることが推奨 ブロックスコープと関数スコープの違い ES6(ECMAScript 2015)以降ではvarの使用を避けることが推奨 JavaScriptにおいては、ES6(ECMAScript 2015)以降では、varの使用を避けることが推奨されています。 代わりにletやconstを使用することで、変数のスコープや再代入の制御が向上し、コードの品質が向上します。以下は、varを使わない方がよい理由で す。変数のスコープ問題: varは関数スコープを持ち、ifやforなどのブロック内で宣言されても、その変数は関数全体でアクセス…
PMDバージョン: 7.0.0-rc4 AvoidTrailingComma 公式ドキュメント: AvoidTrailingComma Since: PMD 5.1 Priority: High (1) Description: ブラウザによってオブジェクトや配列リテラルの末尾のコンマの扱いが異なるため、末尾にコンマを書かないように留意することでコードの移植性を向上させるのに役立つ。 Property: 名前 デフォルト値 説明 複数指定 allowObjectLiteral false オブジェクトリテラル内の最後のカンマを許可する - allowArrayLiteral false 配列リ…
PMDバージョン: 7.0.0-rc4 AssignmentInOperand 公式ドキュメント: AssignmentInOperand Since: PMD 5.0 Priority: Medium High (2) Description: 条件式内での値の代入は避ける。コードが複雑になり、読みにくくなる。 等号演算子「==」の代わりに代入演算子「=」が使用されるバグを検出することがある。 Property: 名前 デフォルト値 説明 複数指定 allowIf false if文の条件式内での代入を許可する - allowFor false for文の条件式内での代入を許可する - al…
PMDバージョン: 7.0.0-rc4 Best Practices AvoidWithStatement 公式ドキュメント: AvoidWithStatement Since: PMD 5.0.1 Priority: High (1) Description: withの使用を避けるべきである。 Configuration: <rule ref="category/ecmascript/bestpractices.xml/AvoidWithStatement" /> Example: with (object) { property = 3; // オブジェクトなのかwindowなのか判断つ…
先月出版された「JavaScript Primer 改訂2版 迷わないための入門書」の内容レビューに関わらせていただきました。 先日出版社の方から、完成した書籍をご恵贈いただきました。ありがとうございます。 www.kadokawa.co.jp JavaScript Primer 改訂2版 迷わないための入門書作者:azu,Suguru InatomiKADOKAWAAmazon efcl.info 第1版からの主なアップデートとして、ECMAScriptの新しいバージョン(ES2020, ES2021, ES2022)で取り入れられた機能を取り上げたり、Promise, Async Func…
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…
応用情報の過去問を解いた時のメモ ディスプレイ 有機EL:電圧、発光素子 ブラウン管:電子ビーム 液晶:透過する光 プラズマディスプレイ:放電、紫外線、蛍光体 略語(言語) DDL:Data Definition Language。データベースの定義に使われるSQL。 HDL:Hardware Description Language。デジタル回路の構成を文章で記述。FPGA、直接論理構成 UML:Unified Modeling Language。オブジェクト指向開発。 XML:eXtended Markup Language。システム間のデータ交換。利用者が自由に定義。 DisplayPo…
www.itmedia.co.jp 月面では14日間続く灼熱の昼と、14日間の極寒の夜が訪れる。月面の昼は110度、夜はマイナス170度になるとされ、SLIMの設計範囲を超えた非常に厳しい温度環境だ。 「SLIM」月面の夜を超える 極寒に耐え、通信再開の快挙 - ITmedia NEWS ⇧ 設計範囲を超えた、って部分がよく分からないんだけど、意図的なのかしら、何かモヤる... 快挙なんだとは思いますが... JDK(Java Development Kit)に同梱されているjrunscriptでJDBC接続の確認ができるらしい(非推奨) 何やら、 tc.hatenablog.com サーバ上…
SREチームの藤原です。 今回は Amazon CloudFront Functions をテストするためのOSSとして、cfft というものを書いたので紹介します。 github.com 3行でまとめ CloudFront Functionsのテストは手元ではできなくて面倒です CloudFront Functionsをテストする cfft というOSSを書きました KeyValueStoreの操作を含め、便利な使い方がいろいろありますのでどうぞご利用下さい CloudFront Functionsをテストするのが面倒という問題 CloudFront Functions (以下CFF) は、…
はじめに 本記事は以下の教材を読んだ感想を書いております。 jsprimer.net 良かったところ Javascriptの基本から応用までこれでもかというくらい詳しく記載されています。第一部に基本文法、第二部に応用編と題してTodoアプリの作成などを行っており、どの項目にもサンプルコード豊富に記載されているのでとても理解がしやすくなっております。 学んだこと 基本編 JavaScriptとは コメント 変数と宣言 値の評価と表示 データ型とリテラル 演算子 暗黙的な型変換 関数と宣言 文と式 条件分岐 ループと反復処理 オブジェクト プロトタイプオブジェクト 配列 文字列 文字列とUnico…
ECMAScript の Boolean(value) の仕様の前半部分をなるべく詳細に読んでみました。
プロジェクトを長い期間メンテナンスしていると、あれ?これなんでこんな書き方になってるんだっけ?という実装に時々出会います。他の人が書いたソースならともかく、自分で書いたにも関わらず、あれ?あれれ?と思うことが良くあります。 ロジックに対するあれれ?ならば、コメントを読んだり、設計ドキュメントを読んだり、実装の前後を読んだりすることで解消することもあるのですが、細かな実装方法に関してはなんだかさっぱりわからなくて、まぁいいか、このままにしちゃえ、ということもままあります。 最近特に気になっているのが、TypeScript で本来必要でないところに現れる謎の optional chain。動作には…
先日購入した「TypeScriptとReact/Next.jsでつくる実践webアプリケーション開発」で、TSやフレームワークであるNext.jsを触れつつ実際に開発を経験してみる。その学習記録。 またうひょ氏こと鈴木僚太氏著の「プロを目指す人のためのTypeScript入門」も併読している。TSの挙動や仕様を知るにはうひょ氏著作を、実際に作ってみる教科書としてアプリケーション開発のほうを拝読している。 記事内容は学習その記録。 「TypeScriptとReact/Next.jsでつくる実践webアプリケーション開発」chapter2.6では各種開発時の設定についての節がある。 中でもtsco…
次回: CRAからViteへの移行 - Vite移行編 - harryのブログ 前書き 個人開発のSPAでcreate-react-app(以下CRA)を使っていたが、少し前ついに最新版に更新できないライブラリが出てきてしまった。 ので、重い腰を上げて移行作業を始めた。 が、テスト移行だけでしんどい事になってきたので、忘れないうちに記事を書く。 つらすぎたので既にVite移行完了後はVitestへ移行することを心に決めつつある。 以下の記事で言及されている通り、テストをCRA依存からjest単体へ移行することは、Vite移行とは独立して作業できます。 そのため、まずはこちらから始めます。 移行…
Webアプリケーションプログラムの開発に関する次の記述を読んで,設問に答えよ。 Q社は,洋服のEC事業を手掛ける従業員100名の会社である。WebアプリQというWebアプリケーションプログラムでECサイトを運営している。ECサイトのドメイン名は“□□□.co.jp”であり,利用者はWebアプリQにHTTPSでアクセスする。WebアプリQの開発と運用は,Q社開発部が行っている。今回,WebアプリQに,ECサイトの会員による商品レビュー機能を追加した。図1は,WebアプリQの主な機能である。 図1 WebアプリQの主な機能 ある日,会員から,無地Tシャツのレビューページ(以下,ページVという)に1…
年初に目標を定めたので振り返りをやっていく。早速1日ズレてしまっているがまあ誤差ということで... jerome-1010.hatenablog.com 腰痛を発生させない ジムに行く 目標: 週に2回行く 結果: 週に1回行った 達成率: 50% ラジオ体操する 目標: 週に5回行う 結果: 週に3回行った 達成率: 60% 腹筋ローラーをする 目標: 週に5回行う 結果: 週に2回行った 達成率: 40% 湯船に浸かる 目標: 週に5回行う 結果: 週に5回行った 達成率: 100% ストレッチする 目標: 週に4回行う 結果: 週にX回行った 達成率: 80% ダイエット 歩く or 走…
年末年始に作成しているRPGツクール用プラグインの管理リポジトリをいい感じにしよう!と思い、いろいろ作業をしていました。 ひとまず一段落したので、何を思っていたのか、何をしたのかについてまとめてみることにしました。 前提:ツクールのプラグイン プラグインを作る上でのなやみ (1) アノテーションコメント書くのがしんどい (2) コードの分割ができないので長くなりがち (3) (ツクールMV固有)古いブラウザのために新しい記法は使えない ビルド環境を整備して、なやみを解消する (1) アノテーション問題 → YAMLで書いて自動生成する (2) コードの分割問題 → Rollup でビルドするよ…
はじめに こんにちは!Akira(彰)です! 今回は JavaScript Primer - 迷わないための入門書 を読んだ感想を 良かったところ 学んだこと 難しかったこと に分けて書いていきたいと思います! 良かったところ ECMAScriptを意識した学習ができる ECMAScriptを意識して学ぶことで、どの実行環境でも対応できる基本的な知識を学べます。 初歩的な文法も一緒に学べる 本書は「すでに何かしらのプログラミング言語を触ったことがある人向けに書かれています。」とありますが、読んでみると初歩的な文法も"丁寧"に解説されているため1言語、Progateを終えた程度の知識でも理解でき…
毎週、技術書を読んで、ざっくり紹介します。今日は、azu, Suguru Inatomi著『JavaScript Primer(WEB版)』。 (購入はこちらから) ※こちらは書籍版です。ささざめ的にはひとまず無料で読めるWEB版を読んでみることをオススメします。 JavaScript Primer 改訂2版 迷わないための入門書作者:azu,Suguru InatomiKADOKAWAAmazon 本書の目次 書籍目次を開く はじめに 著者紹介 読み始める前の事前準備 文章の間違いに気づいたら 第一部: 基本文法 JavaScriptとは コメント 変数と宣言 値の評価と表示 データ型とリテ…
このエントリは【カヤック】面白法人グループ Advent Calendar 2023 の24日目の記事です。 こんにちは!意匠部のおばらです。 面白法人カヤックでは日々、様々な社内勉強会が開催されています。本記事では JS 好きな社内のエンジニア向けに私が企画&主催している「JS体操」についてご紹介します。 記事の最後にはみなさんも挑戦できるように最新の「JS体操」を紹介しています。ぜひ挑戦してみてください。 1.「JS体操」とは? 2.「JS体操」の掟 3.「JS体操」のメニュー 3.1. 何らかのロジックを解く 3.2. コードゴルフで文字数を競う 4.「JS体操」の流れ 4.1. 出題方…