제이쿼리(jQuery) - 제어(확장)

확장

$.noop() <jQuery.noop()> : 비어있는 함수 (function(){})

$.noConflict() <jQuery.Conflict()> : 다른 JavaScript 라이브러리와 함께 사용할때 $의 충돌을 막기위해 사용

$.sub() <jQuery.sub()> : 새로운 jQuery 함수를 정의할때, 네임스페이스의 충돌로 다른 개발자의 함수에 영향을 주지 않도록 캡슐화된 플러그인을 만들고자 할때 $.sub() 로 복사하여 사용

(function(){
  var sub$ = jQuery.sub();
  sub$.fn.myCustomMethod = function(){
  ⠀⠀⠀return 'just for me';
  };
  sub$(document).ready(function(){
    sub$('body').myCustomMethod()
    ▶ 'just for me'
  });
})();
 
typeof jQuery('body').myCustomMethod
▶ undefined

 

$.extend() <jQuery.extend()> : 첫번째 인자에서 두번째 인자를 병합하며, 확장한다.
(1) 두번째 인자값이 첫번째 인자값의 같은 옵션을 대체하며 확장

var object1 = { apple : 0, banana : {weight : 52, price : 100}, cherry : 97 };
var object2 = { banana : {price : 200}, durian : 100 };
$.extend(object1, object2);
결과 : object1 = { apple: 0, banana: { price: 200 }, cherry: 97, durian: 100 };

 

(2) 첫번째 인자값의 원본 값을 유지하며 병합

var object1 = { apple: 0, banana: {weight: 52, price: 100}, cherry: 97};
var object2 = { banana: {price: 200}, durian: 100};
$.extend(true, object1, object2
결과 : object1 == { apple: 0, banana: { weight: 52, price: 200 }, cherry: 97, durian: 100 }

(3) 요소에 적용할 명령어 확장

$.fn.extend({
	myMethod : function(){...}
});
▶ $("div").myMethod();

▶ $("div").myMethod();

 

(4) 함수 실행 JQuery 명령어 확장

$.extend({
	myMethod2 : function(){...}
});
▶ $.myMethod();