자신의 object_javascript 기술을 확장하기 위해 JQuery.extend 함수를 모방하는 JS 코드

그런데 작성 과정에서 기존에 작성한 객체에 새로운 정적 메소드나 인스턴스 메소드를 추가하려면 원래의 객체 구조를 수정해야 한다는 사실을 알게 되었기 때문에 jquery의 확장 메소드를 확인해 보았는데, 당연히 확장 메소드는 jq의 하늘 절반을 지원합니다. 교리를 사용하여 자신의 객체를 확장하세요.

본론으로 들어가겠습니다.
다음 개체가 있다고 가정합니다

코드 복사 코드

var MyMath = {
//Addition
추가: function(a, b){
return a b; /Subtraction
Sub: function(a, b){
return a - b;
}
}


객체 이름은 두 가지 정적 메서드입니다. 정상적으로 호출되는 Add, Sub :

코드 복사 코드는 다음과 같습니다.

alert(MyMath.Add(3, 5)) //결과 8

자, 이제 MyMath가 두 개의 정적 메서드(곱셈, 나눗셈)를 추가하고 이전에 작성된 메서드를 수정하지 않으면 어떻게 될까요? 이전에는 이 작업을 수행할 수 있었습니다.

코드 복사 코드는 다음과 같습니다. / /새 정적 메서드 추가: Mul 곱셈

MyMath[ "Mul"] = function(a, b){

return a * b
}
//새 정적 메서드 추가: Div Division
MyMath["Div"] = function(a , b){
return a / b;
}


이런 방식으로 MyMath에 두 가지 메서드를 추가합니다. 물과 사업부. 일반 통화:

코드 복사 코드는 다음과 같습니다. alert(MyMath.Add( 3, 5 )) //결과 8

alert(MyMath.Mul(3, 5)) //결과 15

그런데 방금 메소드를 추가하는 방법이 조금 서툴러요 , 메소드를 추가할 때마다 작성해야 합니다. 일회용 객체 이름(MyMath), 이전에 객체를 생성할 때 했던 것처럼 Json 구조를 통해 객체를 선언할 수 있나요?
물론 대답은 '예'입니다. JQuery.extend 함수를 시뮬레이션하면 쉽게 수행할 수 있습니다. 다음은 JQuery.extend 함수를 추출하고 함수 이름을 변경합니다.

코드 복사 코드는 다음과 같습니다. MyMath.extend = function(){

// 대상 객체에 대한 참조 복사

var target = 인수[0] ||
{}, i = 1, 길이 = 인수. length, deep = false, options;
// 전체 복사 상황 처리
if (typeof target === "boolean") {
deep = target
target = 인수[1] | |
{} ;
// 부울 및 대상 건너뛰기
i = 2
}
// 대상이 문자열인 경우 대소문자 처리(딥 카피에서 가능) 🎜>if (typeof target !== "object" && !jQuery.isFunction(target))
target = {}
// 인수가 하나만 전달되면 jQuery 자체를 확장합니다.
if (length = = i) {
target = this;
--i;
}
for (; i < length; i )
// null이 아닌 값만 처리합니다. ​
if ((options = 인수[i]) != null)
// 기본 객체 확장
for (var name in options) {
var src = target[name], copy = options[name];
// 끝없는 루프 방지
if (target === copy)
continue;
// 객체 값을 병합하는 경우 재귀 ​​
if (deep && copy && typeof copy == = "object" && !copy.nodeType)
target[name] = jQuery.extend(deep, // 원본 객체를 이동하지 말고 복제하세요
src || ( copy.length != null ? [] : {}), copy);
// 정의되지 않은 값을 가져오지 마세요. ​​
else
if (copy !== undefine)
target [name] = copy;
}
// 수정된 객체 반환
return target
}


이제 이 확장 메서드를 사용하여 메서드( 곱셈, 나눗셈):

코드 복사

코드는 다음과 같습니다. MyMath.extend( { Mul: 함수(a, b){

return a * b

},
Div: function(a, b){
return a / b;
});


이 구조는 한눈에 더 명확합니다.
재인쇄할 경우 출처를 참고하세요:

http://www.cnblogs.com/wbkt2t