✅ – Pink Hat – 00-54 Feb 15

in this code

this.pattern = [
    {
        method: new Function(`console.log(1)`),
        bulletDelay: 1000    
    } ,{
        method: new Function(`console.log(2)`),
        bulletDelay: 1000
        
    } ,{
        method: new Function(`console.log(3)`),
        bulletDelay: 1000
        
    }  
]

for (this.i in this.pattern) {

    setTimeout(()=>this.pattern[this.i].method(), function (i){
        this.z = 0;
        for (this.j = i-1; this.j >=0; this.j--) {
            try {
            this.z += this.pattern[this.j]?.bulletDelay
            } catch (error) {
                console.error(error)
            } finally {
                continue
            }
        }
        console.log(i)
        return this.z
        
    }(this.i))
    console.log(this.pattern[this.i])
    
}

this.pattern = [
    {
        method: new Function(`console.log(1)`),
        bulletDelay: 1000    
    } ,{
        method: new Function(`console.log(2)`),
        bulletDelay: 1000
        
    } ,{
        method: new Function(`console.log(3)`),
        bulletDelay: 1000
        
    }  
]

for (this.i in this.pattern) {

    setTimeout(()=>this.pattern[this.i].method(), function (i){
        this.z = 0;
        for (this.j = i-1; this.j >=0; this.j--) {
            try {
            this.z += this.pattern[this.j]?.bulletDelay
            } catch (error) {
                console.error(error)
            } finally {
                continue
            }
        }
        console.log(i)
        return this.z
        
    }(this.i))
    console.log(this.pattern[this.i])
    
}

why does this.pattern[2] get printed 3 times?

> 0
> {bulletDelay: 1000, method: ƒ}
> 1
> {bulletDelay: 1000, method: ƒ}
> 2
> {bulletDelay: 1000, method: ƒ}
> undefined
> 3
> 3
> 3

> 0
> {bulletDelay: 1000, method: ƒ}
> 1
> {bulletDelay: 1000, method: ƒ}
> 2
> {bulletDelay: 1000, method: ƒ}
> undefined
> 3
> 3
> 3

When it should be printing

> 0
> {bulletDelay: 1000, method: ƒ}
> 1
> {bulletDelay: 1000, method: ƒ}
> 2
> {bulletDelay: 1000, method: ƒ}
> undefined
> 1
> 2
> 3

> 0
> {bulletDelay: 1000, method: ƒ}
> 1
> {bulletDelay: 1000, method: ƒ}
> 2
> {bulletDelay: 1000, method: ƒ}
> undefined
> 1
> 2
> 3

46 Replies

ScriptyChris•2y ago

Try caching this.j as a local variable

Pink Hat•2y ago

caching it?

ScriptyChris•2y ago

Yes, similarly as you do with i regarding this.i

Pink Hat•2y ago

like this?

for (this.i in this.pattern) {

    setTimeout(()=>this.pattern[this.i].method(), function (i, j){
        this.z = 0;
        for (j >=0; j--) {
            try {
            this.z += this.pattern[j]?.bulletDelay
            } catch (error) {
                console.error(error)
            } finally {
                continue
            }
        }
        console.log(i)
        return this.z
        
    }(this.i, 0))
    console.log(this.pattern[this.i])
    
}

for (this.i in this.pattern) {

    setTimeout(()=>this.pattern[this.i].method(), function (i, j){
        this.z = 0;
        for (j >=0; j--) {
            try {
            this.z += this.pattern[j]?.bulletDelay
            } catch (error) {
                console.error(error)
            } finally {
                continue
            }
        }
        console.log(i)
        return this.z
        
    }(this.i, 0))
    console.log(this.pattern[this.i])
    
}

ScriptyChris•2y ago

}(this.i, 0)) -> }(this.i, this.j))

Pink Hat•2y ago

nothing still the same result

ScriptyChris•2y ago

Can you add labels to console.log so it's more readable, which log refers to what value?

Pink Hat•2y ago

sure

ScriptyChris•2y ago

console.log('i:', i)

console.log('this.pattern[this.i]:',this.pattern[this.i])

console.log('i:', i)

console.log('this.pattern[this.i]:',this.pattern[this.i])

And show output

Pink Hat•2y ago

ScriptyChris•2y ago

Where's that "3" log coming from? Add it label too

Pink Hat•2y ago

the 3 is the label it was originally this

Pink Hat•2y ago

Pink Hat•2y ago

then so I could run it in chrome

this.pattern = [
    {
        method: new Function(`console.log(1)`),
        bulletDelay: 1000    
    } ,{
        method: new Function(`console.log(2)`),
        bulletDelay: 1000
        
    } ,{
        method: new Function(`console.log(3)`),
        bulletDelay: 1000
        
    }  
]

this.pattern = [
    {
        method: new Function(`console.log(1)`),
        bulletDelay: 1000    
    } ,{
        method: new Function(`console.log(2)`),
        bulletDelay: 1000
        
    } ,{
        method: new Function(`console.log(3)`),
        bulletDelay: 1000
        
    }  
]

Its a result of this.pattern[2] being run 3 times I think it's happening because this.i is already fully changed before the setTimeout occurs

ScriptyChris•2y ago

Can you add counters to pattern too?

this.pattern = [
    {
        method: new Function(`console.log(1)`),
        bulletDelay: 1000    ,
        counter: 1,
    } ,{
        method: new Function(`console.log(2)`),
        bulletDelay: 1000,
      counter: 2, 
    } ,{
        method: new Function(`console.log(3)`),
        bulletDelay: 1000,
      counter: 3,
    }  
]

this.pattern = [
    {
        method: new Function(`console.log(1)`),
        bulletDelay: 1000    ,
        counter: 1,
    } ,{
        method: new Function(`console.log(2)`),
        bulletDelay: 1000,
      counter: 2, 
    } ,{
        method: new Function(`console.log(3)`),
        bulletDelay: 1000,
      counter: 3,
    }  
]

Show the console output - i suppose each pattern will have counter: 3 Yes You could await timeout call

Pink Hat•2y ago

in the for function?

ScriptyChris•2y ago

for (this.i in this.pattern) {

    await new Promise(resolve => setTimeout(()=>this.pattern[this.i].method(), function (i, j){
      // stuff

      // `return this.z` becomes
      resolve(this.z)
    }(this.i, 0))
    console.log(this.pattern[this.i])   
}

for (this.i in this.pattern) {

    await new Promise(resolve => setTimeout(()=>this.pattern[this.i].method(), function (i, j){
      // stuff

      // `return this.z` becomes
      resolve(this.z)
    }(this.i, 0))
    console.log(this.pattern[this.i])   
}

Pink Hat•2y ago

would that work?

ScriptyChris•2y ago

It should

Pink Hat•2y ago

ok. I'll try it

ScriptyChris•2y ago

If this for..in is inside a function, then you have to make it async If it's in top-level scope, then your script should work as a module, otherwise await won't work, and you have to .then() the promise

Pink Hat•2y ago

and inside the .then you would put what exactly? because it seems the await doesnt have anything referencing it

ScriptyChris•2y ago

Your console.log

Pink Hat•2y ago

ok.

ScriptyChris•2y ago

What do you mean?

Pink Hat•2y ago

nvm that so

Pink Hat•2y ago

Pink Hat•2y ago

now it's worse it doesnt even wait the time it needs to

ScriptyChris•2y ago

No, you have to wrap console.log inside a function, which you pass to .then() https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/then#using_the_then_method .then(), same as setTimeout() or Promise() expects a function to be passed, which is then called inside

Pink Hat•2y ago

huh? what do u mean by this im confused as hell

ScriptyChris•2y ago

Read example in the docs

ScriptyChris•2y ago

Passing a function

ScriptyChris•2y ago

.then((value) => console.log( /* stuff */ ))

Pink Hat•2y ago

I want the promise to pass after a certain time. if I do

new Promise(resolve).then(() => console.log(/* stuff */)

new Promise(resolve).then(() => console.log(/* stuff */)

then what does that do

ScriptyChris•2y ago

What resolve is there? I already wrote you example with promisified setTimeout above ..ok, try this - i think i misread your code (2:30am on my side)

    await new Promise(
      (resolve) => {
        setTimeout(
          () => {
            this.pattern[this.i].method();
            resolve();
          }, 
          function (i, j){
            // stuff

            return this.z;
          }(this.i, 0)
        )
      }
    )
    console.log(this.pattern[this.i])

    await new Promise(
      (resolve) => {
        setTimeout(
          () => {
            this.pattern[this.i].method();
            resolve();
          }, 
          function (i, j){
            // stuff

            return this.z;
          }(this.i, 0)
        )
      }
    )
    console.log(this.pattern[this.i])

Pink Hat•2y ago

threw this error (after I fixed some of the syntax cus it was complaining

ScriptyChris•2y ago

Lacking closing curly brace

ScriptyChris•2y ago

Add } there

ScriptyChris•2y ago

And the console.log('what') is incorrectly place there Just copy-paste this ☝️

ScriptyChris•2y ago

Works for me on dry-run

Pink Hat•2y ago

it works

ScriptyChris•2y ago

👍

Pink Hat•2y ago

I found a piece of code that works (slightly waltered from yours)

this.pattern = [
    {
        method: new Function('console.log("Counter: 1")'),
        bulletDelay: 1000    
    } ,{
        method: new Function('console.log("Counter: 2")'),
        bulletDelay: 1000
        
    } ,{
        method: new Function('console.log("Counter: 3")'),
        bulletDelay: 1000
        
    }  
]

for (this.i in this.pattern) {
    await new Promise(
      (resolve) => {
        setTimeout(
          () => {
            this.pattern[this.i].method();
            resolve();
          }, 
          function (i, j){
            // stuff

            return this.z;
          }(this.i, 0)
    )
    console.log(this.pattern[this.i]) 
});
}

this.pattern = [
    {
        method: new Function('console.log("Counter: 1")'),
        bulletDelay: 1000    
    } ,{
        method: new Function('console.log("Counter: 2")'),
        bulletDelay: 1000
        
    } ,{
        method: new Function('console.log("Counter: 3")'),
        bulletDelay: 1000
        
    }  
]

for (this.i in this.pattern) {
    await new Promise(
      (resolve) => {
        setTimeout(
          () => {
            this.pattern[this.i].method();
            resolve();
          }, 
          function (i, j){
            // stuff

            return this.z;
          }(this.i, 0)
    )
    console.log(this.pattern[this.i]) 
});
}

and now we can close this. thanks for the help @ScriptyChris #thanks

ScriptyChris•2y ago

You may react to helpful answer with ✅ to mark thread as solved

reactibot•2y ago

This question has an answer! Thank you for helping 😄 If you have a followup question, you may want to reply to this thread so other members know they're related. https://discord.com/channels/102860784329052160/565213527673929729/1075218422025158786

reactibot•2y ago

This thread hasn’t had any activity in 12 hours, so it’s now locked. Threads are closed automatically after 12 hours. If you have a followup question, you may want to reply to this thread so other members know they're related. https://discord.com/channels/102860784329052160/565213527673929729/1075218422025158786 Question not getting answered? Maybe it's hard to answer, or maybe you asked at a slow time. Check out these resources for help asking a good question: https://stackoverflow.com/help/how-to-ask http://wp.me/p2oIwo-26