I'm curious as to why the for-of loop within the function isn't producing the anticipated results that the regular for loop is achieving

Question

I'm curious as to why the for-of loop within the function isn't producing the anticipated results that the regular for loop is achieving

Why is the behavior of the for...of loop different from the traditional for loop within this function? It appears that the 'el' in the for...of loop does not behave the same as iterable[i] in the regular for loop?

var uniqueInOrder = function(iterable){
     let unique = [];
     for(let el of iterable){
         let cur = el;
         let next = el + 1;
         if(cur !== next){
             unique.push(cur)
         }
     }
     return unique;
}
uniqueInOrder('AAAABBBCCDAABBB')  // unexpected output

// Returns expected output
var uniqueInOrder = function(iterable){
     let unique = [];
     for(var i = 0; i < iterable.length; i++){
         let cur = iterable[i];
         let next = iterable[i + 1];
         if(cur !== next){
             unique.push(cur)
         }
     }
     return unique;
}
uniqueInOrder('AAAABBBCCDAABBB') // ----> ["A", "B", "C", "D", "A", "B"]

javascript for-loop for-of-loop

Answer 1

Answer №1

The error lies within your initial function.

It's important to note that in JavaScript, the use of element in for (let element of iterable) {} is distinct from using i in a traditional for loop. Therefore, when you write let next = el +, you are essentially adding 1 to an element, not a number (resulting in something like 'A' + 1, as @Seblor pointed out).

To summarize, remember that el and i are not interchangeable.

Answer 2

The error lies within your initial function.

It's important to note that in JavaScript, the use of element in for (let element of iterable) {} is distinct from using i in a traditional for loop. Therefore, when you write let next = el +, you are essentially adding 1 to an element, not a number (resulting in something like 'A' + 1, as @Seblor pointed out).

To summarize, remember that el and i are not interchangeable.

Answer 3

Answer №2

As mentioned by @Sxribe, the for/of loop behaves differently and using el+1 to fetch the next value won't work.

An alternative approach to achieve the same outcome with both loops is as follows:

const uniqueInOrder = function(iterable){
     let unique = [];
     let prev = ''
     for(let el of iterable){
         let cur = el;
         if(cur !== prev){
            prev = el
             unique.push(prev)
         }
     }
     return unique;
}
console.log(uniqueInOrder('AAAABBBCCDAABBB'))

// Outputs the expected result
const uniqueInOrder = function(iterable){
     let unique = [];
     for(var i = 0; i < iterable.length; i++){
         let cur = iterable[i];
         let next = iterable[i + 1];
         if(cur !== next){
             unique.push(cur)
         }
     }
     return unique;
}
console.log(uniqueInOrder('AAAABBBCCDAABBB'))

In this scenario, we compare the current value against the previous one instead of the next one.

Answer 4

As mentioned by @Sxribe, the for/of loop behaves differently and using el+1 to fetch the next value won't work.

An alternative approach to achieve the same outcome with both loops is as follows:

const uniqueInOrder = function(iterable){
     let unique = [];
     let prev = ''
     for(let el of iterable){
         let cur = el;
         if(cur !== prev){
            prev = el
             unique.push(prev)
         }
     }
     return unique;
}
console.log(uniqueInOrder('AAAABBBCCDAABBB'))

// Outputs the expected result
const uniqueInOrder = function(iterable){
     let unique = [];
     for(var i = 0; i < iterable.length; i++){
         let cur = iterable[i];
         let next = iterable[i + 1];
         if(cur !== next){
             unique.push(cur)
         }
     }
     return unique;
}
console.log(uniqueInOrder('AAAABBBCCDAABBB'))

In this scenario, we compare the current value against the previous one instead of the next one.

Answer 5

Answer №3

According to @Sxribe's explanation, you should focus on obtaining the element rather than the count of i.

To achieve this, you must verify if the el exists in the array and then add it to the array if it doesn't already exist. An implementation similar to the following could accomplish this:

function findUniqueElements(iterable) {
    let uniqueElements = [];
    for (let el of iterable) {
        let currentElement = el;
        if (uniqueElements.indexOf(el) === -1) {
            uniqueElements.push(currentElement);
        }
    }
    return uniqueElements;
}

console.log(findUniqueElements('AAAABBBCCDAABBB'));

Answer 6

According to @Sxribe's explanation, you should focus on obtaining the element rather than the count of i.

To achieve this, you must verify if the el exists in the array and then add it to the array if it doesn't already exist. An implementation similar to the following could accomplish this:

function findUniqueElements(iterable) {
    let uniqueElements = [];
    for (let el of iterable) {
        let currentElement = el;
        if (uniqueElements.indexOf(el) === -1) {
            uniqueElements.push(currentElement);
        }
    }
    return uniqueElements;
}

console.log(findUniqueElements('AAAABBBCCDAABBB'));

I'm curious as to why the for-of loop within the function isn't producing the anticipated results that the regular for loop is achieving

Answer №1

Answer №2

Answer №3

Similar questions

Sending a JSONP request to a PHP script

`When utilizing $routeParams, the CSS fails to load`

express routes are failing to execute the function

Simulate a left mouse click on the swf object once the page has fully loaded

Nested loops in JavaScript can be combined with promises to efficiently handle

What is the best way to extract individual words from a string based on a specified list of tokens?

Animating numerous elements simultaneously during Vue component rendering

Retrieve the values of the recently selected options in a multiple selection

Float over a specific line in a drawing

Italian calendar conversion for the react-multi-date-picker library

The error message "Create controller with service — Get... is not a function" indicates that

Is it possible to insert a second hyperlink into a JavaScript-occupied anchor?

Obtaining the route name in Vue.js within the App.vue component

Maintain the current states when returning to a previous point in time

What is the best way to update a canvas chart when the side menu is hidden?

I am seeking to redirect to a different page within an ejs template by clicking on a link

Execute a specialized function with imported modules and specified parameters

Verify if there is a cookie available; then execute the load() function. If the cookie matches, it is necessary to

Is there a way to automatically remove a document in MongoDB and Node.js once its expiration date has passed?

Encountered an unhandled runtime error: TypeError - the function destroy is not recognized