好きなだけかりんとうを食べる人生

フロントエンドとかデザインとかバックエンドとか浅く広く。社会人3年目のうぇぶでぃれくたーです。

Javascript

オブジェクト指向を意識してコードを書いてみた

今までオブジェクト指向に則ったコードの書き方とか全く意識したことがなくてですね、 ワークショップとかセミナーとかで現場で働いている方のコードを見た時に「なんだこれ」っていう顔にならないように確認しておこうと思いました。 そもそもオブジェクト…

Javascriptを使ってテキストフィールドの内容をリアルタイムで表示させる

これまたお仕事関係で使いそうなので先回りでコードを書いてみました。 コード ※chrome想定 <textarea id="text"></textarea> <div id="output"></div> window.onload = function() { var txtEl = document.getElementById('text'), outputEl = document.getElementById('output'); txtEl.addEventListener('keyup',…

Javascriptを使って選択しているテキストを取得する

今インターン先で担当しているお仕事に使えそうなのでメモします。 コード ※chromeでの使用を想定しています <div>あいうえお</div> <button id="btn">取得する</button> window.onload = function() { var btnEl = document.getElementById('btn'); var str = ''; btnEl.addEventListener('click'…

クロージャを本能的に理解できない理由を考えたらあっさり解決した話

Javascriptを勉強している方なら誰でもぶち当たる壁、クロージャ。 「クロージャを理解する=Javascript初心者卒業」とまで言われてたりしていますよね。 サンプルを見たりコードを書いたりしてなんとなくどういうものかは掴めてたのですが、 「関数内でretu…

Javascriptの関数定義、実行についてのおさらい

タイトルまんまです。 クロージャとかスコープチェーンとか調べてる間にこんがらがってきたので確認のため。 関数定義と実行のパターン 1:function命令 function test() { console.log('hoge'); } test(); // hoge 関数funcを直接定義しています。 関数名()…