$.fn.extendと$.extendの違いメモ。
$.fn.extendと$.extendの違い
タイトルの通り、$.fn.extendはインスタンスメソッドの追加、$.extendはクラスメソッドの追加を行う点が違う。
# インスタンスメソッドの追加
$.fn.extend({
instance_method: function(){
console.log('hey')
}
});
$('div').instance_method();
# クラスメソッドの追加
$.extend({
class_method: function(){
console.log('hey')
}
});
$.class_method()
$.extendはもっと単純にオブジェクトのプロパティを引き継ぐ目的で使われることも多く、jQueryプラグインではこういう書き方をよく見かける。
function do_something(options){
var default = {
name: 'abc'
};
var options = $.extend(defaults, options);
console.log(options);
}
# 123と表示される
do_something({name: '123'});
jQueryオブジェクトにインスタンスメソッドを追加するだけなら、$.fn.extendを使わずに$.fnに直接メソッドを追加することもよくある。
# インスタンスメソッドの追加
$.fn.instance_method = function(){
console.log('hey');
};
参考リンク
jQuery.extendとjQuery.fn.extendとプロトタイプチェイン
