カテゴリー: プログラミング

[Ruby]k-means法を実装してみた

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

今回はクラスタリング手法の一つであるk-means法を実装してみたのでまとめてみます。

使用言語は、もちろんRubyです。

なお、ライブラリ等は使わずに実装してみました。

Continue reading “[Ruby]k-means法を実装してみた”

[HTML]formをエンターで送信したい

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

急に暑くなってきた今日この頃、いかがお過ごしでしょうか。

 

今回は、HTMLのお話です。

 

HTMLのformタグで、エンターを押した時に送信したい、という場面になりました。

しかも、送信する部分に関してはJSでコードを書いていました。

例としては、以下のような感じ。

ユーザ名IDを入力してもらい、ボタンを押すと入力された情報をサーバへ送りログイン処理を行う、というもの。

これを、エンターを押した時も同じように処理してほしい、というのが今回の話。

 

サーバサイドのスクリプトも自分で書いていたので、HTMLのsubmitに合わせてデータを取得できるようにすればいいんですが、面倒だったのでlogin関数でなんとかできないかな、と思っていました。

結論としては、formタグに「onsubmit=”return login();”」と書き込んで、

login関数で 「return false;」とすれば解決でした。

onsubmitは、onclickのように関数名を渡せばいいんだと思っていましたが、違うようですね。

onsubmitは、関数等の処理を返す必要があるようです。

 

ただ関数がreturnすればいいのではなく、その値をさらにリターンするイメージですかね。

参考:onsubmitの戻り値をfalseにしてsubmitを実行しない(中断させる)方法 – 小粋空間

 

また、テキストボックスの数によっても挙動が異なるようです。

参考:【HTML】入力欄が1つだけのフォームはEnterキー押下でsubmitされる。submitボタンがなくても。 – SOFTELメモ

 

知らないことがたくさんありますね。

今回はここまで。

おわり。

【HTML/JS】要素のテンプレートを作る

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

タイトル通り要素のテンプレートを作るためのタグの存在を知ったためメモしていきます

 

これまでは、特定のタグをテンプレートとして利用するときは

CSSでdisplay:noneとかをかけて見えなくしておいた要素をelement.cloneNode()で複製していくスタイルでした

 

そんな中、HTML5から追加された(?)templateタグというものを見つけました

これの使い方や、他の方法との速度の差などをまとめていきます

 

Continue reading “【HTML/JS】要素のテンプレートを作る”

【JS/Electron】MacにElectronを導入する

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

今回はMac上にElectronを導入していきます

Electronとは、簡単に言えばChromeの中身であるChromiumを使ってデスクトップアプリを作ることができるフレームワークのことで
Webの技術(HTML/CSS,JavaScript)を使ってアプリを作ることができます
テキストエディタのAtomのために作られたもので、現在はみんなが使えるように公開されています
Atomもちろん、VS CodeやPC版のSlackなどもElectronを使って作られているようです
手順等は続きから

Continue reading “【JS/Electron】MacにElectronを導入する”

【Ruby】MacでRuby2.4.0をコンパイルしてみる

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

今回は、(この記事を書いている時点での)Ruby最新バージョンである2.4.0をコンパイル&インストールしていきます

 

詳しい変更点などは、Rubyの公式サイトからどうぞ

いつも通り高速化とかがメインなのかしら

大きく変わりそうなところは「Unify Fixnum and Bignum into Integer」とか

Introduce hash table improvement (by Vladimir Makarov)」あたりかしら

 

それではれっつこんぱいる!

Continue reading “【Ruby】MacでRuby2.4.0をコンパイルしてみる”

【JavaScript】JS高速化計画 イベント編

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

大層なタイトルをつけましたが、続くかどうかはわかりませんね

あと、内容がお行儀がいいかどうかも保証できませんよっと

 

さて、本題

JSに速度を求めている今日この頃

最近は、少しでも速くなる方法があるのならば、それを使おうと思っています

 

ということで、今回はJSでよく使うであろう

DOMにイベントリスナーを追加する部分を見てみます

 

調べてみると、イベントリスナーを追加するときには

  • addEventListener
  • onXXX

がよく使われていて

両者には違いがあるということはよく書かれています

 

でも、速度の違いは・・・?

ということで簡単なコードを使って検証して見ました

詳しくは、続きから
Continue reading “【JavaScript】JS高速化計画 イベント編”

【JavaScript】JSを高速化するいくつかの方法

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

Continue reading “【JavaScript】JSを高速化するいくつかの方法”

【HTML・JavaScript】入力をリアルタイムに取得する

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

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

 

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

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

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

 

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

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

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

 

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

今回はこれだけ
おわり

【JavaScript】配列の中に要素を含んでいるかを調べる

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

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

 

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

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

 

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

Array.prototype.indexOf() – MDN

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

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

 

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

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

 

今回はこれだけ

おわり

【Elixir】プログラミングElixirをまとめてみる

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

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

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

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

Continue reading “【Elixir】プログラミングElixirをまとめてみる”