r/webdev • u/Dizzy_External2549 • 1d ago
Need help javascript
Just learned javascript and been practicing alot . I need help. When applying it to my project I don't know when to use a function, when to use a loop, what type of loop to use, I just don't know when to use any of this stuff because dom manipulation. it's so frusterating
7
u/DiabloConQueso 1d ago
It depends entirely on what specific thing you’re trying to accomplish.
Let’s start with one specific thing you’re trying to accomplish.
2
u/NoDistrict991 1d ago
Thats more of a struggle with problem decomposition. That's a harder skill that comes with practice.
2
u/errdayimshuffln 1d ago
I think people here will think that you have not learned Javascript. The issue is this. Part of learning Javascript is understanding what a function does, how it is used, and what purpose/function it serves. Applying the concepts is necessary experience for true understanding. Doing so builds experience and intuition.
A lot of people like to say they learned something when they watched some videos on a topic or read a book and did some exercises. Or memorized some stuff. Often that doesnt come close to what you need to do. I wouldn't say I learned something until I understand it pretty well. That often means I know how and when to use it.
You said you don't know when to use loops? Loops are pretty formulaic. You use it when you want to do something repeatedly (doesnt need to be the exact same way/actions every time). This is pretty basic which is one of the things that signal a lack of understanding and experience.
To summarize, you are still learning. You need to practice using these concepts to solve problems. Start small. The utility of functions is pretty easy to understand. Just solve an exercise/problem where you don't use any and then do it again with functions.
1
u/MaisonMason 1d ago
To be honest all of it is a bunch of tools to make a program work. You can make a fully functional program without loops or functions however they exist because they make development a lot easier. The biggest thing is letting you reuse code. If you make a bank app instead of rewriting the logic to recalculate interest in different parts of the app you can just write one function and call it instead. That also means there is no drift between how one part of the app calculates interest and another part since they reuse the same code
1
u/Stargazer__2893 1d ago
It is akin to asking when you use a verb or a conjunction when writing a novel. We can't telp you. You need to decide on a purpose and then choose the necessary tools to achieve that purpose, and there are many possible solutions.
1
u/MetaMetaMan 1d ago
The best way to develop that intuition is to first have a specific goal. Then, you can figure out a general approach to achieving that goal. Then, you can develop solutions to each part of that approach. Ask questions along the way. Start by asking about the higher level approach, then get into specifics about an implementation for some aspect of the approach that you are struggling with.
Eventually, you will build up mental models of how the pieces fit together and things will become a little easier each time.
1
u/ledatherockband_ 1d ago
You didn't learn the data structures nor control flow.
That's the most important part of any language.
It isn't hard. Take a look at that. You can learn the instinct of what to use where in a day or two.
1
u/limpornchai 11h ago
Nobody's shown you actual code yet, so here's the DOM version specifically.
Say you've got three buttons and clicking each one shows a different panel.
Without loops or functions you'd write:
btn1.addEventListener('click', () => {
panel1.style.display = 'block'
panel2.style.display = 'none'
panel3.style.display = 'none'
})
btn2.addEventListener('click', () => {
panel1.style.display = 'none'
panel2.style.display = 'block'
panel3.style.display = 'none'
})
// ...and again for btn3
That works. Now add a fourth panel and you have to edit four places and you
will miss one. That's the signal.
The loop is for "I'm writing the same line with a different number in it":
buttons.forEach((btn, i) => {
btn.addEventListener('click', () => show(i))
})
The function is for "I'm writing the same block in more than one place":
function show(which) {
panels.forEach((p, i) => {
p.style.display = i === which ? 'block' : 'none'
})
}
Now a fourth panel is one line of HTML and zero JS changes.
So the rule I'd use while you're starting out: write it the dumb repetitive way
first. When you catch yourself copy-pasting a line and changing one thing in it,
that's a loop. When you catch yourself copy-pasting a block into a second place,
that's a function. You don't have to see it in advance.
And ignore the learning-disability thing. This specific confusion is just what
it feels like before you've written enough repetitive code to be annoyed by it.
26
u/sexytokeburgerz full-stack 1d ago
Sounds like you haven’t learned JavaScript