PAGE TOP

アトトックラボ

20180617

JavaScript の文字列検索と使い分け

JavaScript で文字列を検索する場合、いくつかの方法が用意されている。

  • indexOf
  • match
  • test
  • search

とりあえず違いを表にしてみた。他にも exec とかあった気がするけど、とりあえず。

単純な文字列 正規表現 戻り値 クラス
indexOf × Integer (マッチしたインデックス) String
match Integer (マッチしたインデックス) String
test Bool RegExp
search Integer (マッチしたインデックス) String

使い分けとベンチマーク

まずはそれぞれの検索スピードのベンチマークを資料として。

JavaScriptで文字列の有無判定方法の速度ベンチマーク(indexOf、match、test)

ちなみに上記の表で「単純検索」で△が多いのは、正規表現を使って単純検索するとかならできるから・・・みたいな感じです。

次にそれぞれの使い分け方をざっくり書いておく。


20180613

Xcode の Interface Builder で UIView(とその継承クラス)の角丸を設定できるようにする

最近 Swift やってます。すごく楽しいです。

さて。

Interface Builder・・・って今は呼ぶのかわからないけど、そこで設定できない UI の制御用のコードを viewDidLoad とかにいっぱい書くのが嫌になって調べたら、@IBInspectable というのを使うといろいろできることがわかったのでメモ。

extension UIView {
  @IBInspectable
  var cornerRadius: CGFloat {
    get {
      return self.layer.cornerRadius
    }
    set(radius) {
      self.layer.cornerRadius = radius
    }
  }
}

今回のサンプルは UIView の角丸設定を追加してみた。


20180606

Chrome の拡張機能 Markdown Preview Plus を入れてみた

社内の文書は多くが markdown で書かれています。画像が必要なら Adobe XD である程度作って、それを画像に書き出してmd文書に貼り付けたり、スクリーンショットを加工してmd文書に貼り付けたりしています。

markdown で管理している大きな理由

最大の理由は、markdown は基本はテキストなので git での管理との相性もいいこと。Excel とか git で管理すると複数人が同時に同じドキュメントを編集してると悲惨なことになるし・・・。

あとは Google Docs とかもいいとは思うんですが、あれだとファイル一式をパッと誰かに渡すことができませんね。ファイルを見るためにはアカウントを発行したり共有したりと地味に手間がかかってしまう。

ここからは個人的な少しお話。

時々 markdown なんて読みづらい!って指摘されるんですが、ビューア使えば問題ないし、ビューア入れるのめんどくさい!って言われても、個人的には Excel を起動するのもめんどくさい!って、平行線をたどってしまう・・・両者の主張は決して交わることができないのかと悲しい錯覚にも陥ってしまいます。

ちなみに後でデジタル印刷物的にドキュメントを納品する際にも、markdown をすべて PDF で書き出すなどすることである程度対応することもできますね。


20180606

Rails のルーティングをリソースの階層に合わせてネストさせる

あるある系の話でよく使うのだけど、なぜかよく忘れちゃったりもするのでメモも兼ねて書いておきます。

https://HOST/users/:id/diary/:id のようなルーティングを実現したい時の話です。

コントローラは users_controller、users のネームスペースの中に users/diaries_controller があると仮定します。

resources :users do
  scope module: :users do
    resources :diaries
  end 
end

20171219

Mac の大画面での 10Years の使い方

ウェブ版の 10Years、下のスクリーンショットのような感じで最近使ってます。10Years のクリスマスロゴが見れるのは今だけです。

左側に Safari をフルスクリーンにして 10Years で長期的な目標を表示させつつ、右側には Things で今(もしくは直近で)やらなければいけないタスクを配置しています。


20171219

配列をいろいろ回してみた

配列を回す方法がいろいろありすぎて・・・遊んでみました。

まず遊ぶための配列。

array = [1, 20, 30, 50, 100]

まず無難に each してみた。

total = 0
array.each do | value |
  total += value
end

puts total

次に for でやってみた。

tatal = 0
for i in array do
  total += i
end

puts total

20171218

enum で定義したい値を再利用したり f.select なんかで使うデータを生成してみたり。

以前 kurusaki さんが書いていた記事 をもうちょっと前に進めて、enum で定義した値を元に f.select ヘルパーなんかで表示する選択肢を生成するようにしてみました。みんな安心のローカライズ対応済みです。

ちなみにステータスはマスタ的に使えるように単体のクラスとして書いて、再利用できるようにしてみました。


20171211

Hot, Simple and Deep.

タイトルにした「Hot, Simple and Deep.」、この一言だけで気づいた方は Apple マニアでもガジェットマニアでもなく、立派な Steve Jobs マニアです。ホットでシンプルだけどディープなウェブサイトの構築アイデアを記しておきます。


20171207

Apple TV にやっと Amazon プライムビデオがきた

6月の WWDC の時に Tim Cook が声高らかにアナウンスしていた「年内に Apple TV で Amazon プライムビデオが見えるようになるよ!」ってお話。ようやっと昨日だったかに見れるようになりました。


20171206

What's a computer? で考える iPhone と iPad しか持っていないお友達

最近、プライベートな友達で iPhone と iPad は持っているけどパソコンは持っていないという具合な人がやたらと増えています。Apple の最新CMでも "What's a computer?" ってのが出ましたね。

この社会の流れ(と呼ぶにはいささか大げさだけど)は我々の業界、そういった端末で使うサービスやアプリを作っている人間にとっては数年前までと違う考え方やアプローチを考えさせられたりと、大きな影響があるわけです。


20171204

アトトックのサトウさん的 iPad の使い方(1)

技術ネタは結構社内の他のメンバーが書いてくれることが多いのもあるので、あまりゴテゴテに技術なネタじゃない話なんかを書いてみようと心がけています。そんなわけで今回は iPad をどうやって生活の中で使っているかという話。


20171128

20年間 Emacs だった人が急に Atom に引っ越してみた - その1

アトトックのサトウです。

コーポレートサイトのリニューアル後、短めの記事が続いていたのでたまには長めの記事を書いてみます。ただし長くなりすぎそうなので何回かにわけてお送りしようかと思います。

序章

思えば中学生の頃から Meadow(当時の Emacs の Win32 版)のお世話になって、時々 vim に浮気しつつも、20年くらいに渡ってエディタはほぼほぼ Emacs。おかげさまでバッドノウハウも腐る程たまりました。しかも Mac にスイッチした高校生頃からは GUI 版じゃなくてターミナルの中で使っていたので(フォントを手軽に Courier にしたいってだけの理由だったはず、特にマルチバイト混在環境の GUI 版 Emacs なんかは行の高さを設定したりが面倒)、本当に文字コード周りのバッドノウハウは掃いて捨てるほどにいろいろと。特に昔の Mac OS X のターミナルは日本語文字コード周りに大量の問題を抱えていたので。今思い出しました。懐かしいですね。

さて、時は2017年、21世紀の最初の四半世紀もとっくに半分以上終わりました。

なのに1970年代のテキストエディタを使っているのは・・・ということで Atom に乗り換えてみようかなと、とある週末に突然思いつきました。


20171127

jQuery プラグインを定義してみる

jQuery は重いけど嫌いじゃないです。

重い重いって言われながら、もう何年にもわたって第一線にいるわけでは、jQuery からの依存を100%断つことはなかなか難しい。逆にどっかで jQuery が何かしらの形で使われていれば、Yet Another な部分でも jQuery 使っておいた方がいい気もします・・・なんて独白はおいておきまして。とりあえず、Rails + Bootstrap でウェブなアプリを作れば意図的に外さない限り jQuery は使うことになりますし。

一応、jQuery プラグインの最低限の仕組みだけ理解しておきましょう。

jQuery.fn.NameOfPlugin = function() {
    this.change( function () {
      console.log($(this).val());
    })
};

NameOfPlugin 部分がプラグインの名前になります。

上のコードを $(input[type=text]) なDOMに適用してやると、入力されているテキストが変更された時にログを履くようになります。

  $( function () {
    $('input[type=text]').NameOfPlugin();
  });

あくまで基本的な定義の仕方ってだけのサンプルなので、そこに意味は求めないでください。


20171120

Ruby で配列を freeze する話

Ruby で配列を freeze したかったら以下。

irb(main):001:0> LIST = ['001', '002', '003'].freeze
=> ["001", "002", "003"]

ただし上のコードで freeze されるのは LIST という配列オブジェクト自体で、配列の要素の値は freeze されない。


20171115

jQuery でチェックボックスの状態を取得/設定する

jQuery でチェックボックスの状態を取得したり設定したり、結構よく使うのに方法がいろいろあったりします。ただ現時点(2017年11月)での最適解はおそらく今回紹介するもの。

<input type="checkbox" name="checkbox_1" checked>
<input type="checkbox" name="checkbox_2">

チェックボックスがチェックされているかを取得する。

// 便宜的に式で評価してみる
if ( $('input[name=checkbox_1]').prop('checked') ) {
  console.log('true');
} else {
  console.log('false');
}

// 別に以下でも確認できる
console.log( $('input[name=checkbox_1]').prop('checked') );

jQuery のセレクタで書いている部分はお好きに。

次にセレクタで指定したチェックボックスにチェックを入れる。

$('input[name=checkbox_2]').prop('checked', true);

最後に同じ方法でセレクタで指定したチェックボックスのチェックを外す。

$('input[name=checkbox_2]').prop('checked', false);

このくらいはテンプレ的に覚えておくと便利です。


アトトックラボとは?

株式会社アトトック のメンバーが技術の話、デザインの話、キャラクターの話、ときどき脱線してガジェットの話やライフハックの話など好きなことを書いています。


最近の記事


タグ