The following questions are your technical evaluation. Your target audience is a senior developer. Demonstrate your understanding. Keep your answer concise. Try to keep answers within one to two paragraphs.
doctype is an HTML element (not a tag). It's used to declare what kind of HTML is used in the
document. They are required for legacy reasons. Without it, some browsers will enter quirks mode and
try to render the document without following W3C and IETF standards.
In most cases, the document will appear to render just fine, but omitting doctype can lead to
unexpected behavior between browsers and devices.
doctypes can specify between HTML5 and different flavors of HTML4 and XHTML.
A CSS pseudo-element is a keyword added to a selector that lets you style parts of an element.
before and after are commonly used in what's known as the shadow DOM
Floats, like integers, are numbers STDIN and STDOUT. Unlike integers, floats contain a decimal for precision calculations. Despite that, It is generally unreliable to trust floats for precision sensitive calculations since computers have trouble in precise mathematics using floating numbers. This is famously demonstrated with examples from strange bank behavior to failed rocket experiments.
Demonstrate what this JavaScript code will output and explain why it outputs what it does? console.log(0.1 + 0.2);
$ node
> 0.1 + 0.2
0.30000000000000004
Really, the float numbers were not as we expected from the very beginning. The language rounds the numbers 0.1 and 0.2 at the displayed numbers, but they process somewhere around ~0.999318378937128937912 and ~2.987382199893 from the start. The addition of the two numbers probably worked as expected on the computers side, but it was definitely not the expected outcome.
Classical inheritence is like a blueprint. An object is defined with attributes, a constructor and then methods.
In JavaScript, methods are added to a class by defining a function to the new objects prototype. For
example, if I had a Dog class, and I wanted the dog to speak, we'd define that as
Dog.prototype.speak = function(){}
Now say I had a Cat as well and all the code smells started to become noticable. I'd personally start making an animal class that holds the similarities between a cat and a dog.
The animal class would define some methods(legs, tail, IsHungry, etc.) but probably have a different speak
In a classical OOP, both Cat and Dog inherit from Animal, but I'll need to recieve those
arguments in the Cat and Dog objects.
In a Prototypal inheritance, animal would be defined an object literal with attributes, functions,
and a create function which typically contains Object.create(this) and sets the parameters passed
as attributes to that #create call.
I could then just write var cat = animal.create(attributesObject) and
var dog = animal.create(attributesObject). I could take it a step further and start writing out
each dog breed by inheriting from the dog class without having to create a constructor because I've
inherited the create function. var Yorkie = dog.create(yorkieAttributes) and so on.
They both acheive the same goal, but Prototypal inheritence is much cleaner and simpler to write. Classical requires a constructor with expected attributes pre-defined. Prototypal uses a object literal, creates an object from that object literal and allows for the attributes of the parents to also be passed down.
undeclared is when you try to call something that has not been defined. (undeclared sometimes throws an error or returns as "undefined" in some cases) undefined is something that's been declared, but doesn't return a value. null is a value that value is null. It's a nothing value and variables that return null have been defined to return null. This is a falsey value. null returns as an object.
Immutable objects are objects that do not change after being created. Mutable objects can be modified after being created.
Strings are immutable. While it's true I can say something like:
var name = "Richard"
var name = "Rich"
Clearly, I changed my name, so maybe I was wrong?
Actually, all objects have a memory address. By overwriting name with a new string, I've detached
the variable name from pointing to Richard and instead, having it point to a new point in memory
that returns Rich
But you say: "What if I said 'Richard.toLowerCase()? WHAT THEN!?"
#toLowerCase actually takes the original string and returns a brand new one. Thus both the old and new strings are immutable.
examples of mutable objects are Objects and Arrays. This makes sense when you think about the memory address point I brought up before. If a variable points to an object in memory and alters that object without changing the memroy address, it is mutable
Synchronous functions are functions that runs synchronously. (Polymorphic explenation... haha)
What that means is that your code runs on a single thread, line-by-line in queue order. Imagine going to the bank, there is only one teller and you're last in line. Welcome to a Synchronous task.
Asynchronous functions are functions that get offset to run in a seperate thread and allows your code to continue running.
An example would be going to a diner. The host is tasked with greeting new guests and asks you how many people are in your party, the host processes your party number, sits you down and the rest of your visit is being taken care of asynchronously through the waiters and waitresses. This allows them to continue allowing new guests to come in without having to wait for previous guests to finish.
This is acheived in JS by offsetting tasks to the event queue. The event queue can run your code asynchronously without blocking your synchronous code. This is helpful for offsetting very long tasks.
The following questions are real questions our mentors have answered for students. Please answer them as if you received them from a real student. Please write your responses in a GitHub gist using Markdown for any formatting, and send the link to the gist with your application. We are assessing communication skills, and understanding where your technological strengths lie.
A few important things to keep in mind:
Most students are complete beginners and won't understand a lot of lingo or acronyms. Keep it simple! Students learn best from succinct and on-topic answers in your own words. External links may be provided for further reading, but the bulk of your answer should be your own. If you aren't able to answer a question because it's outside of your domain of expertise, don't stress. Our mentors are asked questions they don't know the answer to all the time. How would you handle that situation?
Hey mentor,
How do I determine when to use a for loop verses a while loop?
-Student
Great question,
A good time to use a for loop is when you're stepping through an array or any other type of collection.
for exmaple: If I walk into a room with my family and I want to greet everyone.
var family = ['Bob', 'Mary', 'Bonnie', 'Steve']
for (var i = 0; i < family.length; i++) {
console.log("Hi " + family[i]);
}
A good time to use a while loop is when you want a function to run as long as a condition is true.
while (hungry) {
eat();
}
don't get cought up about where hungry and eat are defined, this is just pseudo code.
In this example, we're just saying "while hungry, eat food" or, "eat until you're not hungry anymore."
Hey mentor,
I'm having a really hard time with some CSS. I've been given a PSD in an assignment. I know what the document should look like, but I'm getting this instead.
Can you help me with this? Here is my code!
-Student
Ok so elements that are floated do not fill height in the parent element. This is causing the parent element to have a height of 0. There are a few ways around this, i'll tell you my preferred way.
In the parent element of the float elements (pricing-tiers), add overflow: auto;. This will
allow it to acknowledge that the child elements are falling outside of the 0 height div and contain
it.
Another solution is to add a empty div as your last element, right after your last tier.
This div should have a class with the rule of clear: both;. This'll make a div that allows your
parent divs to clear the floating divs.
I've made a codepen with the first solution implemented and the 2nd solution commented out for you to toggle and try for yourself.
Hey mentor,
I was working through an assignment last night and came across a bug. I'm so confused!
The text in the alert is showing up as "undefined" instead of either "A Unicorn", "A hug", or "Fresh Laundry" and I'm not quite sure what's going on. Can you point me in the right direction?
-Student
I've put the working code into a codepen above.
There is a JavaScipt 'gotcha!' in there... A great way to debug this is by throwing in a console.log to see what's going on.
When I replace alert(prizes[num]); with console.log(num); and run your same code,
I get 3 no matter which button is clicked.
So why is this happening?
When you've assigned the event listeners for each button, you are assigning it to alert prizes[btnNum]. but btnNum keeps getting overwritted with 1, 2 and finally 3 where the loop ends. When it hits 3, it stops and the for loop with all event listeners equal to prizes[3], which doesn't exist so it returns undefined.
to prove this, replace alert(prizes[num]); with alert(num);. What happens?
To ensure that we set event listeners for those prizes at the time of the loop being run, you'll need a function that is immediately invoked.
We can do this by wrapping the function inside a Immediate Invoked Function Expression or an IIFE.
they're simple, just wrap the function inside parens like this
(function(){
// your code goes inside here
})(); // the () tells the code to invoke RIGHT NOW
So because everything inside this IIFE doesn't know anything about the code above it, we just need to pass it the btnNum because of scope issues, you'll need to pass the btnNum into it as an argument.
(function(num){
console.log("The button number you passed me is: " + num )
})(btnNum);
The end result will look like this:
(function(num){ // num = btnNum
document.getElementById('btn-' + num).onclick = function() {
// tell her what she's won!
alert(prizes[num]);
}
})(btnNum); // passing the btnNum into the IIFE
This way, the event listener is invoked IMMEDIATELY and we don't need to worry about btnNum getting overwritten as the for loop continues.
I know this is a lot to absorb just by reading it. I welcome you to copy-paste the console.log example I gave you above and play with it in the browsers console and see what happens. Let me know if you have any questions.
Hey mentor,
Thanks for the lecture yesterday, it really helped me get motivated again. I've been working through this assignment about databases and I'm confused about "SQL injection." What does that mean and how does it work? How do I prevent it in my apps?
Thanks!
-Student
Funny comic with a real-world example
In this comic. it sounds like the school used a programmed script to search for students. Let's imagine the script looks something like this:
SELECT * FROM students where name = "?";
This is an SQL statement that accepts an argument, so let's pass it my name, "Richard"
SELECT * FROM students where name = "Richard";
This'll return a bunch of students where the name is equal to Richard.
So now let's inject!, remember that ; ends a SQL command. so let's pass it Richard"; first so
that the SQL command doesn't break, if it breaks, it would throw an error preventing the rest of the script to
run. Then let's pass it DROP TABLE students;. this command together would look like this:
Richard"; DROP TABLE students; and run together with the script they have, would output to their
database like this:
SELECT * FROM students where name = "Richard"; DROP TABLE students;"
There is a trailing quote at the end that doesn't matter for the script since your injection would have been successful. The DROP TABLE students will succeed and their student data will have been wiped clean.
So how do we prevent this?
As Bobby Tables mom said in the webcomic above states, sanatizing the database is a good idea. This means filtering ALL user input from the website. This means that emails only allow special characters for emails, phone numbers only allow numbers, and so on.
You can also avoid constructing queries with user input. Any input that comes in should search for and escape all special characters before constructing queries.
Thankfully, most popular frameworks that you'll be using do this for you by default, but it's good to know and understand how and why these vulnerabilites happen.
A quick google search returns this article if you'd like to learn more