链式jQuery对象在什么条件下提供性能提升？

Question

我正在使用一些代码来添加和删除同一对象上的各种CSS类.代码看起来像:

function switch_states(object_to_change) {
  if(object_to_change.hasClass('ready') {
    object_to_change.removeClass('ready');
    object_to_change.addClass('not_ready');
  } else {
    object_to_change.removeClass('not_ready');
    object_to_change.addClass('ready');
  }
}

我怀疑我可能会把这两个snippits链接成类似的object_to_change.removeClass('ready').addClass('not_ready');但是我不得不怀疑:除了易读性和neato因素之外,这是否会给我带来任何性能提升？

我的问题:链式对象是否比两个非链式对象更快地完成工作？如果是这样,为什么？如果不是,在什么时候使用链式对象变得比不同的对象更有效 - 即在链式jQuery对象在什么条件下提供性能提升？

Answer 1

链式对象是否会比两个非链式对象更快地完成工作？如果是这样,为什么？

链接对象从选择器开始时更快,并且链接防止选择器多次针对DOM运行(相对昂贵的操作).

慢点:

$(".myClass").val(123);
$(".myClass").addClass("newClass");

快点:

$(".myClass")
    .val(123)
    .addClass("newClass");

在变量中缓存选择器与链接具有相同的好处(即防止昂贵的DOM查找):

var $selctor = $(".myClass");
$selector.val(123);
$selector.addClass("newClass");