jQuery 3.1.0-1 での変更箇所の自分なりのまとめ

今さらですが歯抜けがあると気持ち悪いので、 jQuery 3.1.0, 3.1.1 のリリースノートを読んで、 自分なりにまとめました。

document-ready ハンドラのデバッグがしやすくなる改良の他に、 細かい不具合の修正がいくつか施されていました。 箇条書きを含めた簡単なまとめになります。

誤訳による間違いなどもあると思われますので、 読まれる際はご注意を。

jQuery 3.1.0

jQuery 3.0.0 でjQuery Deferred が Promises/A+ 互換となりましたが、 その結果、.then()のコールバックで発生したエラーは内側で捕捉され reject 側の(または.catch()の)ハンドラにreject の値として 渡されるようになりました。

$.ajax("/status")
   .then(function(data) {
      whoops();
      // コンソールに "jQuery.Deferred exception: whoops is not a function"
      // と表示され、この関数の以降のコードは実行されない
   })
   .catch(function(arg) {
      // 上のエラーの後にこのコードが実行される
      // arg は Error オブジェクト、"whoops is not a function"
   });

これには、 Promise のハンドラがランタイムエラーによって遮断されることを防ぐ利点が ありましたが、 reject ハンドラを登録(または.catch()を使用)しない限り エラーに気付きにくくなりました。

上の改良に伴いjQuery.readyjQuery.fn.readyも新しい Deferred を 使うようになりました。 このため、 ある document-ready ハンドラでの例外やエラーが 他の document-ready ハンドラ群の実行を妨げるようなことは無くなる という利点がありましたが、例えば ready ハンドラを 推奨される方法(jQuery( function(){ ... } );)で登録する場合、 ready ハンドラがエラーを起こしても内部で捕捉され表にでてこなくなりました (コンソールにメッセージも表示されない)。 さらに reject ハンドラの登録方法も無かったそうです。

jQuery( function(){
  throw new Error("error"); // → 沈黙。エラーが発生したことに気付けない
});

そんなわけで 3.1.0 では ready ハンドラで発生したエラーが表にでるように なりました。

jQuery( function(){
  throw new Error("error"); // → エラーが非同期的に再throwされる
                            //    エラーが window.onerror に渡されたり
                            //    コンソールにエラーがログされたりする
});

jQuery.readyException

さらにjQuery.readyExceptionというフックが追加されました。 これは ready ハンドラにエラーが発生すると同期的に実行されます。

これを上書きすることで ready ハンドラで発生したエラーの処理を自前で 書くこともできます。 デフォルトはエラーを非同期的に再throwするだけです (上の例の振る舞いはこの中に書かれています)。

jQuery.readyException = function( error ) {
  window.setTimeout( function() {
    throw error;
  } );
};

slim ビルド

ajax と effect(アニメーション) モジュール、現在廃止予定なコードを除外した slim ビルド版を出すようになりました。 3.0.0 以降のバージョンに用意されています。 gzip後で約6kバイト容量が軽くなっていて、CDN でも利用できます。

ajax や アニメーションを使わない人や、 ajax 等には他のライブラリを使いたい人などは こちらの使用を検討してもよいかもしれません。

jQuery 3.1.1

いくつかのバグや不具合が修正されています。

  • disabled な option でのセレクタの問題を sizzle に修正を加えることで なんとかしたようですが、ここら辺の挙動はブラウザ間(特にIE)で挙動が 違うので、disabled が標準に妥当な要素以外の要素で disabled プロパティ等を 使うのは避けてほしいそうです。
  • jQuery CDN(Microsoft CDNもかな?)の .map ファイルが、 違う jQuery のファイルを参照していたのを修正。
  • cache: falseを指定したjQuery.ajax()でパラメータ_を持つ URL (例: url: 'example.com?_=1&foo=bar')が 正しく処理されない問題を修正(しかし、まだ修正しきれていない報告あり)。
  • .not()に文字列でセレクタを指定した場合、 元のjQueryオブジェクトに含まれるテキストノードやコメントノードは常に フィルタリングされ削除されます(例えセレクタにマッチするノードが無くとも)。

    一方、.not()にノードやノードの配列(含jQuery オブジェクト)を渡した場合、 テキストノードやコメントノードは渡したノードとマッチしない限り フィルタリングされず、元の jQuery オブジェクトから削除されません。

    jQuery 3.1.0 では(3.0.0から)、.not()にノードやノードの配列を渡すと、 テキストノードやコメントノードがマッチしなくてもフィルタリングされて 削除されていましたので、これが修正されました。

  • HTMLの仕様が定義する空白に合わせるべきところをそのように修正しました。 (例えば、class属性の値を複数の値に分割する空白文字。 HTML空白文字以外の文字の正規表現をを/\S+/gから /[^\x20\t\r\n\f]+/gにする)
  • AMD(Asynchronous Module Definition)で jQuery が読み込まれたときでも jQuery.noConflictを expose するようにしたそうです。

スポンサードリンク