programing

"$(.ready(handler)"가 권장되지 않는 이유는 무엇입니까?

javamemo 2023. 10. 2. 10:47
반응형

"$(.ready(handler)"가 권장되지 않는 이유는 무엇입니까?

jQuery API 문서 사이트에서 다음을 위해ready

다음 세 가지 구문은 모두 동일합니다.

  • $(document).준비 완료(handler)
  • $(.ready(handler)(권장되지 않음)
  • $(handler)

숙제를 하고 난 후 - 읽기와 소스코드를 가지고 놀고 난 후, 나는 왜 그런지 모르겠어요.

$().ready(handler) 

권장되지 않습니다. 번째 세 방법은 세 하고, jQuery에서 준비합니다를된합니다.document:

rootjQuery = jQuery(document);
...
...

// HANDLE: $(function)
// Shortcut for document ready
} else if ( jQuery.isFunction( selector ) ) {
    return rootjQuery.ready( selector );
}

함수는 .ready소스 코드:

ready: function( fn ) {
    // Attach the listeners
    jQuery.bindReady();
        // Add the callback
    readyList.add( fn );
        return this;
},

입니다()에합니다.readyList 및 세트의 요소를 변경하거나 사용하지 않습니다.이것은 당신이 전화할 수 있게 해줍니다.ready모든 jQuery 개체에서 작동합니다.

좋아요:

  • 일반 선택기:$('a').ready(handler)
  • 넌센스 셀렉터:$('fdhjhjkdafdsjkjriohfjdnfj').ready(handler)
  • 정의되지 않은 선택기:$().ready(handler)

드디어...내 질문에 대해:왜 권장되지 않습니까?

jQuery 개발자 중 한 명으로부터 공식적인 답변을 받았습니다.

$().ready(fn)다 합니다.$()이었습니다.$(document) (jQuery <1.4)
그렇게$().ready(fn)읽을 수 있는 코드였어요

은 .$().mouseover()다른 모든 종류의 광기들을 말입니다.
그리고 사람들은 해야만 했습니다.$([]) 개체 jQuery를 다음과 같이 하십시오.

그래서 1.4에서 이렇게 바꿨습니다.$()빈 jQuery다를 .$().ready(fn)다를 합니다.

$().ready(fn)말 그대로 레거시 케이스에 적합하게 작동하기 위해 코어에 패치를 적용한 것입니다.

에 .ready는 ㅇ$.ready(fn), 하지만 그것은 정말 오래된 디자인 결정이고 그것이 우리가 지금 가지고 있는 것입니다.


저는 그에게 물었습니다.

$(fn)이 $(.ready(fn))보다 더 읽기 쉽다고 생각하십니까?!

그의 대답은 다음과 같습니다.

저는 항상 $(문서)를 합니다.실제 앱에는 ready(fn)가 있으며, 일반적으로 앱에는 문서 준비 블록이 하나밖에 없습니다. 이는 유지보수와 같은 것은 아닙니다.

$(fn)도 꽤 읽을 수 없는 것 같습니다. 이는 단지 당신이 알아야입니다...

다른 옵션들은 여러분이 지적한 것과 거의 같은 일을 하기 때문에, 도서관 작가의 모자를 쓰고 추측을 해 볼 때입니다.

  1. 은 jQuery를 입니다.$() 사용 능 이후후 미심쩍음)$().ready하는 것으로 됩니다의 시킬 수 있습니다.입니다.$특별한 경우).

  2. 훨씬 더 실용적인 이유: 두 번째 버전은 포장이 끝나지 않는 유일한 버전입니다.document때.예:

    // BEFORE
    $(document).ready(foo);
    
    // AFTER: works
    $(document).ready(foo).on("click", "a", function() {});
    

    이 값을 대비합니다.

    // BEFORE
    $().ready(foo);
    
    // AFTER: breaks
    $().ready(foo).on("click", "a", function() {});
    
  3. 내용: readyjQuery 객체가 무엇을 감싸든 동일하게 작동하는 방법(여기 있는 경우와 같이 아무것도 감싸지 않더라도)이라는 점에서 괴짜입니다.이것은 다른 jQuery 방법의 의미론과 큰 차이점이므로, 특히 이것에 의존하는 것은 당연히 권장되지 않습니다.

    업데이트 : Esailija의 코멘트가 지적한 것처럼, 공학적인 관점에서ready이렇게 작동하기 때문에 정말 정적인 방법이어야 합니다.

업데이트 #2: 출처를 파보니 1.4 지점의 어느 시점에 있는 것 같습니다.$()일치하도록 변경되었습니다.$([]), 1.3에 있는 동안은 그렇게 행동했습니다.$(document) 이러한 변경은 위와 같은 정당성을 강화할 것입니다.

저는 이 단순히 이라는 .$() 개체를 반환하는 반면$(document)다가 .ready()다른 것들에도 적용됩니다. 여전히 효과는 있지만 직관적이지는 않다고 생각합니다.

$(document).ready(function(){}).prop("title") // the title
$().ready(function(){}).prop("title")  //null - no backing document

이며, 이며, 입니다를 한 단점인 되어야 합니다.$().ready(handler)가독성 때문입니다.그럼요, 다음과 같이 주장하세요.$(handler)읽을 수 없는 것과 마찬가지입니다.동의합니다, 그래서 써요.

한 방법이 다른 방법보다 빠르다고 주장할 수도 있습니다.그러나 이 방법을 한 페이지에서 연속으로 충분히 자주 호출하여 차이를 알 수 있습니까?

궁극적으로는 개인의 선호도에 달려있습니다.다를 은 없습니다.$().ready(handler)가독성 인수 이외에.저는 이 경우 문서가 오해의 소지가 있다고 생각합니다.

세 중 몇이 있다는 저는 네 되는 형태인 , 했습니다를 (function($) {}(jQuery));

이 마크업을 통해:

<div >one</div>
<div>two</div>
<div id='t'/>

그리고 이 코드:

var howmanyEmpty = $().ready().find('*').length;
var howmanyHandler = $(function() {}).find('*').length;
var howmanyDoc = $(document).ready().find('*').length;
var howmanyPassed = (function($) { return $('*').length; }(jQuery));
var howmanyYuck = (function($) {}(jQuery));
var howmanyYuckType = (typeof howmanyYuck);

$(document).ready(function() {
    $('#t').text(howmanyEmpty + ":" + howmanyHandler + ":" 
        + howmanyDoc + ":" + howmanyPassed + ":" + howmanyYuckType);
});

마지막 문장의 div 결과는 0:9:9:9:9:undefined 입니다.

따라서 Handler 및 Doc 버전만 문서 선택기를 얻을 때 사용할 수 있는 것을 반환하고 Passed 양식을 사용하면 반환해야 한다는 jQuery 규칙을 준수합니다(이렇게 하지는 않을 것으로 생각하지만 "내부에" 무언가가 있다는 것을 보여주기 위해 입력합니다).

여기 궁금한 사람들을 위한 바이올린 버전이 있습니다: http://jsfiddle.net/az85G/

저는 이것이 다른 무엇보다 가독성을 위한 것이라고 생각합니다.

이건 표현력이 별로 없어요.

$().ready(handler);

~하듯이

$(document).ready(handler)

아마도 그들은 관용적인 jQuery의 어떤 형태를 홍보하려고 노력하고 있을 것입니다.

언급URL : https://stackoverflow.com/questions/10753306/why-readyhandler-is-not-recommended

반응형