Interview Preparation Session Notes

Introduction

• Interviewer: Asked about the candidate's background and current studies.
• Candidate (Deepak Patel): Pursuing BSc in Computer Science and has experience in web development.
• Focus Areas: HTML, CSS, and JavaScript.

HTML Discussion

Full Form of HTML

• Hyper Text Markup Language

Use of HTML

• Creating the skeleton of a website

Semantic Tags in HTML

• Examples: header, footer, body, section
• Purpose: Introduced in HTML5 for better readability and SEO optimization.

Difference between div and span

• div: Block-level element, takes up the whole line.
• span: Inline element, takes up space according to its content.

CSS Discussion

Block-level vs Inline-level Elements

• Block-level: Takes up full width, can set height and width directly.
  • Examples: div, p
• Inline-level: Takes up space according to content, cannot set height and width directly.
  • Examples: span, img, input, a

Box Model in CSS

• Content-box: Default value, width and height include only content, not padding or border.
• Border-box: Width and height include content, padding, and border.

Specificity in CSS

• Importance: Determines which CSS rule is applied by the browser when multiple rules could apply to the same element.
• Numeric Specificity:
  • Element (tag) selector: 0-0-1
  • Class selector: 0-1-0
  • ID selector: 1-0-0

JavaScript Discussion

Data Types in JavaScript

• Primitive Data Types:
  • String
  • Number
  • Boolean
  • Null
  • Undefined
  • Symbol
• Non-Primitive Data Types:
  • Object
  • Array
  • Function

Example

• typeof array returns object
• typeof null also returns object (a long-standing JavaScript bug).

Variable Declaration: let vs var

• let: Block scope, cannot be redeclared.
• var: Function scope, can be redeclared.

Code Execution Understanding

• Hoisting:
  • var is hoisted with undefined value.
  • Functions are hoisted with the complete function definition.
  • let is hoisted but not initialized.
• SetTimeout Execution: Event loop and callback queue concepts.

Practical Coding Task: To-do List Application

• Requirements:
  • Input field for entering tasks.
  • Button to add tasks.
  • Ability to delete tasks.

Comments on Practical Task

• Initial struggles in console logging and capturing input events.
• Highlighted the importance of understanding how code is executed sequentially.

Recommendations for Improvement

• Improve practical coding skills with more hands-on projects.
• Focus on ES6 concepts and advanced JavaScript features.
• Prepare in a quiet, disturbance-free environment during interviews.
• Practice mock interviews in a serious manner to simulate real interview conditions.

Conclusion

• Candidate received constructive feedback on strengths and areas needing improvement.
• Encouraged to practice coding regularly and to deepen understanding of key concepts.