2015年7月22日水曜日

食べ歩き3:万博の炒飯

食べログ
Retty




2015年6月18日木曜日

PHPまとめ1:エルビス演算子

/*━━━━━━━━━━━━━━■PHP■━━━━━━━━━━━━━━*/
○エルビス演算子
$c = $a ?: $b;

○三項演算子の場合
$c = $a ? $a : $b;


/*━━━━━━━━━━━━━━■JavaScript■━━━━━━━━━━━━━━*/
c = a || b;

・補足
JavaScriptでは、論理演算子&& ||の比較対象としてBoolean以外の値を指定した場合、その値をBooleanに変換せず返します。
よってJavaScriptでは論理演算子||をエルビス演算子の代わりとして用いることが出来ます。

論理演算子&& ||がBoolean以外の値を返すのはJavaScriptに限った話ではありません。
他のプログラミング言語でもこのような実装になっている言語が存在します。
よってこの記事で紹介したテクニック(と呼べるほどの事かは疑問ですが)はJavaScript以外の言語でも利用できます。


/*━━━━━━━━━━━━━━■PHP7で2項演算子「??」が新設■━━━━━━━━━━━━━━*/

オペランドがnull以外の値であればその値を、そうでなければ右オペランドを返す
var_dump(null ?? false ?? true); // false

これはPHP 5.3で導入されたエルビス演算子「?:」と少し似ています。
エルビス演算子は真偽の判断
??演算子はnullかどうかの判断を行う点が異なる

var_dump(null ?: false ?: true); // true

それだけでなく、??演算子はisset()と同様に未定義値をチェックしてもエラーになりません。
これは非常に大きな違いで、??演算子があれば今までのisset()地獄から解放されるかもしれません。

var_dump($arr["foo"] ?: "bar"); // 未定義だとUndefined variableかUndefined indexで怒られちゃう
var_dump(isset($arr["foo"]) ? $arr["foo"] : "bar"); // 結局こう書いてたよね…
var_dump($arr["foo"] ?? "bar"); // PHP7ではこれで動く!

PHP7調査(11)??演算子の新設
JavaScriptではエルビス演算子を論理演算子で代用できる
エルビス演算子でスマートに変数を初期化

2015年5月11日月曜日

jQueryまとめ3:deffered

$.when(
    ajax1(),
    ajax2(),
    ajax3()
)
.done(function() {
    afterAjax();
});


function ajax1()
{
    var dfd = $.Deferred();
    $.ajax({
        type     : '',
        url      : '/',
        dataType : 'html'
    })
    .done(function(re){
        dfd.resolve();
    })
    .fail(function(){
        dfd.reject();
    });
    return dfd.promise();
}

結局jQuery.Deferredの何が嬉しいのか分からない、という人向けの小話 

  爆速でわかるjQuery.Deferred超入門

なぜ、今、jQuery deferred?
 
$.Deferred で楽しい非同期ライフを送る

2015年5月8日金曜日

2015年4月21日火曜日

jQueryまとめ1:ポップアップ以外をクリックしたら、ポップアップを閉じる

○コード
$(document).click(function(event) { // (1)
    if (!$.contains($("#popup")[0], event.target)) { // (2)
        $("#popup").hide();
    }
});


○解説
ポイントは、$.contains( container, contained )
このメソッドは、DOM要素containerがDOM要素containedを 内包していたらtrueを返します。
ちなみに、containerとcontainedはjQueryオブジェクトではなくて、
DOM要素なので気をつけて!


では、コードの解説。
上述のコード(1)では、すべてのクリックイベントを捕捉しないといけないので、 document要素に対してハンドラをバインドします。

コード(2)では、$.contains()の第1引数にポップアップ要素であるDOM要素を指定してます。 $("#popup")はjQueryオブジェクトなので、$("#popup")[0]とすることでDOM要素を取得してます。
そして第2引数には、イベントオブジェクトeventのプロパティで、イベント発生源のDOM要素が格納されている event.targetを指定します。
さらに$.contains()の前に"否定"を意味するビックリマーク!をつけます。
ということでここでは、ポップアップ要素の中にクリックイベント発生源の要素が存在しなかったら、 つまりポップアップの外側でクリックされたらtrueを返すということになり、
このときポップアップを非表示にするという処理が実行されます。
参考
http://s3pw.com/milestoner/2013/06/jquery-tips-for-closing-popup/