Some tool to step throught Javascript code

Some tool to step throught Javascript code
0

#1

Hi folks.

I would like to know if there is some simple tool to go set by step in Javascript code, for example in Python IDLE you can go step by step in your code.

I want a simple tool that doesn’t need a full website in order to debug the code, for example write a for loop and go through every iteration.

thanks


#2

Since JS runs in the browser, there are a lot of great tolls built into your browser. Chrome devtools will allow you to set break point where the code will stop and you can examine the current state. You should look into it, it’s very powerful. There is a lot of stuff in there.


#3

Hello @kevinSmith; thanks for your answer.

The problem with Chrome(or Firefox, etc) devtools is that I need to load all a website. I would like something very simple, for example if I want analyze the next simple code:

for (let i = 0; i < 100; i++) {
  if (i % 2 === 0) {
    console.log(i);
  }
}

I would like a step by step review, and a simple tool or that. Like in Python Iddle


#4

I’m not sure if you want the script to wait for any input to continue or if you are concerned with accidentally coding an annoying infinite loop, but you could program a loop break:

for(let i=0;i<100;i++){
  if(i%2===0){console.log(i);}
  if(i===20){break;}
}

you could also adjust the loop counter:

for(let i=0;i<20;i++){
  if(i%2===0){console.log(i);}
}

or copy and paste your code and comment out to switch:

/*
for(let i=0;i<100;i++){
  if(i%2===0){console.log(i);}
}
*/
for(let i=0;i<20;i++){
  if(i%2===0){console.log(i);}
}

#5

No, I just want to go step by step, is something pedagogical, for example in DrRacket there is a stepper,in Python IDLE, etc.

There are something like this, so simple in Javascript ecosystem?


#6

Well, I don’t find it too much trouble to write one line html file so I can take advantage of amazing dev tools.

But here are some options.


#7

Thanks Kevin, I will try the dev tools


#8

Put this in your code and keep your dev tools open.


#9

Thanks @Gigusek.

I will take a couple hours this week to set up my debug enviroment. I have preferred all the time Firefox for ideological reasons.

Do you think the Chrome devtools are far better that the Firefox one? or the are equivalent?

I hope the answer for everybody who hast used both.


#10

In all fairness, I’ve used Chrome a lot more and that seems to the the standard (at least in the circles in which I’ve run). But there are a lot of people that love the Firefox tools too. I think they each have their strengths and weaknesses. On a basic level, they are probably pretty interchangeable.

On the “… for ideological reasons” statement, I would say that ideology has no place in this decision. (I mean, we’re not talking about Nazis here.) For example, for years I have had a light aversion to all things Mac. I worked at Intel back when they were the enemy (they used to use a competitor’s chips) and I’ve always kind of held onto that. Plus, I like to take things apart and tinker with them (literally and figuratively) and have never liked the Apple philosophy of holding your hand preventing you from just doing things the way you want and are forced to do everything their way and only if they want to let you.

But recently got a job (finally). One of the first things my manager did was hand be a new MacBook. “We use Mac here.” I smiled and said, “So do I!”

The point is that (IMHO) you should learn whatever will get you the job.

Regardless of what you think about Google, they own 60% of the browser market, which is why I guess many developer develop for Chrome by default. Firefox hovers around 5%.

I’m not saying to not use Firefox, but I think a serious developer should also be comfortable with Chrome.


#11

Really, Chrome’s web browser console is the fastest way to go.
If you wanted something like how you run python codes, or run it in a command line, you can use Node.js with bash or any choice of your command line. but really, the fastest way to see if a code works is to open up your browser, right click-inspect, go to console, type in your code, and press enter.


#12

Thanks @kevinSmith, but I disagree.

I think the Web should be open for everybody, and when something smell to monopoly that goes against what I think. Mozilla is probably the only one important organization in technology that respect that, I am not against business, and if I have to work with Chrome or Edge or Safari i will do it, but like I do with LibreOffice I will use Firefox if it do what i need, maybe the other one is better, but this is good and aligned with my values.
Of course other persons could use what they think it is best or better or more correctly.


#13

Thanks @ymoon715.

I will try it.


#14

You’re talking philosophy, I’m talking about getting hired.


#15

Of course. You coldn’t say better.

If I get a job and I have to use Chrome, I will do it, I have not problems with that.


#16

Most people spend ~1/3 or more of their lives working, so I’d say ideology has a huge place when it comes to making decisions about your career.

Obviously, while not every little thing you do has the same impact, the little things are exactly how big corporations got to where they are - by convincing billions of people to “follow their lead” more and more every year. Work or not, if you can do those little things better than the default, try and do that. Still, in the end it’s up to you to decide who you should or shouldn’t be supporting.

Chrome’s market share is about ~65% and Firefox’s is ~10%. Considering Google also controls about 90% of internet searches and they’re promoting their browser in search results, it’s not a bad result IMO.


#17

But it’s a matter of degrees. Google isn’t lining up people and sending them to gas chambers. Sure, there are cases where I will take a stand against a company because I think some injustice is being done. I just had to explain to an Arkansan fellow employee why I won’t eat at a certain chicken place that is extremely popular in this part of the country. They are (IMHO) donating to causes that aim to increase discrimination and deny basic human rights to people I love, friends and family. But that is very different - I believe actual human rights are being violated.

Their “crime” is that the people at Google are extremely good at what they do. Their “crime” was that they saw that the other search engines weren’t doing a good enough job. In essence, mediocrity and apathy had a monopoly and Google busted it wide open. What are they supposed to do? Lower the quality of their product so their competitors can catch up? This is the world of business, not “everyone gets a participation medal and you’re all winners”.

Whenever a company starts to do very well, people climb over each other to denounce it. It’s very predictable. As a culture, I suspect we’ve come to define ourselves by what we’re against instead of what we’re for, or even what we do. For some, it’s become a fashion statement.

Whether or not it’s a monopoly is a question of law and politics. If you want the Justice department to go after them, then call your congressperson.

And again, I’M NOT SAYING NOT TO USE FIREFOX! You can use whatever you want when you’re searching for cat videos. You can even refuse to use Chrome for personal use, if you want. I’m saying that as a serious developer, you need to be familiar with the quirks of Chrome and it is best to make sure your layouts are optimized for Chrome, because it is the overwhelming majority of users out there, including potential employers.

Go ahead and use Firefox. Do what you want. But if you want to be good at what you do, you need to check your product against the dominant browser - Chrome. And being familiar with the most popular dev tools out there, the ones that your future employer is most likely using - that wouldn’t hurt either.


#18

I will use Firefox in order to learn web development, If I have a work or I have to develop some app for Chrome users (the majority of internet users) of course I have to test for Chrome.

This is not the subject, so is better to finish here.

Thanks all for their answers.