コア機能（2）
追加機能
1. for...ofループが利用可能に
ES2015（2015年に公開された次世代のJavaScript言語仕様）で導入されたfor...ofループが、jQueryのコレクションでも使えるようになりました。
var elems = $("li");
// 従来の記述方法
elems.each( function( i, elem ){
console.log( $(elem).text() );
});
// ES2015の記述方法
for (let elem of elems) {
console.log( $(elem).text());
}
2. $.readyが正式にPromiseオブジェクトとして利用可能に
従来より、$.readyは、非同期処理の仕様であるPromiseに準じた振る舞いになっていましたが、正式にPromiseオブジェクトとして利用可能になり、$.whenメソッドや、JavaScriptのPromise.resolve()でも利用できるようになりました。
// whenメソッドでの例
$.when( $.ready, $.getJSON("test.json") ).then(function() {
// ready状態で、test.jsonが読み込めたら
console.log("ready");
}).catch( function() { // エラーの場合
console.log("error");
});
非推奨
1. jQuery.uniqueメソッドの名称がuniqueSortに変更
動作がわかりやすいように名称が変更されました。名称のみで処理内容は変わりません。
2. $.parseJSONメソッドの非推奨
jQuery 3.0がサポートするブラウザでは、JavaScriptのJSON.parseメソッドをサポートしているため、$.parseJSONは非推奨になりました。
3. document-readyハンドラの$(function)以外の非推奨
document-readyハンドラの書き方には、次のようにいくつかありましたが、jQuery 3.0では、$(fn);という記法が推奨されるようになりました。
- $(fn);
- $().ready(fn);
- $(document).ready(fn);
- $("selector").ready(fn);
要素のプロパティ
要素のプロパティを取得するAPIにも、破壊的な変更が2点あります。
1. .width、 .height、.css("width")、.css("height")が整数以外も返すようになった
従来これらのメソッドは、DONのoffsetWidth、 offsetHeight.widthプロパティを参照して整数値のみが返されていましたが、jQuery 3.0ではDOMのgetBoundingClientRect APIを利用して、小数値を返すようになりました。
2. windowのouterWidth、.outerHeightの値にスクロールバーの幅、高さが含まれるようになった
$(window).widthメソッドの値には、スクロールバーの幅を含みませんが、$(window).outerWidthはスクロールバーの幅が含まれるようになりました。この値は、DOMのwindow.innerWidthと同じです。$(window).outerHeightも同様です。
まとめ
今回は、 正式にリリースされたjQery 3.0についての概要とコア機能まわりの変更点を紹介しました。次回は、Ajax、Deferred機能などを中心に紹介する予定です。
