JavaScript,プログラミング

こんにちは、しきゆらです
最近はRubyよりもJSを書いている時間の方が長いです
JSであれこれやっていると、どうしても表示に時間がかかったり
途中でフリーズした?と思うくらい固まってしまうことが増えてきます
(書き方が悪いだけ・・・?)
その問題を解決する際の手がかりとして、いくつか実践してみたことがあるので
それをメモしておきます

HTML/CSS,JavaScript,プログラミング

こんにちは、しきゆらです

今回は、inputやtextarea等でユーザの入力をリアルタイムに取得する方法をメモ

 

入力されたことを取得するイベントトリガー(?)としてchangeは知ってましたが

これは入力されたあと、フォーカスが外れた時に発火するため

入力された時点で何かしたい時には使えませんでした

 

その中で、リアルタイムに入力を取得するためのトリガーとしてinputというものがあることを知りました

参考:JavaScript:テキスト入力関連のイベント、onChange,onInput,onKeyUp – hacknote

これを利用すれば、例えば入力がある時だけボタンをクリックできるようにするときなど二利用できると思います

 

これを利用せず、頑張ってJSで自分で作るときはきっとこんな感じになるのでは・・・?

今回はこれだけ
おわり

JavaScript,プログラミング

こんにちは、しきゆらです

今回は、JSの配列の中に指定した要素があるかどうかを調べる方法をメモしておきます

 

RubyではArrayの中に指定した要素が含まれているかを調べるinclude?というメソッドがありますが

JavaScriptではこのようなメソッドはないようです

 

調べてみると、指定した要素が配列内にあるとき、その要素の添え字を返すindexOfというメソッドが代わりとして利用できそうです

Array.prototype.indexOf() – MDN

var array = [1,2,”3”];
array.indexOf(1); // => 0
array.indexOf("hoge"); // => -1

配列内に指定した要素があれば、その添え字を

ない場合は-1を返すメソッドです

 

これを利用すれば、indexOf(“hoge") >= 0の時とすることで

配列の中に要素がある時にtrueを返すようにできます

 

今回はこれだけ

おわり

Elixir,プログラミング

こんにちは、しきゆらです

今回は、プログラミングElixirという本を買ったので内容をさらっとまとめてみます

(頑張って公式サイトを翻訳しながら進めていたのが今年初めと知ってビビる昨今・・・)

 

この本については、るびま0054号でも紹介されているのでそちらも参照のこと

JavaScript,プログラミング

こんにちは、しきゆらです

タイトルは何を言っているのかわからないかもしれません・・・(語彙力、説明力?不足)

例えば、色を3段階とか10段階とかのような方法で指定する方法を思いついたのでメモ

 

Processingという言語では、色を一定の幅ごとに変化するように指定することができます

colorModeという関数を用いて、RGBからHSLに変更し、合わせて色の幅を指定することで

上記のようなことができます

 

これをJSでも使いたい!

でもどうすれば・・・

と思って調べてみたら、方法を思いついたのでメモ

JavaScript,Ruby,プログラミング

こんにちは、しきゆらです

 

前回の記事でも書きましたが、最近はJavaScriptをよく書いています

その中で、サーバへデータを送信する時はオブジェクトをJSONとして送信するのが便利だということで

JSON文字列をJavaScriptで作って、サーバへ送っています

 

そして、サーバ側はRubyで書いているのですが

JSON文字列をRubyのオブジェクトに変換するためにはjsonというgemを使います

そこで注意することがあったのでメモしておきます

 

JavaScript,プログラミング

こんにちは、しきゆらです

今回は、タイトル通りXMLHttpRequestオブジェクトを複数作る場合のメモです

 

XMLHttpRequestオブジェクトをたくさん作る時、似たような記述が多くなってしまい

コードが読みにくい!

これを解決するために、考えついたのが

「XMLHttpRequestオブジェクトを作って返す関数を作ればいいのでは?」

ということ

 

今回は、これについて書いていきます

JavaScript,プログラミング

こんにちは、しきゆらです

今回は超絶短くいきます

 

JavaScriptの配列をまっさらにする方法をば

array = [1,2,3,4,5];
array.length; // => 5
array.length = 0;  // => array は []となる

これは知らなかった

 

おわり

HTML/CSS,JavaScript,プログラミング

こんにちは、しきゆらです

絶賛ブログ更新期間中ですよ、奥さん

 

タイトルから内容がわかるのかな・・・?

JavaScriptからHTML要素にCSSクラスを複数指定する方法を知ったのでメモ

HTMLに指定するクラスは、CSSクラスと表記します

JSで定義するオブジェクト的な意味でのクラスとは区別するため

 

CSSクラスを一つだけ指定するなら

element.className = "hoge";

でelementにhogeというCSSクラスを指定したことになります

しかし、

element.className = "hoge";
element.className = "fuga";

とするとhogeではなくfugaが指定された状態になってしまいます

<element class="hoge fuga">こんな要素はないよ</element>

という形にする場合は

element.classList.add("hoge");
element.classList.add("fuga");

とすると良いようです

 

なお、CSSクラスを削除する場合は

element.classList.remove("hoge");

とするとCSSクラスを削除できます

 

合わせて

element.classList.toggle("hoge");

とするとelementにhogeというCSSクラスが指定されている場合は削除し、そうでない場合は追加する

ということが可能です

 

これを見つけるまでにかなりの時間を要しました・・・

知っていればすぐなのにね

 

おわり

Ruby,プログラミング

こんにちは、しきゆらです

自分の中で、絶賛ブログ更新キャンペーン中です

 

それは置いておいて、今回の内容は

「サーバでのエラーもクライアントに返しちゃおう」

というお話です