Make jQuery collections for-of-able #1693

Closed
simevidas opened this Issue Oct 10, 2014 · 14 comments

Comments

Projects
None yet
7 participants
@simevidas

Chrome 38 added support for ES6 for-of. I'm proposing that jQuery collections are made compatible with this statement, which can be achieved with this line (from discussion on Twitter):

jQuery.prototype[Symbol.iterator] = Array.prototype.values;

Live demo: http://jsbin.com/movuxu/1/edit (view in Chrome)

@dmethvin

This comment has been minimized.

Show comment
Hide comment
@dmethvin

dmethvin Oct 10, 2014

Member

Isn't it a bit early to be doing this inside jQuery itself? If its just a line, the person using it knows whether their environment is going to be ES6 only. We don't know that.

Member

dmethvin commented Oct 10, 2014

Isn't it a bit early to be doing this inside jQuery itself? If its just a line, the person using it knows whether their environment is going to be ES6 only. We don't know that.

@simevidas

This comment has been minimized.

Show comment
Hide comment
@simevidas

simevidas Oct 10, 2014

Yes, probably too early :) Just wanted to get general feedback.

Yes, probably too early :) Just wanted to get general feedback.

@dmethvin

This comment has been minimized.

Show comment
Hide comment
@dmethvin

dmethvin Oct 10, 2014

Member

Hard to argue with one line of code! 😸 If you're in an environment where you know it's ES6, maybe a Phonegap/Cordova app in a year or two, it could be very handy. I don't think we'll keep this ticket open for that amount of time though?

Member

dmethvin commented Oct 10, 2014

Hard to argue with one line of code! 😸 If you're in an environment where you know it's ES6, maybe a Phonegap/Cordova app in a year or two, it could be very handy. I don't think we'll keep this ticket open for that amount of time though?

@simevidas

This comment has been minimized.

Show comment
Hide comment

Agree

@simevidas simevidas closed this Oct 10, 2014

@rwaldron

This comment has been minimized.

Show comment
Hide comment
@simevidas

This comment has been minimized.

Show comment
Hide comment
@simevidas

simevidas Oct 11, 2014

I'm just going to drop this screenshot here. Once ES6 code becomes more common, this syntax comparison will be useful:

woohoo

I'm just going to drop this screenshot here. Once ES6 code becomes more common, this syntax comparison will be useful:

woohoo

@sophiebits

This comment has been minimized.

Show comment
Hide comment
@sophiebits

sophiebits May 19, 2015

I'd love to see this. Would make using jQuery with Babel more palatable.

I'd love to see this. Would make using jQuery with Babel more palatable.

@timmywil

This comment has been minimized.

Show comment
Hide comment
@timmywil

timmywil May 19, 2015

Member

You know, I'm not actually against this.

Member

timmywil commented May 19, 2015

You know, I'm not actually against this.

@mgol

This comment has been minimized.

Show comment
Hide comment
@mgol

mgol May 19, 2015

Member

It'd be cool to have this natively in 3.0; even if simple. :)

Member

mgol commented May 19, 2015

It'd be cool to have this natively in 3.0; even if simple. :)

@mgol

This comment has been minimized.

Show comment
Hide comment
@mgol

mgol May 19, 2015

Member

The biggest problem is size, I guess. The following:

if ( typeof Symbol !== "undefined" && Symbol.iterator ) {
    jQuery.fn[Symbol.iterator] = [][Symbol.iterator];
}

increases the gzipped size by 32 bytes. Other forms seem larger.

Member

mgol commented May 19, 2015

The biggest problem is size, I guess. The following:

if ( typeof Symbol !== "undefined" && Symbol.iterator ) {
    jQuery.fn[Symbol.iterator] = [][Symbol.iterator];
}

increases the gzipped size by 32 bytes. Other forms seem larger.

@mgol

This comment has been minimized.

Show comment
Hide comment
@mgol

mgol May 19, 2015

Member

Since there is no definite decision yet, let's reopen for now.

Member

mgol commented May 19, 2015

Since there is no definite decision yet, let's reopen for now.

@mgol mgol reopened this May 19, 2015

@jrencz

This comment has been minimized.

Show comment
Hide comment
@jrencz

jrencz May 19, 2015

The concept has already been described by @jakearchibald in Dec 2004 for NodeList: http://jakearchibald.com/2014/iterators-gonna-iterate/#nodelist-iteration

jrencz commented May 19, 2015

The concept has already been described by @jakearchibald in Dec 2004 for NodeList: http://jakearchibald.com/2014/iterators-gonna-iterate/#nodelist-iteration

@timmywil timmywil added this to the 3.0.0 milestone Jun 1, 2015

@mgol mgol self-assigned this Jun 1, 2015

@mgol

This comment has been minimized.

Show comment
Hide comment
@mgol

mgol Jun 1, 2015

Member

We've decided we're going to do it in 3.0.0. I'm taking it.

Member

mgol commented Jun 1, 2015

We've decided we're going to do it in 3.0.0. I'm taking it.

mgol added a commit to mgol/jquery that referenced this issue Jun 1, 2015

Core: Make jQuery objects iterable
Make iterating over jQuery objects possible using ES 2015 for-of:

    for ( node of $( "<div id=narwhal>" ) ) {
        console.log( node.id ); // "narwhal"
    }

Fixes gh-1693

@mgol mgol referenced this issue Jun 1, 2015

Merged

Core: Make jQuery objects iterable #2369

7 of 7 tasks complete
@mgol

This comment has been minimized.

Show comment
Hide comment
@mgol

mgol Jun 1, 2015

Member

PR: #2369

Member

mgol commented Jun 1, 2015

PR: #2369

mgol added a commit to mgol/jquery that referenced this issue Jun 4, 2015

Core: Make jQuery objects iterable
Make iterating over jQuery objects possible using ES 2015 for-of:

    for ( node of $( "<div id=narwhal>" ) ) {
        console.log( node.id ); // "narwhal"
    }

Fixes gh-1693

mgol added a commit to mgol/jquery that referenced this issue Jun 4, 2015

Core: Make jQuery objects iterable
Make iterating over jQuery objects possible using ES 2015 for-of:

    for ( node of $( "<div id=narwhal>" ) ) {
        console.log( node.id ); // "narwhal"
    }

Fixes gh-1693

mgol added a commit to mgol/jquery that referenced this issue Jun 4, 2015

Core: Make jQuery objects iterable
Make iterating over jQuery objects possible using ES 2015 for-of:

    for ( node of $( "<div id=narwhal>" ) ) {
        console.log( node.id ); // "narwhal"
    }

Fixes gh-1693

mgol added a commit to mgol/jquery that referenced this issue Jun 13, 2015

Core: Make jQuery objects iterable
Make iterating over jQuery objects possible using ES 2015 for-of:

    for ( node of $( "<div id=narwhal>" ) ) {
        console.log( node.id ); // "narwhal"
    }

Fixes gh-1693

@mgol mgol closed this in #2369 Jun 13, 2015

mgol added a commit that referenced this issue Jun 13, 2015

Core: Make jQuery objects iterable
Make iterating over jQuery objects possible using ES 2015 for-of:

    for ( node of $( "<div id=narwhal>" ) ) {
        console.log( node.id ); // "narwhal"
    }

(partially cherry-picked from bb026fc)

Fixes gh-1693

mgol added a commit that referenced this issue Nov 10, 2015

Core: Make jQuery objects iterable
Make iterating over jQuery objects possible using ES 2015 for-of:

    for ( node of $( "<div id=narwhal>" ) ) {
        console.log( node.id ); // "narwhal"
    }

Fixes gh-1693

@dmethvin dmethvin modified the milestones: 1.12/2.2, 3.0.0 Jan 7, 2016

@cssmagic cssmagic referenced this issue in cssmagic/ChangeLog May 18, 2016

Open

jQuery #5

@jquery jquery locked as resolved and limited conversation to collaborators Jun 19, 2018

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.