millionhari-blog

[millionhari-blog]

Javascript Pseudo-classical Instantiation

Javascript has multiple instantiation methods that you can use: functional, functional-shared, prototypal, and pseudo-classical, and others. This post will address how to Javascript's most popular style: pseudo-classical. The pseudo-classical pattern creates methods directly on its prototype object, instead of creating a new object and returning it. Let's create a class called "Human", and give it the properties of name, age, and height. Notice that the "H" in "Human" is capitalized to follow the naming conventions of creating a class.

var Human = function(name, age, height){ this.name = name; this.age = age; this.height = height; }

All the properties are now in the Human class, great! Now let's make some methods. The thing that makes pseudo-classical instantiation stand out from the others is that you create the methods on the Human function's prototype object. Everything in Javascript is an object, including functions, and all objects in Javascript have a prototype object. That's why the Human function/class has a prototype object. You might be wondering: what IS a prototype object? Think of the prototype object as a utility belt that every object wears. All Javascript object inherit their properties and methods from their prototype. Everytime you add something to the prototype object, you are adding something to that utility belt. For example, if I wanted to add a method to the Array prototype, I could add something like this:

Array.prototype.getSecondElement = function(){ return this[1]; } var arr = [1,3,5]; arr.getSecondElement(); //returns 3

Because I added the getSecondElement method to the Array object's utility belt, all arrays can now use that method. pseudo-classical instantiation takes advantage of this by adding methods to its class's prototype. Let's go back to our Human class, and add some methods.

var Human = function(name, age, height){ this.name = name; this.age = age; this.height = height; } Human.prototype.sayHello = function(){ return "Hello my name is " + this.name; } Human.prototype.sayHeightAndAge = function(){ return "I am " + this.height + " feet tall and I am " + this.age + " years old." }

Now we can create a new object using this Human factory class

var Human = function(name, age, height){ this.name = name; this.age = age; this.height = height; }; Human.prototype.sayHello = function(){ return "Hello my name is " + this.name; }; Human.prototype.sayHeightAndAge = function(){ return "I am " + this.height + " feet tall and I am " + this.age + " years old." }; var bob = new Human('Bob', "21", "6"); bob.name; //returns "Bob" bob.age; //returns "21" bob.height //returns "6" bob.sayHello(); //returns "Hello my name is Bob" bob.sayHeightAndAge(); //returns "I am 6 feet tall and I am 21 years old."

There you have it. Bob has now been given Human's utility belt which contains all of its methods and properties via pseudo-classical instantiation. To recap: you create properties in the class by using the this keyword, and you create its methods by adding to the prototype of that class. Stay tuned for pseudo-classical subclassing!

[millionhari-blog]

Hack Reactor Week 2 Reflection

Week 2 of Hack Reactor was less crazy than week 1, but still a lot of fun. We learned about inheritance patterns, how to formulate algorithms, and finally got to use a powerful Javascript library called D3. I had a big breakthrough this week: I stopped comparing myself to people. In this industry, it's so easy to compare yourself with the person next to you. Chances are, someone around you will probably be a better programmer than you, but you can't let that discourage you. I realized this week that I was constantly comparing my progress of the sprint to others' progress, and it was really toxic to my growth. Sure you can use comparison as an indicator of where you should be, but it shouldn't be a detrimental factor. When I started the N-Queens sprint (a notoriously difficult spring in Hack Reactor), I decided to stop comparing. I focused on my code and understanding every line of it, even if that meant I would be slower than others. My pair partner and I stayed until 12AM and struggled through the code together, but we got it in the end. This has got to be one of my favorite sprints so far because I understood every line of code that I typed. So to sum it up: Worry about your own growth, and don't let comparison be detrimental to your growth.

[millionhari-blog]

Hack Reactor Week 1 Reflection

This week, Hack Reactor put a fire hose in my mouth and stuffed it with computer science + Javascript goodness, and I enjoyed every second of it. Everything from the quality lectures, to the computer science concepts like advanced data structures, Hack Reactor's curriculum and style of teaching really is as insanely good as the numerous Yelp/Quora/blog posts say. Also, the people here are amazing! I have never met a more smarter or diverse group of people in my life. One of the things that I enjoyed the most this week were the paired-programming sprints. In a sprint, you are partnered up with a person and are expected to solve coding problems with them. If your understanding of Javascript is higher than that of your partner's, you have to make sure you bring your partner up to speed, and vice versa. In a paired-programming session, one person is the driver, and the other is the navigator. The navigator will tell the driver what code to write, while the driver types out the code. This forces the driver to think about the code he is typing, so that he will be learning as he goes along. One valuable lesson I learned from paired-programming is the power of positivity. Even just a "yeah that's looks good" or a "mmhmmm" goes a long way in fueling the navigator's confidence to find the solution to the problem. I also realized how valuable it is to let people make mistakes first before you correct them, so that they will learn what paths work for certain problems, and what paths don't for others. I am making a list of things that I do not fully understand 100%, and brushing up on those things is what I will be using my day off (Sundays) for. I'm excited to see what week 2 will hold for me.

[millionhari-blog]

_.memoize like a 5th grader

I just got home from my 3rd day at Hack Reactor, and I am loving it. One thing I found to make certain topics of Javascript understandable is to pretend that you're explaining that topic to a fifth grader.

I was trying my hardest to understand the function memoize, but for some reason it just didn't click in my head, so I pulled aside one of my class leads, named Allen Price, and he explained it to me with an analogy that a fifth grader would understand.

First, fancy Javascript talk. What memoize does, is it memorizes the result of whatever function you pass into it, so that if you were to call the same function again with the same arguments, it would not have to execute the function again, but instead looks at the result and returns it. This means that if you memoize a function that is 1000 lines long, you would only have to run it once, and if you were to call the function again with the same arguments, it would return the answer from the function that you previously ran.

So how does memoize actually work? I'm not going to be using the Fibonacci sequence as an example, as you can find that in plenty of other resources online. Let me break how memoize works with Allen's 5th grade analogy:

Remember in middle school math books, where you had the answer key at the back of the book? In memoize, you're basically making that answer key as you go along. You will write down every problem that you do on the piece of paper, and then write down the answer to that problem, so that if you come across that same problem, you won't have to use your brain power to solve it again. So let's make that answer key by taking out a blank piece of paper:

function memoize(mathProblem) { var answerKey = {}; }

Great! Now, let's return an anonymous function because we do not know what functions we are going to pass into memoize, and we need to access their arguments (in this case math problems) so that we can write the problems and answers on answerKey.

function memoize(mathProblem) { var answerKey = {}; return function(){ } }

We next need to set the key of answerKey to the problems/functions of whatever we throw at it, and then set the value to the answer. Since keys can't be arrays, we need to turn the arguments into a string with JSON.stringify.

function memoize(mathProblem) { var answerKey = {}; return function(){ var parameters = JSON.stringify(arguments[0]); } }

Next, we need to see if we already wrote down the problem with its answer on the piece of paper. If you have already done the problem and you already wrote down the problem on the answerKey, then look at the answer instead of doing the problem again.

function memoize(mathProblem) { var answerKey = {}; return function(){ var parameters = JSON.stringify(arguments[0]); if (answerKey[parameters]) { return answerKey[parameters]; } } };

If not, solve the problem and then write down your problem with its answer on your answerKey.

function memoize(mathProblem) { var answerKey = {}; return function(){ var parameters = JSON.stringify(arguments[0]); if (answerKey[parameters]) { return answerKey[parameters]; } else { answerKey[parameters] = mathProblem.apply(this, arguments); return answerKey[parameters] } } };

That's it! You're done! So now as you go through your homework, if the same problem happens to come up, you won't have to use your brainpower to solve it anymore! Simply look at your answerKey and write down the answer.

So let's try to use our code. We are going to make a function called squared that will take an input, and will return the square of tha tinput.

var squared = function(input){ return input*input; }

Now we will make a function called memoSquared that we will set to squared called in our memoize function.

var memoSquared = memoize(squared);

Let's pass some crazy big number inside of memoSquared and see what happens.

memoSquared(157687); //returns 24865189969

memoSquared has actually computed the function once, and has now stored my function that squares 157687, and set its value equal to the answer of 24865189969 (looks like this: answerKey = {157687 : 24865189969}). Let's run it one more time.

memoSquared(157687); //still returns 24865189969

memoSquared still returns 24865189969, but it did not run the function again. Instead, it saw that you have already ran the function before, looked at the answer key you made, and returned whatever the answer was that you previously generated. Give it a try!

Here is the code refactored for efficiency and with variable names that don't have to do with the mathbook analogy.

function memoize(func) { var obj = {}; return function(){ var args = JSON.stringify(arguments[0]); // if (obj[args]) { // return obj[args]; // } else { // obj[args] = func.apply(this, arguments); // return obj[args]; // } obj[args] = obj[args] || func.apply(this, arguments); return obj[args]; };

[millionhari-blog]

Leaving the Nest

All my life I've been sheltered and comfortable at home, but all that changes today. Today, I am heading up to San Francisco to pursue my dreams of being a Software Engineer via Hack Reactor. Soon I will be able to create whatever whacky idea comes to my head, and hopefully impact people's lives. I'm excited for this upcoming journey, and would like to thank everyone that has supported and prayed for me all this time. See you soon Bay Area!

[millionhari-blog]

Checking whether or not a variable/element exists

To check if a variable/element exists or is undefined, you have to use the typeof operator:

if (typeof existingVariable === "undefined") { //Do this if existingVariable is does not exist. }

Inversely, you can check to see if a variable IS defined by checking if the variable/element is not undefined:

if (typeof existingVariable !== "undefined") { //Do this if existingVariable is DOES exist. }

[millionhari-blog]

Using _.map to extract and convert values of an object into an array

The underscore library has a turdload of functions that make Javascript easier and less repetitive. One of these is the _.map function. You can use the _.map function to extract the values of an object and store them into an array.

var obj = {'blah': 2, 'yo': 4, 'hello': 6}; var objValues = _.map(obj, function(x){ return x }); console.log(objValues) //returns [2,4,6];

You can also get the length of an object this way by using the .length property once the values are stored into an array:

var obj = {'blah': 2, 'yo': 4, 'hello': 6}; var objLength = _.map(obj, function(x){ return x }).length; console.log(objLength) //returns 3;

[millionhari-blog]

Copying values of an array to another variable by using .slice()

Arrays have certain properties that do not work the same way a string usually does. Let's take a look at an example.

var hello = "Hello there!"; console.log(hello) //returns "Hello there!"; var greeting = hello; console.log(greeting) //returns "Hello there!"; var hello = "Wassup homie?"; console.log(hello) //returns "Wassup homie?"; console.log(greeting) //returns "Hello there!";

With strings, when you assign a variable as the value to another variable, you essentially make a copy of that variable. hello and greeting are two different variables, and a change to either one of them will not affect the values of the other. Arrays, however, are a different story:

var arr = [1,2,3,4,5]; console.log(arr) //returns [1,2,3,4,5]; var hello = arr; console.log(hello) //returns [1,2,3,4,5]; hello = [2,4,6,8,10]; console.log(hello) //returns [2,4,6,8,10]; console.log(arr) //returns [2,4,6,8,10];

hello is a pointer to arr, and whatever changes you make to one variable will affect the other one. In order to escape this pointer and make a copy of the values instead, you must use the .slice() method.

var arr = [1,2,3,4,5]; var hello = arr.slice(); hello = [2,4,6,8,10]; console.log(hello) //returns [2,4,6,8,10]; console.log(arr) //returns [1,2,3,4,5];

when you use the .slice() method to create the hello variable, it creates a copy of the values of arr instead of pointing to it.

[millionhari-blog]

HR 24/25

I am now connected and conversing with the lovely people of the 24th cohort (my cohort), as well as cohort 25 since we are going to go through the program together. We are connected via Facebook group, Google Communities, and Slack. We've already been given our pre-course assignments and already had 3 Google Hangout sessions already. THIS IS ALL SO COOL. I AM EXCITE.

[millionhari-blog]

I'm going to Hogwarts, Ma!

I DID IT. I GOT INTO THE HARVARD OF ALL CODING BOOTCAMPS!

2 weeks ago I decided to drop out of college and take my first step towards being a full stack developer: Getting into Hack Reactor.

For those that don’t know, Hack Reactor is 13-week coding bootcamp that takes you from zero to full stack hero. I heard about this program from a friend that asked me to go through this process with him earlier this year. Its instructors aren’t like the industry failures you would find in academia. These instructors are the people that have helped to create many of the web applications we use today, such as Twitter, Google, Adobe, and even OkCupid. To put into terms of how selective this program is, Harvard’s acceptance rate is 6%, while Hack Reactor’s is 3%.

TL;DR Hack Reactor’s acceptance rate < Harvard’s acceptance rate.

I started learning Javascript early this year in January, and had my first interview with Hack Reactor on February 24th, 2014. I didn’t do as much studying as I should have, and failed miserably. How miserably you ask? I didn’t even know how to implement a basic for-loop to iterate through an array. I was really bummed out that I wasn’t able to get into the program of my dreams, and kind of put that dream on hold for a couple of months. It wasn’t until I was sitting in my stupid Management class in June that I really asked myself, “What the heck am I doing here?” and started again to pursue my web development dreams.

TL;DR Failed in the first interview, got discouraged, hated school, encouraged again.

Before I threw myself whole heartedly into this whole affair.. I felt like I needed something to motivate me, so after OutsideLands (the music festival up in San Francisco), I stayed with my friend (the guy who introduced me to this whole biz) and checked out the fast paced tech culture of San Francisco. We went to meet-ups, visited the big companies (Google, Adobe, etc.), and even checked out a couple of the other coding bootcamps. That’s when I was 100% positive that this industry is where I belonged.

TL;DR Went to SF. Found motivation.

It was mid-August, and I set my interview for September 22nd. By this time, the interview process for Hack Reactor had already changed twice! They went from 2 interviews and 1 project, to 1 interview and 1 project, to just 1 final interview. There were no more baby interviews, just the one final technical interview. For a good solid month I would bunker down at various coffee or boba joints and study my bee-hind off. I remember one 10-hour study session on August 30th where everything clicked. In that one study session in Canabru, I grasped the knowledge of callbacks and closures, and at that moment in time I felt invincible. For the remainder of the time leading up to the interview, I rewrote and tried to understand as many of the functions from the Underscore Library as I can, did all the easy and some of the medium problems on Coderbyte, and hashed through as many katas as I could on Codewars.

TL;DR Studied like crazy. Many hours. MANY MANY HOURS.

2 days ago was my interview, and I was a nervous wreck. My heart rate the whole week of the interview was up in the high 90s (which is super bad), and I was not getting much sleep. Before the interview, I prayed that God’s will be done in my life and for Him to open this door if He wanted to. I sang a couple of worship songs, and practiced to control my breathing to slow down my heart rate. Finally, the Skype call came.

TL;DR Super nervous. Anxiety is no joke. Prayed like crazy.

The first 10-15 minutes was a culture fit test, and my interviewer and I just chatted about why I chose Hack Reactor, etc. My interviewer told me to explain my process while I was going through the problems, and to pretend like I was explaining Javascript to a 10-year old who knew the basics of Javascript. I found out that all that studying had paid off! My understanding of callbacks allowed me to blaze through most of the problems with ease! I got stuck at the last problem, but my interviewer nudged me the right way until I eventually got it. It was an amazing learning experience, although it was extremely nerve-wracking. After the technical part, was an informal Q&A session.

TL;DR Interview went well. Long hours of studying paid off.

I was pretty happy with my interview, so I went about the rest of my day in a pretty good mood. Now for the waiting game.. the result would come in about 24-48 hours via e-mail.

22 hours later, September 24, 2014, the email came. I was at work on my computer when I saw it. “Hi Michael, We are excited to say that we would like to welcome you to join our February 2nd program”. I started to hyperventilate. My co-workers saw me and knew exactly what happened (they knew what I was going through and were extremely supportive, especially my supervisor). I began to tremble with joy, and that was that. I GOT IN. High fives and hugs all over. I found out a week before that moment that I only had 3 weeks left at work because I decided to not re-take any of my classes (student positions require you to take at least 6 units to be able to work there), so I unexpectedly made the announcement then and there to the rest of the office. This job at school was the only thing keeping me sane from the mundaneness of college. I have been there for three years, and am the student employee that’s been there the longest. Some tears may have been shed.

TL;DR Found out at work. Freaked out. Announced I was leaving. Tears.

I did it though! I am now in the program and I am dropping out of college to actually learn something. Thank you to all those that prayed for me and supported me along the way. I couldn’t have done it without you. I’m going to Hogwarts, Ma!

If you’re applying to Hack Reactor here’s what I suggest you study:

1. Eloquent Javascript - Functional Programming

2. Understanding Javascript Callback Functions and Use Them

3. Rewriting, understanding, and using the Underscore.JS Library

4. Build algorithmic logic with Codewars and Coderbyte

[millionhari-blog]

9/12/2014 - 4:50something AM

I just found out that all my classes got dropped because of an issue with my financial aid. I should be tripping balls right now and worrying, but I'm not, and do you know why I'm not? Because I'm dropping out. Yep. You read that right. Why you ask? Because it's the right thing to do.

"But Michael, you're already in your third year and you only have two more years to go in your five year track!". Do you have any idea what can get done in two years? A LOT. A LOT CAN GET DONE IN TWO YEARS. I have been mentally checked out of college since Fall quarter, Freshman year of high school, and every second I spend in a classroom KILLS me. I love learning, but being forced to sit in a classroom and learning about things that don't matter to me makes me want to go punch something. Also, so many professors I had in my college (Cal Poly Pomona) haven't the slightest clue of what they are teaching about, and it bugs me.

"But Michael, without a college degree you won't have anything to fall back on if your current plan doesn't work and nobody wants to hire you!"

There's a scene in the Dark Knight Rises where Bruce Wayne is in an underground prison after Bane beats him up. The only way out of that prison is by climbing the walls, and jumping a gnarly gap that no one (with the exception of one little girl) has ever cleared. Every time Bruce Wayne attempts the jump, he is wearing a safety rope so that he would not die if he were to fall. He fails every single time until he finally decides to jump without the rope. Without the rope, there is no safety, no backup plan, no other way. Bruce Wayne realizes that if he did not clear the gap, he would die, and that reality allowed him to clear the gap with pure willpower. I want to do the same. No safety nets.

My next step is to get into a Web Development Bootcamp called Hack Reactor so that I will have the knowledge to be able to bring my ideas to life. I ultimately want to benefit the human race via the web. I have been studying for awhile now, and I feel like I am ready for my interview on the 22nd of this month. Thank you Lord for giving me peace. Wish me luck.

[millionhari-blog]

I created my first web app. It's an extremely simple app: you put in a letter and it returns its alphabetical position. I created this web app to finally build something, because all I've been doing is studying logic.

[millionhari-blog]

I had the privilege of shooting Ellen & Nelson's wedding last week. They're such an awesome and down to earth couple, and I can't wait to edit the photos to share with you all! For now, here are some highlights from our engagement session last October.

[millionhari-blog]

Blog is live!

I have finally finished styling my blog! I chose Tumblr as my blogging platform because of its simplicity and awesomeness. I will be posting all my work on this Tumblr regarding photography, videography, webdev, animation, etc. If you haven't checked out my website already, you should totally do so here.