豚吐露@wiki

ECMAScript

最終更新:

ohden

- view
管理者のみ編集可
ECMAScript: ブラウザ毎に仕様の差異がある『JavaScript』『JScript』を仕様統一しようとしてできたもの。

tools
DOM操作用lib。昔は重宝されたが、今はVanillaJSの方が圧倒的に早いので、敬遠されがち。
特に、jQueryを用いるとVanillaに比べてとても遅くなるのがネック。


JavaScriptに静的型付けを追加したもの。JavaScriptのままでも書けるのでbabelとか入れとるなら突っ込んだ方が吉。


SVG操作用lib。とても使いにくいが、最も支持されてるlib。version 4、5、6で異なる部分が多い。
なので、webなんかで調べたりする時は、自分の使いたいversion no含めて検索するなど気をつけたい。


どちらも読み込むと'_'というobjectを使って、VanillaJSに無い機能を提供してくれるlib。
Lodashは、Underscoreのfork。つまり後発で、機能も多い。が、Underscoreの上位互換という訳ではないので注意が必要。
Lodashの機能がVanillaの標準機能に含まれると、Lodashから同等の機能は削除されるって傾向にあるので、使えるんならVanillaの機能を使った方が良い。

ヴィート。webpackなどのfrontend toolに代わるもの。





tools
codepen
HTML、JavaScript、CSSでリアルタイムに結果を確認しながら開発ができるサービス。
機能は少ないが、簡素なものを作るのなら問題無い。
Vue Pen
Vue版のcodepenがいつの間にかあった。

codesandbox
codepenと似たようなサービス。codepenよりも多機能。
特定のframeworkを用いて作成する際に便利。
file explorerを利用できるのが良い。

stackblitz
codesandboxみたいに多機能のWebIDE。
editorがVSCodeになってる。

~ tips ~


~ tips memo ~
Minify ファイル圧縮。記述量を減らしてファイルサイズを小さくする方法。具体的には
・tabやspaceの削除: 複数→1や全く消したりする。
・改行の削除: 改行→spaceや改行の削除を行う。
・true/falseの削除: true→!0、false→!1
・変数名の一文字化: 意味を持たせてる変数名を1文字変数化する事で絶対的な文字の数を減らす。

ここからはホントに行われるかは知らんけど、可能性のある変換を...
・if文の削除: 論理演算子『&&』『||』を用いたり3項演算子を用いる。

!0 true を表す
!1 false を表す
!!1、!!0 数値から論理型への変換を行う。
つまり『1==true→true』『0==false→true』だけど、『1===true→false』『0===false→false』となるのを少ない記述で回避したい場合に使う。
2重否定を行う事で『!!1===true→true』『!!0===false→true』とできる。
x()&&y() xの結果がtrueならyを実行
true && y(): yは実行される。false && y(): yは実行されない。
これは、論理演算子の短絡評価という特性を用いたもの。
x()||y() xの結果がfalseならyを実行
true || y(): yは実行されない。false || y(): yは実行される。
これは、論理演算子の短絡評価という特性を用いたもの。
短絡評価  最小評価とも言う。
これは論理演算が行われる時、左から順に処理が実行され、最終的な論理演算結果が確定した場合、以降の処理を行わないというもの。
例えば、論理積の場合『a() && b() && c()』の時、a、b、c全ての結果がtrueでなければ最終結果がtrueにならない。逆に言うと、1つでもfalseを返せばその時点で最終結果がfalseと確定する。
つまり、『aがfalseを返したら、b、cの結果に関係無く最終結果がfalseとなるので、b、cをcallしなくても良いよね?しなくて良い処理ならやらないよ!』と言う仕様。当然、aがtrueを返しても、bがfalseを返せばcは実行されない。

論理和にも同じ事が言える。論理和がfalseを返すのは、全ての結果がfalseになった時。逆に言うと、1つでもtrueとなればその時点で最終結果がtrueと確定する。
論理積の時と同じように『a() || b() || c()』で考える。aがtrueを返すと、b、cの結果に関係無く最終結果がtrueとなるので、b、cをcallする必要は無い。なので、b、cは実行されない。aがfalseを返してもbがtrueを返すとその時点で最終結果がtrueに確定してしまうので、cは実行されない。

ただし、言語によっては、論理積の時に短絡評価を行わないものもある。
つまり『a() && b() && c()』とあった時、aがfalseを返しても、b、cの処理を行った結果を律儀に論理演算して最終結果を出してくれるって言語仕様。
短絡評価を使う場合は、言語仕様をしっかり把握して記述する必要があるので要注意です。




更新日: 2023年09月11日 (月) 01時08分34秒



名前:
コメント:

すべてのコメントを見る
記事メニュー
目安箱バナー