箱のプログラミング日記。

えんじにあ奮闘記

初心者によるJSのビルド【Node.js / npm / yarn / webpack / babel】

この記事は前回の記事の続きになります。 前回では、そもそものビルドの意味やそれぞれのプラグイン等がどんな役目を果たすのかという基礎的な部分がわかっていなかったので、その辺を理解していきました。 今回は実際にビルドを実行するところまで進めてい…

Node.jsとは?npm / yarnとは?webpack / babel とは??

JSをビルドしようとすると登場する「Node.js」「npm」「yarn」「webpack」「babel」たちがいまいちよくわからず進んできてしまっていたのですが、最近ようやくそれぞれの役割をざっと理解できるところまで到達したのでメモ。 そもそもビルドとは そもそもの…

JavaScriptの分割代入が便利

Ruby人間がJSを学び直すプロジェクト継続中です。 なんでもRubyに置き換えて考えてしまうのは悪い癖...それで理解度が深まるのであれば良いのかな。 JSでオブジェクトを作成する 分割代入に入る前に、オブジェクトの作成のところから。 空のオブジェクトを作…

JSの関数宣言の基本

Ruby脳の人間が生のJSを学び直そうプロジェクト進行中。 今回は関数宣言についてあやふやだった部分をまとめた。 基本構文 オブジェクトとして定義する場合 function hoge () { 処理 } ある程度のまとまりの処理をオブジェクトとして定義しておいて、いろん…

JavaScriptの型変換〜Rubyと比較〜

最近生のJSをきちんと勉強し始めて、知らなかったことがちょこちょこ出てきたのでRubyと比較しながら書いていきます。 JavaScriptの型変換 文字列に変換 String()関数を使用 String(1); // => "1" String([1, 2, 3]); // => "1,2,3" String(true); // => "tr…

JavaScript each文の書き方

基本構文 $('セレクタ').each(function(index, element){ 処理 }) eachで処理を回すとともにindex番号をつけることができるので、 例えばul要素の中にあるli要素に対し、 順番にindex番号のついた異なるidをつけていく、とかが実現できる。 以下参考 www.sej…

JavaScript if文の書き方

基本構文 if (条件式) { 処理 } else { 処理 } 条件式を追加したい場合は「else if」で記述する。 変数定義をif文で分岐 var input = (function(){ if(条件式) return 'aaa'; if(条件式) return 'bbb'; return 'ccc'; })(); else ifを省略して書くことができ…