Tag: student question

JavaScript Specifics for the “Where do I go from here?” Question

This article is a continuation of the “Where do I go from here?” article with a focus on JavaScript (this is a frequent question I get from the students in my ‘Beginning Programming with JavaScript’ class ). If you haven’t read the previously mentioned article – you should do that first since it sets up the context for what I’m going to say here.

The usual disclaimer applies. This is going to be an evolving post because everything changes in software all of the time. Feel free to contact me with any questions, suggestions, and feedback.

Assuming that you are pursuing project focused learning here are some JavaScript related ideas/approaches.

The ‘no-frills’ project iteration

I suggest that your first iteration of the project use the JavaScript concepts that you just learned. This means using the JavaScript that you know right now. This no-frills iterations will help you understand the essence of your project.

You can continue with plain old JavaScript and an expansion of the ToDo project that we started in class. Or you can choose your own project. As you can tell based on my other article I’m a big proponent of choosing your own project – something that scratches your own (software) itch.

The ‘I must pursue the latest and greatest’ JavaScript ____ \ ____

Many feel that the pace of change in JavaScript (more specifically – the frameworks and approaches to JavaScript) is a never-ending race. It can feel like you’re Charlie Brown, the football is the current must-use/best/must-have JavaScript related technology, and Lucie is that ‘other’ developer who surfs on the bleeding edge with full understanding and a new Medium article about the best framework/approach/’awesomeness’ that you are not using:

This sort of view is known as “JavaScript Fatigue”, and it connects with the two views of JavaScript. The first is that “JavaScript is great!” and the second is that “JavaScript is a mess!” (the State of JavaScript Survey shows this quite nicely on its front page).

The long and short of it is that there is no magic bullet in terms of programming language, frameworks, and technologies. What’s popular today may be gone tomorrow. JavaScript has gotten large enough that you can pick something and specialize in it.

So pick whatever piques your interest. And if you don’t want to pick, then pick a project that interests you and start coding it in plain JavaScript.

There’s a great Theodore Roosevelt quote that applies to decision making:

“In any moment of decision, the best thing you can do is the right thing. The next best thing is the wrong thing. The worst thing you can do is nothing.”

What about bootcamps?

Programming bootcamps are a huge topic that is beyond the scope of this post. Some minimal suggestions:

  1. Figure out if you are the type of personality that would work well in a bootcamp (are you the type that jumps into a cold pool of water or do you slowy wade in?).

  2. They tend to be a large commitment in terms of both cost and time.

  3. Do your research very very carefully since there are lots of questionable ones out there.

  4. If you are seriously considering a bootcamp, you should try your hand with a free one called Free Code Camp. See how well you can commit to daily and weekly work.

I know of 2 students who went to bootcamps for a career change. They completed the bootcamps successfully and did the career change that they wanted. They also found out that the grass wasn’t greener on the other side. One thing about both of these individuals is that they were driven and would have succeeded even if they didn’t go through a bootcamp. In their case the bootcamps accelerated a trajectory that they were already on.

Additional resources

Conclusion

The JavaScript universe is huge. It’s a big mess of awesome. I think Steve Jobs said it best:

stay hungry, stay foolish

Thoughts? Feedback? Let me know: @eli4d

Student Question – JavaScript Array Usage and How to Accidentally Use it as an Associative Array

Overview

In this article, I cover a question that I got from one my students in a JavaScript course that I teach at Stanford Continuing Studies. Monkey patching lies at the core of JavaScript’s DNA and this question/answer is fundamentally about the positive and negative sides of monkey patching.

The Question

The question that came up was regarding JavaScript’s Array object. It is important to remember that the ancestor of the Array is the Object and that JavaScript only has five primitive data types and one complex data type (i.e. object type).

Question phrased by student

The question that came in from the Lab 6 instructions for my class.

Question phrased by student

Clarification of Question – Does debugger show what student is claiming?

The debugger confirms the student’s question. Notice:

(1) We are indeed dealing with an Array

(2) But the length of the array is 0

(3) And yet it contains two items – “w1”, and “w2”

The student question is entirely valid – how can we have an array with 0 elements that has two elements in it (i.e. “w1” and “w2”)?

So Array is acting like an associative array not a typical array data structure.

Clarification of Question - Does debugger show what student is claiming?

Clarification of question – lab section

The question is about the use of the Array (by virtue of [] initialization). Then the use of the Element id

Clarification of question - lab section

Answer

Let’s verify – is the Element’s ID a string?

According to MDN, it is. And indeed for this code “w1” and “w2” are the element’s ID.

Let's verify - is the Element's ID a string?

So what’s going on – part 1

Let’s re-look at MDN’s Array documentation (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array).

(I highly recommend reading the whole **description). Initially, there is usage information, and then there is the description part which includes a very interesting beginning (the “Arrays are **list-like objects“). Notice the “Some people think…” part. It refers to this article: http://andrewdupont.net/2006/05/18/javascript-associative-arrays-considered-harmful/ (well worth a read too).

So what's going on - part 1

So what’s going on – part 2

Here is my description of what’s going on: so we are creating a variable that’s going to reference an Array object. The Array object is a descendent of the JavaScript Object (granddaddy of all objects in JavaScript). So this means that we can add properties to the Array object by using [ ]. In effect, we’re monkey patching the Array object to act as a regular Object (since it really is an Object).

So what’s going on – part 3 – simple code example

Let’s simplify this issue through some simple test code. Notice:

  • We’re creating an Array object
  • We’re calling it with the dot notation – just like we would access any property on an object.

So what's going on - part 3 - simple code example

So what’s going on – part 3 – simple code example

The result is that the Array itself is empty (i.e. there are no index based elements). But the Array object has been monkey patched to have the string1 and string2 properties.

So what's going on - part 3 - simple code example

So what’s going on – part 3 – simple code example

Debugger confirms the behavior experienced by the student. There’s an empty array that contains new properties within it.

So what's going on - part 3 - simple code example

Lastly…

Should I have used an Array for the lab exercise? Probably not. It would have been better if I had used a plain JavaScript object. This was a neat (and hopefully instructive) catch by one of my students.

Conclusion

My hope is that this article has been useful to learners of JavaScript (besides my students). Sometimes JavaScript feels like you’re running around with a magic wand and sometimes it feels like you’re running around with scissors. Both feelings are the result of JavaScript’s DNA: monkey patching.