HTTP Fundamentals

GET vs POST Requests

Characteristic	GET	POST
Idempotency	Yes	No
Usage	Retrieving data	Submitting data
Caching	Cached	Not cached
Parameter Passing	URL query string	Request body
Security	Less secure	More secure
Length Limits	Browser-dependent	No browser limits
Data Types	ASCII only	All types including files

HTTP Status Code 304

• Purpose: Indicates cached content can be reused
• Common causes: Infrequent content updates or static pages
• Potential issues: May affect search engine rankings

HTTP Methods

Method	Purpose
GET	Retrieve data
POST	Send data
PUT	Update data
PATCH	Partial updates
DELETE	Remove data

Client-Side Storage

Cookei Characteristics

• Limited to 4KB
• Sent with every HTTP request
• Domain-specific
• Limited to ~20 per domain

Web Storage APIs

Feature	localStorage	sessionStorage
Capacity	5MB+	5MB+
Persistence	Persistent	Session-only
Scope	Origin-based	Tab-specific
API Methods	setItem(), getItem()	setItem(), getItem()

Storage Comparison

Aspect	Cookie	localStorage	sessionStorage
Server Interaction	Automatic	Manual	Manual
Size Limit	4KB	5MB+	5MB+
Lifetime	Configurable	Persistent	Session

JavaScript Core Concepts

Execution Model

• Single-threaded
• Event loop
• Asynchronous non-blocking I/O

Data Types

Primitive Types	Reference Types
Undefined, Null	Object
Boolean, String	Array
Number, Symbol	Function
BigInt	Date

Memory Management

• Stack: Fixed-size, fast access
• Heap: Dynamic allocation, slower access

Type Checking Methods

Method	Pros	Cons
typeof	Simple	Limited to primitives
instanceof	Works with objects	No primitives
constructor	Flexible	Can be overwritten
toString	Most reliable	IE6 quirks

Array Detection

// Multiple ways to check for arrays
Array.isArray([]); // true
[] instanceof Array; // true
Array.prototype.isPrototypeOf([]); // true
Object.prototype.toString.call([]) === '[object Array]';

Null vs Undefined

• Both represent absence of value
• typeof null returns 'object'
• typeof undefined returns 'undefined'
• Null is intentional, undefined is default

this Binding

• Determined at runtime
• Binding rules:
  1. Default: Global object
  2. Implicit: Containing object
  3. Explicit: call/apply/bind
  4. New: Instance being constructed

Array-Like Objects

• Have length property
• Can be indexed
• Examples: arguments, DOM collections

Converting Array-Like Objects

// Multiple conversion methods
Array.from(arrayLike);
Array.prototype.slice.call(arrayLike);
[...arrayLike];

Loop Comparison

Feature	for...in	for...of
Iterates Over	Enumerable properties	Iterable values
Prototype Chain	Includes inherited	Current only
Best For	Objects	Arrays, Strings

Asynchronous JavaScript

AJAX Limitations

• Not MVVM-friendly
• Complex configuration
• Event-based model

Axios Features

• Promise-based
• Request/response interceptors
• Automatic JSON parsing
• XSRF protection

Array Iteration Methods

Method	Mutates	Returns
forEach	No	undefined
map	No	New array
filter	No	Filtered array
reduce	No	Accumulator
some	No	Boolean
every	No	Boolean

CSS Fundamentals

Layout Techniques

• Float-based
• Flexbox
• Grid
• Positioning

Display Properties

Value	Behavior
none	Removed from flow
block	Full-width, stackable
inline	Flows with text
inline-block	Inline with block features

Element Visibility

Method	Rendered	Occupies Space
display: none	No	No
visibility: hidden	No	Yes
opacity: 0	Yes	Yes
position: absolute	Yes	No

Box Model Types

• Standard: width/height = content
• IE (border-box): width/height = content + padding + border

Text Overflow

/* Single line */
.single-line {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Multi-line */
.multi-line {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

Centering Techniques

/* Flexbox method */
.container {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Transform method */
.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

CSS3 Features

• Flexbox/Grid
• Transitions/Animations
• Custom Properties
• Media Queries
• Transformations

BFC Creation

Conditions that create Block Formatting Context:

• float (not none)
• position (absolute/fixed)
• display (inline-block/table-cell)
• overflow (not visible)

Vue.js Core Concepts

Component Communication

• Props/Events (Parent-Child)
• Provide/Inject (Cross-level)
• Event Bus (Any components)
• Vuex (Global state)

Lifecycle Hooks

Vue 2	Vue 3	Purpose
created	setup	Initial setup
mounted	onMounted	DOM access
updated	onUpdated	After re-render
destroyed	onUnmounted	Cleanup

Reactivity Systems

Version	Mechanism
Vue 2	Object.defineProperty
Vue 3	Proxy

Vue Router Modes

Mode	URL Format	Requires Server
hash	#/path	No
history	/path	Yes

Vuex Core Concepts

• State: Single source of truth
• Getters: Computed properties
• Mutations: Synchronous state changes
• Actions: Asynchronous operations
• Modules: Namespaced state

Composition API

// Vue 3 Composition API example
import { ref, computed } from 'vue';

export default {
  setup() {
    const count = ref(0);
    const double = computed(() => count.value * 2);
    
    function increment() {
      count.value++;
    }
    
    return { count, double, increment };
  }
}

Performance Optimization

Webpack Optimization

• Code splitting
• Tree shaking
• Caching
• Minification
• Parallel processing

General Web Optimizations

• Asset minification
• CDN usage
• Lazy loading
• Caching strategies
• Image optimization