JavaScript Objects

const user = {
  id: 'u1',
  name: 'Alice',
  role: 'admin',
  'full name': 'Alice Smith', // quoted key when needed
  isActive: true,
}

const user = new Object()
user.id = 'u1'
user.name = 'Alice'
 
// Prefer literals — shorter and idiomatic
const better = { id: 'u1', name: 'Alice' }

const field = 'status'
const record = { [field]: 'active' } // { status: 'active' }
 
const key = 'userId'
const dynamic = {
  [key]: 42,
  [`${key}_label`]: 'User ID',
}

const cart = {
  items: {},
  add(id) {
    this.items[id] = (this.items[id] ?? 0) + 1
  },
  total() {
    return Object.values(this.items).reduce((sum, qty) => sum + qty, 0)
  },
}

const user = { name: 'Alice', role: 'admin' }
 
user.name // 'Alice' — dot for known keys
user['role'] // 'admin' — bracket for dynamic keys
 
const key = 'name'
user[key] // 'Alice'

const product = { id: 1, name: 'Mug' }
 
product.price = 12.99 // add / update
product['inStock'] = true
 
delete product.inStock // removes own property

const user = { profile: { city: 'NYC' } }
 
user.profile?.city // 'NYC'
user.address?.city // undefined — no error
user.address?.city ?? 'Remote' // 'Remote'
user.getName?.() // safe method call

const settings = { theme: null, fontSize: 0 }
 
settings.theme ?? 'light' // 'light' — null/undefined only
settings.fontSize ?? 14 // 0 — 0 is valid, not replaced

const obj = { a: undefined }
obj.a ?? 'default' // 'default'
'a' in obj // true — key exists even if value is undefined!

const scores = { alice: 90, bob: 75, carol: 88 }
 
Object.keys(scores) // ['alice', 'bob', 'carol']
Object.values(scores) // [90, 75, 88]
Object.entries(scores) // [['alice', 90], ['bob', 75], ['carol', 88]]

const pairs = [
  ['x', 1],
  ['y', 2],
]
Object.fromEntries(pairs) // { x: 1, y: 2 }
 
// Transform object immutably
const curved = Object.fromEntries(Object.entries(scores).map(([name, score]) => [name, score + 5]))

// Preferred — own enumerable string keys
for (const [name, score] of Object.entries(scores)) {
  console.log(name, score)
}
 
// for...in — includes inherited enumerable keys (usually avoid)
for (const key in scores) {
  if (Object.hasOwn(scores, key)) {
    console.log(key, scores[key])
  }
}

const defaults = { theme: 'light', pageSize: 10 }
const userPrefs = { pageSize: 25, lang: 'en' }
 
const merged = { ...defaults, ...userPrefs }
// { theme: 'light', pageSize: 25, lang: 'en' } — later keys win

const target = {}
Object.assign(target, defaults, userPrefs)
// mutates target, returns target

const user = { id: 1, name: 'Alice', role: 'viewer' }
 
const promoted = { ...user, role: 'admin' }
 
// Nested update (Redux-style)
const state = { cart: { p1: { qty: 1 } }, user: { name: 'Alice' } }
const next = {
  ...state,
  cart: {
    ...state.cart,
    p1: { ...state.cart.p1, qty: 2 },
  },
}

const employee = {
  id: 'e1',
  name: 'Alice',
  department: 'Eng',
  salary: 90000,
}
 
const { name, department } = employee
const { name: employeeName } = employee
const { role = 'viewer' } = employee // default when missing

const { id, ...rest } = employee
// rest = { name, department, salary } — id omitted

const data = { user: { profile: { city: 'NYC', zip: '10001' } } }
 
const {
  user: {
    profile: { city },
  },
} = data

function renderRow({ name, salary, status = 'active' }) {
  return `${name} (${status}): $${salary}`
}
 
renderRow({ name: 'Alice', salary: 90000 })

let a = { x: 1 }
let b = { x: 2 }
;[a, b] = [b, a]

const original = { a: 1, nested: { b: 2 }, tags: ['js'] }
 
// Shallow — top-level new reference, nested shared
const shallow = { ...original }
shallow.nested.b = 99
original.nested.b // 99 — mutated!
 
// Deep — modern built-in
const deep = structuredClone(original)
deep.nested.b = 0
original.nested.b // 99 — unchanged
 
// JSON trick — loses Date, Map, undefined, functions, Symbol
const jsonCopy = JSON.parse(JSON.stringify(original))

Object.is(NaN, NaN) // true  (NaN === NaN is false)
Object.is(-0, +0) // false (=== treats them as equal)

const user = { name: 'Alice' }
 
'name' in user // true
'toString' in user // true — inherited from prototype!
Object.hasOwn(user, 'name') // true — own property only
Object.hasOwn(user, 'toString') // false

user.hasOwnProperty('name') // true — can be overridden on object
// Prefer Object.hasOwn (ES2022)

const user = {}
Object.defineProperty(user, 'id', {
  value: 1,
  writable: false,
  enumerable: true,
  configurable: false,
})
 
user.id = 2 // fails silently (strict mode: TypeError)

const obj = { name: 'Alice', meta: { age: 30 } }
 
Object.freeze(obj) // no add / delete / change own props (shallow)
Object.seal(obj) // can change values, not add/delete keys
Object.preventExtensions(obj) // no new keys, can delete/change existing
 
obj.meta.age = 31 // still works after freeze — nested not frozen!

const animal = {
  speak() {
    return `${this.name} speaks`
  },
}
 
const dog = Object.create(animal)
dog.name = 'Rex'
dog.speak() // 'Rex speaks'

const src = {
  get label() {
    return 'src'
  },
}
const clone = Object.create(Object.getPrototypeOf(src), Object.getOwnPropertyDescriptors(src))

const cache = new Map()
 
cache.set('user:1', { name: 'Alice' })
cache.set(42, 'answer')
cache.set({ id: 1 }, 'metadata')
 
cache.get('user:1') // { name: 'Alice' }
cache.has(42) // true
cache.size // 3
cache.delete(42)
 
for (const [key, value] of cache) {
  console.log(key, value)
}

const obj = { a: 1, b: 2 }
const map = new Map(Object.entries(obj))
const back = Object.fromEntries(map)

const ids = [1, 2, 2, 3, 3, 3]
const unique = [...new Set(ids)] // [1, 2, 3]

function pick(obj, keys) {
  return Object.fromEntries(keys.filter((k) => k in obj).map((k) => [k, obj[k]]))
}
 
function omit(obj, keys) {
  const exclude = new Set(keys)
  return Object.fromEntries(Object.entries(obj).filter(([k]) => !exclude.has(k)))
}
 
const user = { id: 1, name: 'Alice', password: 'secret' }
pick(user, ['id', 'name']) // safe public fields
omit(user, ['password']) // strip sensitive fields

function shallowEqual(a, b) {
  if (Object.is(a, b)) return true
  if (!a || !b || typeof a !== 'object' || typeof b !== 'object') return false
 
  const keysA = Object.keys(a)
  const keysB = Object.keys(b)
  if (keysA.length !== keysB.length) return false
 
  return keysA.every((key) => Object.is(a[key], b[key]))
}

const products = [
  { id: 'p1', name: 'Mug' },
  { id: 'p2', name: 'Book' },
]
 
const byId = Object.fromEntries(products.map((p) => [p.id, p]))
// { p1: { id: 'p1', name: 'Mug' }, p2: { ... } }
 
// Or with reduce
const byId2 = products.reduce((acc, p) => {
  acc[p.id] = p
  return acc
}, {})

const employees = [
  { name: 'A', dept: 'Eng' },
  { name: 'B', dept: 'Sales' },
  { name: 'C', dept: 'Eng' },
]
 
const byDept = Object.groupBy(employees, (e) => e.dept)
// { Eng: [...], Sales: [...] }

function deepMerge(target, source) {
  const out = { ...target }
  for (const [key, value] of Object.entries(source)) {
    if (value && typeof value === 'object' && !Array.isArray(value) && target[key] && typeof target[key] === 'object') {
      out[key] = deepMerge(target[key], value)
    } else {
      out[key] = value
    }
  }
  return out
}

const user = {
  id: 1,
  name: 'Alice',
  email: 'alice@example.com',
  role: 'admin',
}

const user = new Object()
user.id = 1
user.name = 'Alice'
user.email = 'alice@example.com'

const user = { name: 'Alice', role: 'admin' }
 
user.name // 'Alice'
user['role'] // 'admin'
 
const key = 'name'
user[key] // 'Alice'

const product = { id: 1, name: 'Mug' }
 
product.price = 12.99 // add
product.name = 'Ceramic Mug' // update

const user = { id: 1, name: 'Alice', temp: true }
delete user.temp
console.log(user) // { id: 1, name: 'Alice' }

const user = { name: 'Alice' }
 
'name' in user // true
'toString' in user // true — inherited!
Object.hasOwn(user, 'name') // true
Object.hasOwn(user, 'toString') // false

const user = { id: 1, name: 'Alice', email: 'alice@example.com' }
const { name, email } = user

const user = { name: 'Alice' }
const { name: userName, role = 'viewer' } = user
// userName = 'Alice', role = 'viewer'

const user = { id: 1, name: 'Alice', password: 'secret', role: 'admin' }
const { password, ...safeUser } = user
// safeUser = { id: 1, name: 'Alice', role: 'admin' }

const data = {
  user: { address: { city: 'NYC', zip: '10001' } },
}
 
const {
  user: {
    address: { city },
  },
} = data
console.log(city) // 'NYC'

const original = { a: 1, nested: { b: 2 } }
const clone = { ...original }
 
clone.a = 99
original.a // 1 — top-level independent

const original = { a: 1, nested: { b: 2 } }
const deep = structuredClone(original)
 
deep.nested.b = 99
original.nested.b // 2 — unchanged

const defaults = { theme: 'light', pageSize: 10 }
const overrides = { pageSize: 25, lang: 'en' }
 
const config = { ...defaults, ...overrides }
// { theme: 'light', pageSize: 25, lang: 'en' }

const defaults = { a: 1, b: 2 }
const extra = { b: 3, c: 4 }
 
const target = {}
Object.assign(target, defaults, extra) // mutates target
 
const merged = { ...defaults, ...extra } // new object

const scores = { alice: 90, bob: 75 }
 
Object.keys(scores) // ['alice', 'bob']
Object.values(scores) // [90, 75]
Object.entries(scores) // [['alice', 90], ['bob', 75]]

const pairs = [
  ['x', 1],
  ['y', 2],
  ['z', 3],
]
const obj = Object.fromEntries(pairs)
// { x: 1, y: 2, z: 3 }

const user = { name: 'Alice', role: 'admin' }
 
for (const [key, value] of Object.entries(user)) {
  console.log(key, value)
}

const obj = { a: 1 }
 
Object.preventExtensions(obj) // can't add keys
Object.seal(obj) // can't add/delete
Object.freeze(obj) // can't add/delete/change values

const user = {}
Object.defineProperty(user, 'id', {
  value: 1,
  writable: false,
  enumerable: true,
  configurable: false,
})

const user = { profile: { name: 'Alice' } }
 
user.profile?.name // 'Alice'
user.address?.city // undefined
user.address?.city ?? 'Remote' // 'Remote'

const products = [
  { id: 'p1', name: 'Mug', categoryId: 'c1', price: 12.99, inStock: true },
  { id: 'p2', name: 'Book', categoryId: 'c2', price: 24.5, inStock: true },
  { id: 'p3', name: 'Pen', categoryId: 'c1', price: 2.99, inStock: false },
  { id: 'p4', name: 'Lamp', categoryId: 'c3', price: 45.0, inStock: true },
  { id: 'p5', name: 'Notebook', categoryId: 'c2', price: 8.5, inStock: true },
  { id: 'p6', name: 'Desk', categoryId: 'c3', price: 199.99, inStock: false },
]
 
const categories = { c1: 'Kitchen', c2: 'Stationery', c3: 'Furniture' }
 
const getCategoryName = (id) => categories[id] ?? 'Unknown'
const getCategoryIdByName = (name) => Object.entries(categories).find(([, n]) => n === name)?.[0]

const stationeryId = getCategoryIdByName('Stationery') // 'c2'
 
const stationeryProducts = products.filter((p) => p.categoryId === stationeryId)
// Book, Notebook

const labeled = products.map((p) => `${p.name} (${getCategoryName(p.categoryId)})`)

const highest = products.reduce((max, p) => (p.price > max.price ? p : max))
// Desk — 199.99

const hasOutOfStock = products.some((p) => !p.inStock)
// true

function filterByMinPrice(list, minPrice) {
  return list.filter((p) => p.price > minPrice)
}
 
filterByMinPrice(products, 20)
// Book, Lamp, Desk

const names = products.map((p) => p.name)

const totalInStock = products.filter((p) => p.inStock).reduce((sum, p) => sum + p.price, 0)
// 91.99

const hasCheap = products.some((p) => p.price < 5)
// true — Pen (2.99)

const notebook = products.find((p) => p.price === 8.5)

const byCategory = Object.groupBy(products, (p) => p.categoryId)
// { c1: [Mug, Pen], c2: [Book, Notebook], c3: [Lamp, Desk] }

const productsById = Object.fromEntries(products.map((p) => [p.id, p]))
 
productsById['p4'].name // 'Lamp'

function getProductDetails(id) {
  const product = productsById[id]
  if (!product) return null
  return {
    name: product.name,
    category: getCategoryName(product.categoryId),
  }
}

const withMarkup = products.map((p) => ({
  ...p,
  price: +(p.price * 1.1).toFixed(2),
}))

const countByCategory = products.reduce((acc, p) => {
  const name = getCategoryName(p.categoryId)
  acc[name] = (acc[name] ?? 0) + 1
  return acc
}, {})
// { Kitchen: 2, Stationery: 2, Furniture: 2 }

const labelMap = Object.fromEntries(
  products.map((p) => [p.id, { name: p.name, category: getCategoryName(p.categoryId) }]),
)
 
for (const [id, info] of Object.entries(labelMap)) {
  console.log(id, info.name, info.category)
}

function pick(obj, keys) {
  return Object.fromEntries(keys.filter((k) => k in obj).map((k) => [k, obj[k]]))
}
 
products.map((p) => pick(p, ['id', 'name', 'price']))

function omit(obj, keys) {
  const exclude = new Set(keys)
  return Object.fromEntries(Object.entries(obj).filter(([k]) => !exclude.has(k)))
}
 
products.map((p) => omit(p, ['inStock']))

function deepMerge(target, source) {
  const out = { ...target }
  for (const [key, value] of Object.entries(source)) {
    if (value && typeof value === 'object' && !Array.isArray(value) && target[key] && typeof target[key] === 'object') {
      out[key] = deepMerge(target[key], value)
    } else {
      out[key] = value
    }
  }
  return out
}
 
const defaults = { theme: 'light', settings: { fontSize: 14, bold: false } }
const overrides = { settings: { fontSize: 16 } }
 
deepMerge(defaults, overrides)
// { theme: 'light', settings: { fontSize: 16, bold: false } }

function shallowEqual(a, b) {
  if (Object.is(a, b)) return true
  if (!a || !b || typeof a !== 'object' || typeof b !== 'object') return false
  const keysA = Object.keys(a)
  const keysB = Object.keys(b)
  if (keysA.length !== keysB.length) return false
  return keysA.every((key) => Object.is(a[key], b[key]))
}

const categoryMap = new Map(Object.entries(categories))
categoryMap.get('c2') // 'Stationery'

const map = new Map()
map.set('name', 'Alice')
map.set(42, 'answer')
map.set({ id: 1 }, 'meta')
 
for (const [key, value] of map) {
  console.log(key, value)
}

const obj = { a: 1, b: 2 }
const map = new Map(Object.entries(obj))

const map = new Map([
  ['a', 1],
  ['b', 2],
])
const obj = Object.fromEntries(map)
// { a: 1, b: 2 }

const tags = ['js', 'web', 'js', 'api', 'web']
const unique = [...new Set(tags)]
// ['js', 'web', 'api']

const sentence = 'the cat and the dog'
const counts = {}
 
for (const word of sentence.split(' ')) {
  counts[word] = (counts[word] ?? 0) + 1
}
// { the: 2, cat: 1, and: 1, dog: 1 }

const personProto = {
  greet() {
    return `Hi, I'm ${this.name}`
  },
}
 
const user = Object.create(personProto)
user.name = 'Alice'
user.greet() // "Hi, I'm Alice"

// DOM node → metadata (object keys get coerced to strings)
const nodeData = new Map()
const el = document.createElement('div')
nodeData.set(el, { clicks: 0 }) // object as key works

function safeParse(json, fallback = null) {
  try {
    return JSON.parse(json)
  } catch {
    return fallback
  }
}
 
safeParse('{"a":1}') // { a: 1 }
safeParse('not json', {}) // {}