>  기사  >  웹 프론트엔드  >  자신만의 js 클래스 library_js 객체 지향을 작성하는 데 필요한 핵심 코드

자신만의 js 클래스 library_js 객체 지향을 작성하는 데 필요한 핵심 코드

WBOY
WBOY원래의
2016-05-16 17:51:46936검색
코드 복사 코드는 다음과 같습니다.

(function(win) {
var toString = Object.prototype.toString;
var hasOwn = Object.prototype.hasOwnProperty;
var class2type = {};
class2type[ "[object Boolean]"] = "부울";
class2type["[object Number]"] = "번호"
class2type["[object String]"] = "string"; ["[object Function]"] = "함수";
class2type["[object Array]"] = "배열"
class2type["[object Date]"] = "날짜"; class2type["[object RegExp]"] = "regexp";
class2type["[object Object]"] = "object";
win.type = function(obj) {
return obj == null ? String(obj) : class2type[toString.call(obj)] || "객체";
win.isBoolean = function(obj) {
return type(obj) === "boolean";
};
win.isNumber = function(obj) {
return type(obj) === "number"
win.isString = function( obj) {
반환 유형(obj) === "문자열";
};
win.isDate = function(obj) {
반환 유형(obj) === "날짜";
};
win.isRegExp = function(obj) {
return type(obj) === "regexp"
}; win.isObject = function(obj) {
반환 유형(obj) === '객체';
};
win.isFunction = function(obj) {
return type(obj) === "function";
};
win.isArray = function(obj) {
반환 유형(obj) === "배열";
};
win.isWindow = function(obj) {
return obj
&& typeof obj === "object"
&& "setInterval" in obj;
};
win.isNumeric = function(obj) {
return !isNaN(parseFloat(obj)) && isFinite(obj);
};
win.isPlainObject = function(obj) {
if (!obj
|| type(obj) !== "object"
|| obj.nodeType
|| isWindow(obj )) {
false를 반환합니다.
}
시도 {
if (obj.constructor
&& !hasOwn.call(obj, "constructor")
&& !hasOwn.call(obj.constructor.prototype, "isPrototypeOf" )) {
false를 반환합니다.
}
} catch (e) {
false를 반환합니다.
}
var 키;
for (key in obj) {
}
return key === 정의되지 않음 || hasOwn.call(obj, key);
};
win.isEmptyObject = function(obj) {
for( var name in obj) {
return false;
}
true를 반환합니다.
};
win.isPrimitive = function(obj){
var type = typeof obj;
반환 유형 === '문자열' || 유형 === '숫자' || 유형 === '부울';
};
//HTMLElement
win.isElement = function(obj){
return obj ? obj.nodeType === 1 : 거짓;
};
//TextNode
win.isTextNode = function(obj){
return obj ? obj.nodeName === "#text" : false;
};
win.isIterable = function(obj){
return (obj && typeof obj !== 'string') ? obj.length !== 정의되지 않음 : false;
};
win.isDefined = function(obj){
obj 반환 유형 !== '정의되지 않음';
};
win.error = function(msg) {
새 오류 발생(msg);
};
win.now = function() {
return (new Date()).getTime();
};
win.print = function(값) {
document.write(값);
};
win.println = 함수(값) {
print(값);
document.write("
");
};
win.each = function(object, callback, args) {
var name, i = 0,
length = object.length,
isObj = (length === 정의되지 않음 || isFunction( 물체));
if (args) {
if (isObj) {
for (객체의 이름) {
if (callback.apply(object[name], args) === false) {
휴식;
}
}
} else {
for (; i < length;) {
if (callback.apply(object[i ], args) === false) {
휴식;
}
}
}
} else {
if (isObj) {
for (객체의 이름) {
if (callback.call(객체[이름], 이름, 개체[이름]) === false) {
break;
}
}
} else {
for (; i < length;) {
if (callback.call(object[i], i, object[i ]) == = 거짓) {
break;
}
}
}
}
반환 객체;
};
win.Array.prototype.toString = function(){
return "[" this.join() "]"
}
win.extend = function() {
var 옵션 ,
이름,
src,
copy,
copyIsArray,
clone,
target = 인수[0] || {},
i = 1,
length = 인수.길이,
deep = false;
// 딥 카피 상황 처리
if ( typeof target === "boolean" ) {
deep = target;
대상 = 인수[1] || {};
// 부울 및 대상 건너뛰기
i = 2;
}
// 대상이 문자열 등인 경우 처리(딥 카피에서 가능)
if ( typeof target !== "object" && !isFunction(target) ) {
target = {};
}
// 하나의 인수만 전달되면 jQuery 자체를 확장합니다.
if ( length === i ) {
target = this;
--i;
}
for ( ; i // null이 아닌/정의되지 않은 값만 처리
if ( (옵션 = 인수[ i ]) != null ) {
// 기본 객체 확장
for ( name in options ) {
src = target[ name ];
복사 = 옵션[ 이름 ];
// 끝이 없는 루프 방지
if ( target === copy ) {
continue;
}
// 일반 객체나 배열을 병합하는 경우 반복
if ( deep && copy && ( isPlainObject(copy) || (copyIsArray = isArray(copy)) ) ) {
if ( copyIsArray ) {
copyIsArray = false;
clone = src && isArray(src) ? src : [];
} else {
clone = src && isPlainObject(src)
}
// 원본 개체를 이동하지 말고 복제하세요.
target[ name ] = extend( deep, clone, copy )
// 정의되지 않은 값을 가져오지 마세요 ​​
} else if; ( copy !== undefine ) {
target[ name ] = copy;
}
}
}
}
// 수정된 객체 반환
return target; 🎜> };
})(window);

extend 메서드를 사용하지 않으면 다음과 같이 자체 구성 요소를 작성할 수 있습니다.

코드 복사
코드는 다음과 같습니다. (function(win){ win.StringBuffer = function(){
this.datas = [] ;
}
var proto = StringBuffer.prototype;
proto.append = function(value){
this.datas.push(value); },
proto.toString = function(){
return this.datas.join("")
}
})(window)


If 확장 메소드를 사용하면 다음과 같이 할 수 있습니다. 구성 요소 작성:



코드 복사
코드는 다음과 같습니다. (function(win){ win.extend(win,{ StringBuilder : function(){
this.datas = [];
}
}) ;
win.extend(StringBuilder.prototype, {
append : function(value){
this.datas.push(value);
},
toString : function(){
return this.datas.join("");
}
})
})(window)


두 가지 방법은 동일하지만 확장 메소드는 1장에서 설명한 것처럼 플러그인 개발과 같은 더 많은 이벤트를 수행할 수도 있습니다. 두 메소드는 매우 유사합니다.
물론 원래 jQuery 플러그인을 작성하고 싶었다면 jQuery의 확장을 사용하면 됩니다.
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.