仮想DOMとは 仮想DOM(virtual DOM)は、DOMをJavaScriptオブジェクトの形式で表現したもの。 これらのオブジェクトには、ノード名/属性/子ノードなど、実際に表示されるDOMノードを記述するプロパティがある。 <div class="counter"> <h1>0</h1> <button>-</button> <button>+</button> </div> 上記マークアップの仮想DOMは、次のよう…

0.1 + 0.2 === 0.3 // false 一見trueになるように見えるが結果はfalseになる。 これはJavaScriptがIEEE 754*1を採用し、64ビット浮動小数点数を使用するためである。 要するに、コンピュータは2進数ベースで動いているため10進数の少数を計算する場合、正し…

純粋関数とは何か？ 純粋関数(pure function)とは、これら２つの条件を満たす関数を指す。 同じ入力が与えられると、その関数は同じ出力を返す。 関数は、その関数のスコープにおいて副作用を起こさない。 純粋関数は、上記の2つの条件を満たす限り、関数内…

以下の挙動をする pipe関数を作成する const square = v => v * v const double = v => v * 2 const addOne = v => v + 1 const res = pipe(square, double, addOne) res(3) // 19; addOne(double(square(3))) 与えられた全ての関数をスプレッド演算子...を…

How do you clone an object in JavaScript? スプレッド構文...を使うと、オブジェクト自身の列挙可能なプロパティを新しいオブジェクトにコピーできる。オブジェクトの浅いクローン(shallow clone)が作成される。 const obj = { a: 1, b: 2 } const shallow…

What is CSS BEM? BEMとは、スコープ問題を解決するために名前空間を定義することでよりCSSをメンテナンスしやすくするCSSクラスの命名規則。 BEMはblock, element, modifier の略。blockはプロジェクトを通して再利用可能なスタンドアロンなコンポーネント…

HTML5 Web Storageとは何か HTML5では、ウェブサイトはブラウザのローカルにデータを保存できる。データはname-valueペアで格納され、ウェブページは自身で格納したデータにのみアクセスができる。 localStorageとsessionStorage ライフタイムの違い localSt…

30secondsofinterviews.org 30 seconds of interviewsを一通り読んで面白かったので紹介していきたい What are defer and async attributes on a <script> tag? <script src="myscript.js"></script> <script src="myscript.js" defer></script> <script src="myscript.js" async></script> いずれの属性も指定しない場合、スクリプトは同期的にダウンロード・実行…

inputの基底コンポーネントを作る。 親コンポーネントから初期値を受け取りたい 親コンポーネントに入力を動的に伝えたい v-modelは使わずに、@inputでそのまま親に変更されたvalueをemitする。 # input基底コンポーネント Vue.component('baseInput', { pro…