JavaScript ES6+ pokročilé techniky

JavaScript 📄 advanced-js.js

Pokročilé JavaScript ES6+ techniky: async generátory, Proxy, WeakMap, curry, memoization a Event Emitter

JavaScript ES6+ pokročilé techniky
// Async iterátory a generátory
async function* fetchDataGenerator(urls) {
  for (const url of urls) {
    try {
      const response = await fetch(url)
      const data = await response.json()
      yield { url, data, success: true }
    } catch (error) {
      yield { url, error: error.message, success: false }
    }
  }
}

// Použití async generátoru
const processUrls = async (urls) => {
  for await (const result of fetchDataGenerator(urls)) {
    console.log(`${result.url}: ${result.success ? "✓" : "✗"}`)
  }
}

// Proxy pro reaktivní objekty
const createReactiveObject = (target, onChange) => {
  return new Proxy(target, {
    set(obj, prop, value) {
      const oldValue = obj[prop]
      obj[prop] = value
      if (oldValue !== value) {
        onChange(prop, value, oldValue)
      }
      return true
    },
    get(obj, prop) {
      return obj[prop]
    }
  })
}

// WeakMap pro private data
const privateData = new WeakMap()

class SecureUser {
  constructor(name, email) {
    privateData.set(this, { name, email, id: Math.random() })
  }
  
  getName() {
    return privateData.get(this).name
  }
  
  getEmail() {
    return privateData.get(this).email
  }
  
  getId() {
    return privateData.get(this).id
  }
}

// Promise utility s retry logikou
const fetchWithRetry = async (url, options = {}, maxRetries = 3) => {
  const { retryDelay = 1000, ...fetchOptions } = options
  
  for (let i = 0; i <= maxRetries; i++) {
    try {
      const response = await fetch(url, fetchOptions)
      if (!response.ok) throw new Error(`HTTP ${response.status}`)
      return response
    } catch (error) {
      if (i === maxRetries) throw error
      
      // Exponential backoff
      await new Promise(resolve => 
        setTimeout(resolve, retryDelay * Math.pow(2, i))
      )
    }
  }
}

// Currying pro funkcionální programování
const curry = (fn) => {
  return function curried(...args) {
    if (args.length >= fn.length) {
      return fn.apply(this, args)
    } else {
      return function(...args2) {
        return curried.apply(this, args.concat(args2))
      }
    }
  }
}

// Příklad použití curry
const add = curry((a, b, c) => a + b + c)
const addFive = add(5)
const addFiveAndTen = addFive(10)
console.log(addFiveAndTen(3)) // 18

// Memoization pro optimalizaci
const memoize = (fn) => {
  const cache = new Map()
  return (...args) => {
    const key = JSON.stringify(args)
    if (cache.has(key)) {
      return cache.get(key)
    }
    const result = fn(...args)
    cache.set(key, result)
    return result
  }
}

// Event Emitter pattern
class EventEmitter {
  constructor() {
    this.events = new Map()
  }
  
  on(event, listener) {
    if (!this.events.has(event)) {
      this.events.set(event, [])
    }
    this.events.get(event).push(listener)
    
    // Return unsubscribe function
    return () => this.off(event, listener)
  }
  
  off(event, listener) {
    if (!this.events.has(event)) return
    
    const listeners = this.events.get(event)
    const index = listeners.indexOf(listener)
    if (index > -1) {
      listeners.splice(index, 1)
    }
  }
  
  emit(event, ...args) {
    if (!this.events.has(event)) return
    
    this.events.get(event).forEach(listener => {
      try {
        listener(...args)
      } catch (error) {
        console.error(`Error in event listener:`, error)
      }
    })
  }
}

Gist information

ID:#18
Language:JavaScript
File:advanced-js.js
Created:
Likes:0