JS FS BC W4

Chunhao Weng
5 min readMay 28, 2021

--

Random notes. Unorganized thoughts. Not an article.

const does not mean “constant” in the way some other languages like C mean. In particular, it does not mean the value cannot change - it means it cannot be reassigned.”

This makes sense, such a good point.

“If you divide by zero, JavaScript does not raise any error but returns the Infinity value (or -Infinity if the value is negative).”

“A number can be defined using hexadecimal syntax by using the 0x prefix”

“…the problem is best avoided by not storing decimals at all, and using calculations to just render numbers as decimals to the user instead of storing them as such.”

“Always use integer math for currency. Never store currency as a floating point value. Currency is a fixed point value. Store all currency values as an integer that represents the smallest denomination that matters to your system. For example, if you are using USD and the smallest denomination you care about is a penny ($0.01) then store currency values as a count of pennies. If you care about thousandths of a penny ($0.00001) then store that.”

“A number is NaN only if it’s NaN or if it’s a division of 0 by 0 expression, which returns NaN.”

“JavaScript calls the valueOf method to convert an object to a primitive value. You rarely need to invoke the valueOf method yourself; JavaScript automatically invokes it when encountering an object where a primitive value is expected.” From MDN. That’s why.

“JavaScript does not have a “char” type, so a char is a string of length 1.”

"JavaScript JavaX".replace(/Java/g, "Type") //'TypeScript TypeX'"JavaScript".replace(/Java/, (match, index, originalString) => {
console.log(match, index, originalString)
return "Test"
}) //TestScript

Had no idea what locales were, so I Googled this.

“By default the method uses the host system’s default language. You can also pass a specific language to the string to get the local variation:”

“Arrow functions allow you to have an implicit return: values are returned without having to use the return keyword.” For one line. Lose the parentheses if you have just one parameter.

“The big difference with regular functions is when they are used as object methods.” (Come back to this later.)

Literals, found this explanation on stackoverflow.

“Basically, all syntax constructs whose use lead to a defined type can be called a literal. (E.g., a string literal, "abc".) It's a technical term that denotes, that "literally" writing something in this or that way leads to a certainly typed variable exclusively (in contrast to constructs, that look like something else, like array() in PHP).”

Just think of it as a fixed value.

“Objects are always passed by reference.” Yeah.

“if I wanted to include a character not valid as a variable name in the property name (spaces, hyphens, and other special characters), I would have had to use quotes around it.

“This is because arrow functions are not bound to the object.”

“This is the reason why regular functions are often used as object methods.”

Just realized this is in the js handbook… word by word… hmmm

Though there is still value in having an community, instant feedback and a structured learning path I guess.

“What are classes? They are a way to define a common pattern for multiple objects.”

“Normally methods are defined on the object instance, not on the class. You can define a method as static to allow it to be executed on the class instead.”

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/static

MDN so niceeee

Object restructuring or unpacking. (Personally like the latter more.)

“The main difference is that in array destructuring the value assigned to the variables depends on the order, while object destructuring is based on the property names.”

Deep copy vs shallow copy (mix of MDN, freecodecamp and Flavio stuff)

https://www.freecodecamp.org/news/copying-stuff-in-javascript-how-to-differentiate-between-deep-and-shallow-copies-b6d8c1ef09cd/#:~:text=A%20deep%20copy%20means%20that,into%20how%20JavaScript%20stores%20values.

“A deep copy means that all of the values of the new variable are copied and disconnected from the original variable. A shallow copy means that certain (sub-)values are still connected to the original variable.”

Object.assign() was mostly used before the spread operator was around, and it basically does the same thing. You have to be careful though, as the first argument in the Object.assign() method actually gets modified and returned.”

MDN example

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

“So make sure that you pass the object to copy at least as the second argument. Normally, you would just pass an empty object as the first argument to prevent modifying any existing data.”

“Being a shallow copy, values are cloned, and objects references are copied (not the objects themselves), so if you edit an object property in the original object, that’s modified also in the copied object, since the referenced inner object is the same”

const original = {
name: "Fiesta",
//objects references are copied (not the objects themselves) car: {
color: "blue",
},
}
const copied = Object.assign({}, original)

original.name = "Focus"
original.car.color = "yellow"

copied.name //Fiesta
copied.car.color //yellow

“What if you don’t know how deep the nested structures are? It can be very tedious to manually go through big objects and copy every nested object by hand. There is a way to copy everything without thinking. You simply stringify your object and parse it right after”

“One very common strategy is to use what Node.js adopted: the first parameter in any callback function is the error object: error-first callback. If there is no error, the object is null. If there is an error, it contains some description of the error and other information.”

Now this explains what Huli was mentioning before.

“Async functions are a higher level abstraction over promises.”

“With one particular caveat: whenever we use the await keyword, we must do so inside a function defined as async.”

“So, async ensures that the function returns a promise, and wraps non-promises in it.”

We’ll need to replace .then calls with await.

Also we should make the function async for them to work.

“It’s common to call clearInterval inside the setInterval callback function, to let it auto-determine if it should run again or stop.”

“you need to remember that we can’t add more than one statement — more than one will require curly brackets and a return statement.”

“we don’t have any parameter, so we must use this () => {} syntax”

Checked on MDN, just like Flavio said, private class fields are not implemented in Firefox, yet. Wonder why?

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/Private_class_fields

Class. Object. Method. hehehe

Sign up to discover human stories that deepen your understanding of the world.

Free

Distraction-free reading. No ads.

Organize your knowledge with lists and highlights.

Tell your story. Find your audience.

Membership

Read member-only stories

Support writers you read most

Earn money for your writing

Listen to audio narrations

Read offline with the Medium app

--

--

Chunhao Weng
Chunhao Weng

Written by Chunhao Weng

Random notes for personal use.

No responses yet

Write a response