将 jQuery every 替换为 for

发布于 2024-08-03 01:02:36 字数 448 浏览 5 评论 0原文

我已经使用 $.each 进行迭代有一段时间了，但我不断听到人们说使用原生 JS 进行循环。我非常关心性能，但我不确定是否总是可以以有意义的方式用 for 替换 $.each 。

所以我的问题是，是否可以始终用 for 替换 $.each ，如果不能，那么什么时候可以完成、什么时候不能完成的经验法则是什么。

我有一个这样的：

 $this.find("div.class").each(function (){
  var $thisparent = $(this).parent();

  if (condition) {          
   $(this).prepend($thisparent.text());
  }

  if (condition2) {          
   $(this).prepend($thisparent.text());
  }

 });

原文

I've been using $.each to do iterations for a while now, but I keep on hearing people say to use native JS for to do loops. I'm very concerned about performance but I am not sure if it's always possible to replace $.each with for in a meaningful way.

So my questions are, is it possible to always replace $.each with for, and if not what's the rule of thumb for when it can be done and when it cannot.

I have an each like this:

 $this.find("div.class").each(function (){
  var $thisparent = $(this).parent();

  if (condition) {          
   $(this).prepend($thisparent.text());
  }

  if (condition2) {          
   $(this).prepend($thisparent.text());
  }

 });

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

信仰 2024-08-10 01:02:36

这就是 jQuery 对 .each 所做的事情，基本上：

$.fn.each = function(callback) {
    var i, length = this.length;
    for(i = 0; i < length; ++i) {
        callback.call(this[i]);
    }
};

因此用 callback.call 调用替换匿名函数的“内容”并不难。请务必将 this 替换为 jQuery 对象的临时值。

转换您提供的代码：

var foo = $this.find("div.class"),
    fooLength = foo.length,
    i,
    $thisparent;

for (i = 0; i < fooLength; ++i) {
    $thisparent = $(foo[i]).parent();

    if (condition) {          
        $(foo[i]).prepend($thisparent.text());
    }

    if (condition2) {          
        $(foo[i]).prepend($thisparent.text());
    }
}

为了获得额外的（潜在的）速度，请将 foo[i] 缓存到临时文件中。也一样，并且仅在需要时分配 $thisparent 。如果条件和条件2互斥，请使用单个if (条件||条件2)。

This is what jQuery does with .each, basically:

$.fn.each = function(callback) {
    var i, length = this.length;
    for(i = 0; i < length; ++i) {
        callback.call(this[i]);
    }
};

So it's not hard to substitute your anonymous function's 'contents' with the callback.call call. Just be sure to replace this with a temporary with the jQuery object.

Converting your supplied code:

var foo = $this.find("div.class"),
    fooLength = foo.length,
    i,
    $thisparent;

for (i = 0; i < fooLength; ++i) {
    $thisparent = $(foo[i]).parent();

    if (condition) {          
        $(foo[i]).prepend($thisparent.text());
    }

    if (condition2) {          
        $(foo[i]).prepend($thisparent.text());
    }
}

For additional (potential) speed, cache foo[i] into a temporary. too, and assign $thisparent only when needed. If condition and condition2 are mutually exclusive, use a single if (condition || condition2).

回复收藏 0 原文