The source of dread we all endure while interviewing is the unpredictable nature of the hiring process. With so many companies and even more technical questions, it feels useless trying to study every single concept and definition. Being new to the field compounds with the existing feelings of anxiety when finding the right opportunity.
Having graduated from bootcamp late 2021, I've applied for over 300 positions and acquired a decent amount of interviews. During that time, I compiled some of the most common questions I've been asked as a software engineer looking for front end leaning positions.
1.What is Semantic HTML?
The use of HTML elements that define their purpose to the browser and developer.
Examples are: <form></form>, <table></table>, <footer></footer> --these elements are defined by their name where as elements like
Semantic HTML defines sections in a document. So why is this important, you may ask?
This is extremely important for developers to understand when working off of existing code as it is for accessibility. For engineers, semantic HTML allows data to be shared and reused across applications. This promotes structure and assists in helping search engines understand the document and rate it by relevance for search queries.
From the user's perspective, semantic HTML assists in readability because it is sectioned by semantic HTML elements. Ordering a document's layout is crucial, especially for user's with disabilities. Having a uniform and universal set of elements to define the contents of a document supports an optimum level of user accessibility.
2.What are closures in JavaScript?
Closures in JavaScript give you access to an outer functions scope from an inner function. Closures are created whenever a function is created/initialized.
Seems like a simple question, so why is it asked so often?
Personally, I think interviewers want to establish a baseline knowledge in the language of specialization. Even though you may intuitively know that scope exists for every function, interviewers want to if you can talk about the concept in question. You may have worked with functions on an every day basis, but can you explain how/why they exist? It's important to build the skill of always questioning as an engineer. They want to see that you're always learning, and not blindly accepting things as they are.
3.What is the alt attribute on an img tag? What is their purpose?
It is the text description for media like images and videos on a web page. They are displayed when a video or image cannot be loaded onto the web page. They are accessed by screen readers to provide users with the text equivalent of images and videos.
4.What does important mean in CSS styling?
When an element is styled with the important property, it overrides all other styling. This is a great tip to know when specifying styling elements without repeating code or writing bloated code. Knowing tips like these will ensure to your interviewers that you know how to implement clean and reusable code.
5.What is the difference between const, var, and let?
These three keywords are used to define variables. But there are huge differences in their usages pertaining their scope and data.
Const is a great way to remember "constant", the keyword cannot be reassigned. When a variable is defined using const, it remains constant with it's original definition. This means it is not accessible before it appears within the code. It is also block scoped.
Var is a keyword that can be reassigned and can only be available inside the function that it is created in, therefore it is function scoped.
Let is a keyword that can be reassigned but it is similar to the scope of const, being block scoped. If variables are not created inside a function or block, then they're globally scoped.
6.Explain the DOM:
The DOM stands for Document Object Model, it's a method of translating HTML elements into a form that JavaScript can understand and interact with. JavaScript needs to understand the web page so it can manipulate, style, behave, and work as a dynamic web page.
6a. What are various ways to get elements from the DOM?
getElementsById
getElementsByClassName
getElementsByTagName
querySelector
querySelectorAll
7.What is the difference between forEach and map?
forEach Method:
-executes a function by iterating through each element of an array
-does NOT return anything, returns undefined
-allows you to modify the values of an existing array by applying the callback function on each element of an array (it mutates the original array)
map Method:
-creates a new array using the return values of this function
-creates a new array by applying the callback function on each element of the source array (does not mutate the original array)
-returns the new array
Both: execute a function for each element of an array
Takeaway Tips:
-Understand fundamental knowledge of your language, try not to let laziness hinder from asking questions about even the most basic concepts, herein lies the importance of a strong foundation
-get comfortable talking about concepts and definitions with another person (this will help you organize your thoughts, and come off clear and concise)
-in conjunction with the last tip, talk through your code with a friend, this is a great exercise in understanding your own code flow and communicating the nitty gritty details
-don't be afraid to look up studying materials and create your own study methods ie codepen, freecodecamp, udemy, github, articles, flashcards, note taking, etc
-have patience, what I know now couldn't have been learned without experience of interviewing
Saying you don't know to a question is not the end of the world.
It is not definitive of your knowledge. It is not a determination of the outcome of your interview. Admitting you don't know an answer proves that it's impossible to know everything. But more importantly, it displays your vulnerability and openness to learn.
I've had millions of moments in interviews blanking, stuttering, and tripping over my words. But when I accept the experience, and acknowledge my nervousness, I can focus on the feedback I receive from my interviewer. It let me take note of what I understood and what I didn't from the technical questions.
I wish that this was reminded more when I was entering my job hunting process. You are not going to know what they will ask you, and it's impossible to prepare for every situation. So no matter the outcome of an interview, what you gain from interviewing is how to let go.
Learning to let go allows you to let go of expectations or anxiety in the interview. It forces you to focus on yourself in a different light in understanding yourself, the knowledge you've acquired, and the insight you will gain from the interview experience.
Top comments (7)
Generally if I ask
it's to ferret out bad practices. Using
!importantin your CSS makes fixing issues through the cascade more difficult and is the reason that overusing descendant selectors is frowned upon (often using!importantis brought on by specificity wars in your CSS). Recognizing that you're reaching for this to fix an issue should be a red flag to you and showing that you recognize it as an anti-pattern would get you a pass on my interviews.It wouldn't on mine, and I'd take a dim view of such an opinionated approach to a 25 year old integral feature of the cascade. I'd much prefer to hear an explanation of how it can be used positively in conjunction with specificity and ideally, cascade layers.
Which, of course, is quite a problem if different interviewers can seek almost diametrically opposing answers to the same question.
I believe the composition of both goods and bads would form an even better answer, but what would be a correct answer about it's positive usage? I only used it a few times as a fast fix for some CSS mess that someone previous maintainer made.
You hit the only good point. Speed. Even in it's implementation
!importantfeels like a hack. It is the only property specification that affects the cascade and at that it short circuits it. If you have a production issue you need to patch in code you don't maintain, this would be a temporary fix.Those were great tips: direct, assertive and effective, thanks for this post :)
Glad I can help! :)
Regarding #3 -- there is no 'alt tag'. What you're describing is the alt attribute of an img tag.