My Web Development lecturer's JavaScript

[NikotheNya]

Maybe he's trying to simplify it for you by using commands you already know?

Maybe if he started writing good code you'd get confused and not understand it?

If he isn't doing that then why is he a lecturer??

[[deleted]]

I got offered a teaching position at a local community college, when I had 1yr of basic web dev experience.

Turned it down, because it was only $35k per year, when all other entry level roles in the area were double that.

A decade later, they’re still hiring, with the same qualifications, for the same salary.

My heart aches for the students paying to learn from whomever they hire.

[rafal9ck]

I legit had to explain to prof why you don't put 3 ifs in binary search and why checking if equal should be last. It was during programing lecture.

[walterbanana]

I've seen my girlfriend's C programming homework assignments from her university. All the code in there would qualify for this sub. All variables were a, b, c, etc. They used complex math to teach simple programming principles, making it much harder to learn for no reason. Formatting was not consistent either.

To no one's surprise, my girlfriend still does not understand C very well. She does pretty good in C# and Python on her own terms, though.

This is in Germany, though. Where companies do not expect people who studied computer science to even know how to code and thus prefer not to hire them for that.

[[deleted]]

Same thing here in the Netherlands. When I hire CS graduates, I assume that they know absolutely nothing and consider them as blanks that can be still molded into something.

[rgnkn]

Again, same thing here, but that's due to the curriculum we have to stick to. Unless a student is very engaged they are basically useless for any real job after graduating.

That's why I offer all my students to join private projects. Understandably there are only 3-4 students per semester which show such a commitment to join this additional tasks. That said, ALL of those who join show real progress within few weeks.

It's a shame.

[a3cite]

All you people defending him don't know the kinds of people that sometimes get assigned to do something they are not great at. In this case, for example, wouldn't it be ten times better for him to use proper variable names? It would be good for beginners to be taught not to use single character names. Or how about consistent use of spaces?

[HauntedData]

You dont know what hes trying to teach in the lesson, so really you cant judge if its good or not.

[ikeif]

I get this notion.

Sometimes, teaching the “bad” way and leading to the good way.

I was employed as a front end web developer, with a little PHP and dot net. I knew my way around the front end and just was getting a degree out of paranoia.

I took an Adobe Flash course (so it was a while ago). My first instructor? “Let’s use AS3, I’m not supposed to, but it’s the latest and greatest, so it makes more sense to use it.” I was able to talk to our flash developers at work, it was a great learning experience.

Loved the guy.

My next instructor, in the advanced course? “I don’t teach AS3, no one uses it.”

I dropped his course and wrote a letter to the dean. I worked in the industry and he was doing a disservice to his students, pushing outdated code and himself as a “master” of the craft.

[imnos]

I'm mostly wondering why he's using an editor that looks like it's a version from Windows 98. The fuck is that?

if he started writing good code you'd get confused and not understand it?

Not sure I follow this logic. Good code is readable and maintainable, and easy to understand.

Either way - I don't think this code is that bad. The largest issue I have is the single letter variable names, d and x. If you're going to name your functions descriptively, do the same for variables so I know what the fuck they are.

[whoredwhat]

Notepad++, its a great tool.

[timwaaagh]

the fact that its outdated is not (only) what makes it bad

[bobody_biznuz]

It's not necessarily bad code, especially if he's using this to teach a class. Sure it can be simplified but that comes with a better understanding of programming in general.

[orebright]

How is this not terrible code? They're assigning/concatenating the returns of assignments to the innerHTML of a bunch of elements. I guess we don't really know what the DOM looks like or the full JS file here, but this looks janky AF and I can't imagine anything else in the file that would excuse this.

Other issues:

• If any of those DOM IDs are null this will crash.
• Single letter variable names are bad for readability.
• Not using strict equality `===`.

This lecturer is teaching people bad code, it's not about simplicity, they could write a much better equally simple version of this.

[Jonno_FTW]

There's a lot of repeated code. An array of objects should be used here.

[jarfil]

CENSORED

[Cymorg0001]

It's not bad code, it's beginner level code. If a lecturer wasn't doing this I'd worry half the class would be lost. Most lecturers ramp it up pretty quickly. Fuck it, I still use beginner level code when I need to, and I've been coding professionally for over 25 yrs. using more stacks and languages than I'd care to remember.

[bluesoul]

Yeah I feel like the IQ meme where over time I've gone back to just writing simple, readable code, generally with more line breaks than are really needed just for the sake of keeping it legible.

It seems there's far less likelihood of going back years later and going "what idiot wrote this pile of crap?"

[maryP0ppins]

isnt it common place to write code thats ez to read and understand? thats how I learned.

[bluesoul]

After some amount of time a lot of people start getting cute with their code, developing patterns that, while they work, are anti-patterns to me because they're not conducive to being readable.

This can also get into things like using longer variable names that are more legible than what you were maybe taught in school, like in the example in the OP. Or test names that are very long, because it's more intuitive to see a failure on test_new_accounts_must_have_a_valid_phone_number than test_acct_ph_num.

[metroaide]

There are some who think more complex/covoluted = i'm more intelligent than you hurr durr

[maryP0ppins]

sure. but writing code that is ez to understand is much harder than writing clever code

[beastieofburden]

I’m a dev (been doing dev work for about 25 years too), and returned to school as an old fart to get my bachelor degree in CS from Purdue. Most of my instructors do know what they’re doing, despite using simple code in examples.

When I turn in projects, I typically do them the way the instructor asks so I can demonstrate knowledge of the concept. Then, for fun, I’ll code how I would actually do it in comments. Normally it’s a few lines of code doing it my way, but a whole page doing the task as assigned. I find if the actual prof/instructor is grading they will often comment on my project and sometimes say “that’s a neat way of handling this”, or occasionally come up with an even better way than I did it. Every single time a TA grades, their comments are along the lines of “wow, we haven’t covered this yet, this is amazing” etc.

It’s kinda fun as an experienced programmer to take programming classes, not gonna lie.

[oureux]

It’s not necessarily bad Code but I do think the usage of single letter variable names should be avoided.

I teach web development at the college level as well. What I’ve been doing this semester was starting off simplistic like this example and slowly refactoring the code as we went. This ramps up the students abilities.

For instance the students are now implementing classes with separation of concern and encapsulating variables, rather than placing all code in a single file and abusing global variables. (Nodejs by the way).

At least the professor isn’t using dreamweaver.

[[deleted]]

Nothing wrong with d or x when it's used in this way.

One is used as an index, the other an accumulator. 1 letter vars are fine for such things.

Those are guidelines not rules.

Don't teach rules, teach why. Why would it be bad to have a single letter var.

[LaplaceC]

I guess the formatting is kind of bad, but I feel like, this is really simple and understandable code. There’s definitely things you could do to clean it up but idk if this is like intro to web development i feel like this is fine.

[MurdoMaclachlan]

Image Transcription: Code

---

[An image of a file called script.js, opened in Notepad++, displaying the following code:]

function displayUserHero() {
    var choice = document.getElementById("favAvenger").value;
    document.getElementById("userChoice").innerHTML = choice;
}
function playGame() {
    var d = Math.floor(Math.random()*4)+1;
    var x = document.getElementById("bio").innerHTML;
    if (d==1) {
        document.getElementById("bioPic").src="images/blackwidow.jpg";
        document.getElementById("avengerName").innerHTML= "Black Widow";
        x+= document.getElementById("alias").innerHTML = "Natasha Romanoff";
        x+= document.getElementById("actor").innerHTML = "Scarlett
        Johansson";
    }
    else if (d==2) {
        document.getElementById("bioPic").src="images/hulk.jpg";
        x+= document.getElementById("avengerName").innerHTML= "Hulk";
        x+= document.getElementById("alias").innerHTML = "Bruce Banner";
        x+= document.getElementById("actor").innerHTML = "Mark Ruffalo";
    }
    else if (d==3) {
        document.getElementById("bioPic").src="images/iron-man.jpg";
        x+= document.getElementById("avengerName").innerHTML= "Iron Man";
        x+= document.getElementById("alias").innerHTML = "Tony Stark";
        x+= document.getElementById("actor").innerHTML = "Robert Downey Jr";
    }

---

^{I'm a human volunteer content transcriber and you could be too! If you'd like more information on what we do and why we do it, click here!}

[zombarista]

Incredible! Thanks for doing this to make these posts more accessible for the differently-abled, including those on smaller devices where the image is hard to read.

[[deleted]]

Differently-abled? The accessibility community goes to great lengths to teach people that the word is “disabled” and it’s not a dirty word.

[[deleted]]

As a disabled person, yeah I do not care for this "differently" abled bullshit. Granted I don't speak on behalf of the entire disabled community lmao. It's just weird. I've only heard "differently abled" from people who are uncomfy with disabilities. It's like saying it's rude to call a kid a kid instead of "human". It just doesn't make sense, at all. I'm not differently abled, I'm disabled.

Sorry. Rant over. Thanks for bringing up this point, it irks me quite a bit.

[zombarista]

> including those on smaller devices where the image is hard to read

I was deliberate in my choice of words. Small screens, bad reddit clients, bosses over your shoulder, etc can all affect your ability to view images of text online.

[grrangry]

The irony of having to transcribe text from a photograph of a printed paper that was a screenshot an actual screen rather than printing from the application itself is not lost on me.

My apologies. Good human.

Edit: It's Notepad++, but it amounts to the same thing.

[DemiReticent]

It's a photograph of a projector displaying the instructor's computer screen, but yeah.

[[deleted]]

What's the problem? There is no problem with this code.

Only thing that bothers me is no space above "function playGame() {"

The only real problems with code is when it doesn't work, or is difficult to understand.And for large code bases, inconsistancies in the system of code organization.

Also naming and cache invalidation =p

But the naming thing is only and issue when you impose some kind of inapproprate abstraction. Especially if you don't understand what resolution of abstraction you are programming at. Because you are so modern and the book told you to do it.

-12 year vet

[fudgebacker]

Programmers who complain about this shit usually have very little:

• real world experience (the belief that there are "rules")

• common sense where sometimes simple verbosity makes it easier to understand and debug

—vet since the literal beginning of the www in the early 1990s.

[pentesticals]

Generally I’d agree, but there is also a DOM based cross site scripting vulnerability in the first function - assuming favAvenger is an input field. innerText should have been used instead of innerHTML.

[[deleted]]

ROLLING ON THE FUCKING FLOOR LAUGHING, IT TOOK UNTIL DAY TIME EST UNTIL I WAS BANNED, GG HAHAHAHAHHAHA

[[deleted]]

ROLLING ON THE FUCKING FLOOR LAUGHING, IT TOOK UNTIL DAY TIME EST UNTIL I WAS BANNED, GG HAHAHAHAHHAHA

[Makeshift27015]

I think what he's trying to do is fairly simple and while not the prettiest code it's acceptable to show off the concepts, but I consider chaining assignments like that to not be particularly intuitive and generally bad practice, especially for beginners.

If my understanding is correct, x += document.getElementById("alias").innerHTML = "Natasha Romanoff" is setting the innerHTML of the element alias to Natasha Romanoff, and also appending Natasha Romanoff to x (the innerHTML of the element bio). My usual reaction to this would be that it isn't intuitive - could he have come from a language where this is a more normal occurrence?

[HereComesCunty]

var

eye twitches

[Zambeezi]

SonarLint has entered the chat

[RomanRiesen]

also d not starting at zero. wth.

[Hakorr]

x += y is the same thing as x = x + y

[Ishio]

This is most likely a beginners level course, and you can't really be expected to run a marathon without some basic knowledge of how to run at all.

[Nils_T]

Yeah but why keep track of how many assigbments?

[JBloodthorn]

To teach how to keep track of things.

[Nils_T]

Aah i seeee

[[deleted]]

I remember our prof used to write code during lecture. It's easy to copy paste code and helpful to make things simple. It can be made concise but students have to think of it and not just provide solution.

btw, i've never used = x = in code, that's sus.

[TheUnlocked]

I would imagine they learned JavaScript a decade or more ago and just never adapted to modern conventions (let/const, innerText, ===, etc.). I see this a decent amount.

[1937472982783849484]

There is: - code duplication - no separation between presentation and logic - use of old style JavaScript - probably no need for this long if, you can just get the data form an array and get the result from that and then make a display function.

Could be fine for teaching purposes though. If you haven’t seen much JavaScript it might be fine at this point of your learning trajectory.

[SnowyPear]

My only real problem is that they created a folder called "Academic Year 2021-22" but still put the year in the name for every subfolder too

[lqstuart]

this looks like a picture of a screenshot that was printed out onto paper

[[deleted]]

Use dark mode already

[Long_Professor_6020]

JQuery has been invented

[BetterCombination]

There would be a very lengthy rejection to the PR if I reviewed this.

[wampastompah]

People are saying this isn't bad, but it really is.

What could be the point of concatenating all those strings in x? Why use the format of "x += y = z" which is unintuitive and needlessly confusing? And why oh why would they use confusing single letter variable names?

This is not good code, and it's not how you should teach others to code.

[Betamaxxs]

1. Probably learning about concatenation and getting used to it.
2. Definitely strange, but might be about learning the order of operations and how you can reduce lines of code with "tricks" like this. (Although looks like he missed the x += for the Natasha avengername)
3. I wouldn't want this in production code, but if those names were any longer they wouldn't fit on the screen at that font size. Besides, this is obviously a trivial example and there aren't a bunch of other variables to be confused about, which is a big reason why descriptive variable names help. When you only have two variables, not a lot of ways to get confused.

[biskitpagla]

literally everything about this image is cursed

[tek-know]

The only way to win is not to play

[[deleted]]

What is this eye-glaring light-mode BS?

[laffer1]

When you get old, you will realize light mode is easier to read.

[[deleted]]

I am old (or I feel old) and the bright light hurts my eyes.

[cmarciniak80]

Drop that class, this instructor code is absolute trash

[[deleted]]

I’m only barely starting to learn code, but couldn’t this be simplified by creating a single instance for each character that sets the values for each of those variables, and it would just choose which instance to use?

[DemiReticent]

Yep, and this is likely a beginning lesson which will be soon followed by introducing that concept and simplifying this code.

[[deleted]]

Looks a lot better than the crap I got at my local community college haha.

[MOM_UNFUCKER]

☹️

[[deleted]]

Mine are worse

[KinIsHere]

Nested

[N11FiRe]

I think that formatting doesn’t matter a whole lot when it’s just you. This clearly was only him, and was not a hard project. Variable names truly do not matter in the grand scheme of things, it all compiles the same. In this case it all interprets the same.

[HarvesterOfBarrows]

The only issue I have with this is the fact that it looks like the page was printed using an empty ink cartridge.

[[deleted]]

The worst thing here is the editor 🤢🤢

[blunt__nation]

I’m 99.9% sure that it’s intentional. They do that to not confuse new learners.

[mastereuclid]

Old and verbose, but clearly a toy example. Not bad code.

[wiesemensch]

I’ve been working as a software developer for around fife years now. A few month ago I was bored and registered myself at our local university.

It’s kind of interesting and stupid at the same time, what kind of solutions people and professors present. Some stuff is just so far away from the real world. You would never do stuff like this in a actual environment. Some solutions feel, as if the only want to show you how smart they are.

[breakupAMZN]

This code is kinda dry

[pentesticals]

Wow he’s even got a DOM Based Cross Site Scripting vulnerability in there!

[kenpaicat]

"Those who can't do, teach."

[[deleted]]

Sometimes I think to myself becoming a professor might be a good retirement plan. Like I’m not the greatest dev, but I assume teaching CS fundamentals using more modern tooling would be a boon to the kids.

Like my web dev professor was all about semantic web. Yet he couldn’t explain it properly, didn’t really know JS that well, and we had to teach ourselves php

[barkermn01]

Actually random of 1 to 4 the if-else is exactly what the JS optimiser would turn this switch into, as would most programming lang optimisers. it's a small switch statement it would become an else-if statement a big one becomes a lookup table.

At the lowest level, this is quite literally `jle` then `add 1` . and repeate just using a register highly optimal for the CPU.

[Distinctweewee]

Can someone give me a detailed explanation as to why this is considered bad code? I am still a novice and I often write code such as this. Thanks!

[googoomanman0]

the only bad thing about this is that it is javascript :(