display flex で子要素の高さを揃えない方法
display flex を使った場合、デフォルトでは以下のようにAAAとCCCも、BBBの高さに揃います。
高さを揃えたくない場合は、align-items: baseline; を指定します。
<div s ...
JavaScript 関数かどうかをチェックする場合は typeof func === ‘function’
JavaScript では関数の引数に関数を渡せることが強力です。
例えば、以下のような関数をつくることができます。
function hoge(func, str) { func(str);}hoge は引数 ...
JavaScript setTimeout の第三引数について
以下のような関数があるとします。
const log = message => {console.log(message);};setTimeout を使って3秒後にこの関数を実行したいとします。
以下の ...
プログラミングのモチベーションが上がらないときでも、毎日これだけはやっておくと良いこと
プログラミング学習の難関の一つとしてはモチベーションの維持だと思います。
今回は毎日数分でできるプログラミング学習方法のご紹介です。
方法github で人のコードを読むこと、です。
github ...
JavaScript での DOM 操作を関数型プログラミングっぽく書いてみる
以下のようなHTMLがあります。
<div id="parent"> <div name="hoge">aaa</div> <div name=& ...
TypeScript in演算子の型ガード
TypeScirptでは、条件文でin演算子を使った時にも型ガードとして利用できます。
型ガードとは、条件ブロック内でオブジェクトの型を制限できることです。
以下のコードをみてみます。
type Hoge ...
JavaScript HTMLの子要素に対してループ処理をしたい時の注意点
以下のようなHTMLがあり、id=”parent”の子要素のdivのtextをすべてつなげた文字列を取得したいとします。
<div id="parent"> <div ...
JavaScript カンマ演算子を使うと少しだけコードが少なくなる
以下のようなmyFunc関数があります。
const hoge = () => 'hoge';const foo = () => console.log('foo');const ba ...
JavaScript 数値へ変換する際に単項プラスを使う
JavaScriptで数値以外を数値へ変換するのに Number を使いますが、単項プラス(+)でも同様のことができます。
console.log(Number(10));//10console.log(+10);//10con ...
jQuery $(document).on と $(selector).on の違い
$(document).on は動的に追加されたHTMLに対してもイベントを処理できます。
一方で、$(selector).on は、その時点のHTMLに対してのみ作用します。
以下が例です。
まず ...









