>  기사  >  웹 프론트엔드  >  JavaScript는 적용 및 인수 재사용 방법_javascript 기술을 사용합니다.

JavaScript는 적용 및 인수 재사용 방법_javascript 기술을 사용합니다.

WBOY
WBOY원래의
2016-05-16 17:12:301075검색

우선, 많은 정적 도구 메서드가 연결된 싱글톤 개체가 있습니다. 그 중 하나는 배열이나 객체를 순회하는 데 사용되는 각각입니다.

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

var NativeForEach = [].forEach
var NativeMap = [].map
var util = {
각각: 함수(obj, iterator, context) {
if (obj == null) return
if (nativeForEach && obj.forEach === NativeForEach) {
                                                                                                                                                                        ) {
                           ~                    k in obj) {
              if (iterator.call(obj[k] || context, obj[k], k, obj) === true) 반품
                                                                                                                 
map: function(obj, iterator, context) {
var results = []
if (obj == null) return results
if (nativeMap && obj.map == = NativeMap) 반환 obj.map(반복자, 컨텍스트)                                                                                         ~               )
       결과 반환
    }
}




컬렉션(배열, 해시)에 대해 작동하는 Every, Some 등과 같은 유틸리티 함수도 있습니다. 사용시에는 util.xx 메소드를 사용하세요.

컬렉션 클래스가 정의되면 이 클래스 내부에 컬렉션 데이터가 있습니다.


코드 복사

코드는 다음과 같습니다.

function Collection(data) {

this.data = data || [] // 다른 속성 // this.xxx = yyy } Collection.prototype = { // 메서드 }




과 같이 util의 메소드를 컬렉션 클래스에 쉽게 복사할 수 있습니다.



코드 복사

코드는 다음과 같습니다.

function copyMethod(clazz, obj) {

for (obj의 var 메소드) { clazz.prototype[method] = function() { var args = [].slice.call(arguments) var target = this.data args.unshift(대상) obj[method].apply(obj, args) }
}
}
copyMethod(Collection, util)




이렇게 복사하면 Collection 인스턴스는 util에 메소드를 가지게 되며, util이 운용하는 컬렉션 객체(첫 번째 매개변수)는 Collection의 this.data가 됩니다. 다음과 같이 this.data를 직접 탐색할 수 있습니다.




코드 복사

코드는 다음과 같습니다.

var coll = new Collection([10, 20, 30 ])

var arr = coll.map(function(k) {
return k - 5
})
console.log(arr) // 5, 15, 25


이 모드는 $.each/$.map이 $().each/$().map에 편리하게 복사되는 jQuery와 같은 많은 오픈 소스 라이브러리에서 사용됩니다.

또 다른 예는 _.each/_.map/_.every/_.chain(및 더 많은 것)이 컬렉션 프로토타입에 복사되는 Backbone입니다.

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

// 구현하려는 밑줄 메서드
// Backbone Collections의 핵심 유용성의 90%는 실제로
// 바로 여기에서 구현됩니다:
var method = ['forEach', 'each', 'map', 'collect ', 'reduce', 'foldl',
'inject', 'reduceRight', 'foldr', 'find', 'Detect', 'filter', 'select',
'reject', 'every ', '모두', '일부', '모든', '포함', '포함', '호출',
'최대', '최소', 'toArray', '크기', '첫 번째', ' head', 'take', 'initial', 'rest',
'tail', 'drop', 'last', 'without', 'difference', 'indexOf', 'shuffle',
' lastIndexOf', 'isEmpty', 'chain'];

// `Collection#models`에 대한 프록시로 각 Underscore 메소드를 혼합합니다.
_.each(methods, function(method) {
컬렉션 .prototype[method] = function() {
var args = Slice.call(arguments);
args.unshift(this.models)
return _[method].apply(_ , 인수) ;
})

또한 _.keys / _.values ​​​​/ _.pairs / _.invert / _.pick과 같은 객체 작업을 위한 실용적인 메서드가 Backbone.Model에 복사되었습니다(1.0의 새로운 기능)

코드 복사 코드는 다음과 같습니다.
var modelMethods = ['keys', ' value', 'pairs', 'invert', 'pick', 'omit'];

// `Model#attributes`에 대한 프록시로 각 Underscore 메소드를 혼합합니다. modelMethods, function(메서드) {
Model.prototype[method] = function() {
var args = Slice.call(arguments);
args.unshift(this.attributes)
return _[메서드 ].apply(_, args)

});

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.