CodeNewbie Community 🌱

Cover image for From Front Desk to Front End p.39 You Don't Know JS Up&Going
Tauri StClaire
Tauri StClaire

Posted on • Updated on

From Front Desk to Front End p.39 You Don't Know JS Up&Going

Photo by Denitsa Kireva on Pexels. JS is the nest, and right now I am carefully examining every stick that goes into making my nest lol

Hi, I'm Tauri!

I am a Front End Developer and a student (and enrollment counselor) with Skillcrush, the online coding and design school with a heart! I am open for employment with a company, and working on adding to my skillset every day! This blog is chronicling my most recent projects, so thank you for reading!

I don't have my JavaScript forays from this week well documented by the day, but I've been working through the intro to my Getting into JavaScript class on Frontend Masters and reading the teacher Kyle Simpson's book series You Don't Know JavaScript starting with the first chapter on programming basics, Up&Going.

Into Programming Notes

These are notes that I've added to my already existing notes from the class and the first chapter Into Programming, organized by terms in JavaScript, so these certainly aren't comprehensive for each term (and will likely always be evolving honestly) but consist of me nuancing my definitions with only the added information collected here (copied from my notes on Obsidian, awesome Markdown based note taking app):

  • Variable - A place in the memory of our RAM that we have symbolically given a useful name to allow us to access it easily. JavaScript uses weak typing or dynamic typing means that the variables can hold any type of value, whereas programming languages that use static typing have variables meant to hold a specific type of value like a number or string
  • Values - Primitive data types express single values, non primitive are collections of values like an array or object. Both express data at particular positions. Objects you assign a "key" or name for each position of the data. Arrays are a type of object 0-indexed for their position
  • console.log() -  Console is an object reference here to stand in for the JS environment represented in your browser, Node.js, CodeSandbox, whatever. The log is a property of the console object and log() is a function call that prints to the console, followed by the parameters of what to print to the console
  • Expressions - In the statement: a = b * 2; This statement has four expressions in it:
    • 2 is a literal value expression
    • b is a variable expression, which means to retrieve its current value
    • b * 2 is an arithmetic expression, which means to do the multiplication
    • a = b * 2 is an assignment expression, which means to assign the result of the b * 2 expression to the variable a (more on assignments later)
    • A general expression that stands alone is also called an expression statement, such as the following: b * 2; This flavor of expression statement is not very common or useful, as generally it wouldn’t have any effect on the running of the program – it would retrieve the value of b and multiply it by 2, but then wouldn’t do anything with that result. A more common expression statement is a call expression statement (see “Functions”), as the entire statement is the function call expression itself as in alert( a );
  • Type conversion - Also called ‘coercion’. See Number() and likewise String() which are types of explicit coercion
  • Implicit coercion - all numbers for example are implicitly coerced into a string when you use the plus operator to concatenate different values together if at least one of those values of a string, then console.log prints the string. Another common way numeric values are implicitly coerced is to add an empty string as in:
var numStudents = 16;
console.log(`There are ${numStudents}+"" students.`);
Enter fullscreen mode Exit fullscreen mode

So if there's a string anywhere in the function it'll start to treat any numbers as a string, so if you want to treat a value as a number it may be necessary to add the Number() object to it.
If you use any specific mathematical operators such as > - etc. it will implicitly convert values to number (if possible), also with equality as in == (see my notes on Equality in the next chapter, Into JavaScript).

  • Function - Parentheses are used to group things together in an operation, but more importantly they are also an operator that means to call a function as in console.log(friends.length); and {}s group together a set of statements much in the same way as a paragraph in English but it would be called a “procedure” in programming. If you use mathematical operators such as > it will implicitly convert values to number (if possible)
  • Calling - Executing the code in JavaScript is not a matter of interpreting the code, which means the program is running the code from top to bottom line by line. The entire code is translated or compiled first (into bits) then it immediately runs the code.
  • Index -  console.log(friends[1]) would console the 1 position in an array.
  • Dot notation - allows you to access named keys as well as properties of an array object like cats.length or add, remove, or replace elements as in .pop() or combine and produce new arrays as in .filter()

Into Programming Exercises

Checkout my Github Repo and all of my different attempts to find out the best solution to Exercise 1 (named ex2 in this repo, bc ex1 is from the class and was a lot easier). I was pretty proud of being able to layout all of the important statements and procedures in a way that (mostly as I'll go over later) got the results I wanted. I struggled a little more to convert the expressions for calculating tax and properly formatting the purchase price properly into functions, mostly from getting comfortable with the syntaxes of how they work. Once I viewed his solution code, my biggest shift was from understanding that my logic where I subtracted each phone purchase from the bank account made it tricky for me to then determine the price of the total purchase later bc by the end I just had a (largely empty) bank account. So in order to make up for this, I had to count my loops and add each loop to a variable containing how many phones were purchased (1 per loop), THEN multiply the phones purchased by the price of each phone. His logic to just add each phone purchase amount to a space containing the purchase amount made a LOT more sense. Plus, I misunderstood the buying behavior behind the phones vs the accessories. Honestly, I was struggling for awhile with how this represented REALLY illogical buying behavior, so this obviously wasn't a program intended to help someone keep a budget but rather simulated how a human with bad spending habits might (poorly) logic themselves into going bankrupt at a phone sale lol, so it took me longer than you would think just to understand what the instructions were asking of me.

Top comments (0)