// 增刪元素示例
const fruits = ['apple', 'banana'];

// 添加元素
fruits.push('orange'); // ['apple', 'banana', 'orange']
fruits.unshift('kiwi'); // ['kiwi', 'apple', 'banana', 'orange']

// 刪除元素
fruits.pop(); // ['kiwi', 'apple', 'banana']
fruits.shift(); // ['apple', 'banana']

// 添加：在索引1處刪除0個(gè)元素，添加2個(gè)元素
fruits.splice(1, 0, 'mango', 'grape'); 
// ['apple', 'mango', 'grape', 'banana']

// 刪除：從索引2開(kāi)始刪除1個(gè)元素
fruits.splice(2, 1); // ['apple', 'mango', 'banana']

// 替換：將索引1處的元素替換為指定元素
fruits.splice(1,1,'orange'); //['apple', 'orange', 'banana']

// 查找與訪問(wèn)示例
const numbers = [5, 12, 8,12, 130, 44];

// 基本查找
numbers.indexOf(12); // 1
numbers.lastIndexOf(12); // 3
numbers.includes(130); // true

// 條件查找
const found = numbers.find(num => num > 10); // 12
const foundIndex = numbers.findIndex(num => num > 100); // 4

// 安全訪問(wèn)
numbers.at(1); // 12
numbers.at(-1); // 44（最后一個(gè)元素）

// 迭代與轉(zhuǎn)換示例
const numbers = [1, 2, 3, 4];

// 遍歷
numbers.forEach(num => console.log(num * 2)); // 2, 4, 6, 8

// 轉(zhuǎn)換
const doubled = numbers.map(num => num * 2); // [2, 4, 6, 8]
const evens = numbers.filter(num => num % 2 === 0); // [2, 4]

// 聚合
const sum = numbers.reduce((acc, curr) => acc + curr, 0); // 10

// 扁平化
const nested = [1, [2, 3], [4, [5]]];
nested.flat(); // [1, 2, 3, 4, [5]]
nested.flat(2); // [1, 2, 3, 4, 5]

// 先map后扁平化
const phrases = ["hello world", "goodbye moon"];
const words = phrases.flatMap(phrase => phrase.split(" ")); 
// ["hello", "world", "goodbye", "moon"]

// 排序與操作示例
const fruits = ['banana', 'apple', 'cherry'];

// 排序
fruits.sort(); // ['apple', 'banana', 'cherry']（字典序）

// 自定義排序
const numbers = [40, 100, 1, 5, 25];
numbers.sort((a, b) => a - b); // [1, 5, 25, 40, 100]
numbers.sort((a, b) => b - a); // [100, 40, 25, 5, 1]

// 反轉(zhuǎn)
fruits.reverse(); // ['cherry', 'banana', 'apple']

// 切片
const sliced = fruits.slice(1, 3); // ['banana', 'apple']
const sliced1 = fruits.slice(1); // ['banana', 'apple']
const sliced2 = fruits.slice(-1); // ['apple']

// 連接
const moreFruits = fruits.concat(['orange', 'kiwi']); 
// ['cherry', 'banana', 'apple', 'orange', 'kiwi']
const moreFruits1 = fruits.concat(‘mengo'); 
// ['cherry', 'banana', 'apple', 'orange', 'kiwi'，'mengo']

// 連接為字符串
fruits.join(' and '); // 'cherry and banana and apple'

// 其他方法示例
const ages = [32, 33, 16, 40];

// 檢查
ages.every(age => age > 18); // false
ages.some(age => age > 18); // true

// 填充
const emptyArray = new Array(3);
emptyArray.fill('default'); // ['default', 'default', 'default']

// 復(fù)制內(nèi)部元素到target位置
const arr = [1, 2, 3, 4, 5];
arr.copyWithin(0, 3, 5); // [4, 5, 3, 4, 5]（將索引3-5復(fù)制到索引0）

// 類型檢查
Array.isArray(arr); // true
Array.isArray({}); // false

// 對(duì)象操作示例
const person = { name: 'Alice', age: 30 };

// 合并對(duì)象
const job = { title: 'Developer' };
const merged = Object.assign({}, person, job); 
// { name: 'Alice', age: 30, title: 'Developer' }

// 獲取鍵、值、條目
Object.keys(person); // ['name', 'age']
Object.values(person); // ['Alice', 30]
Object.entries(person); // [['name', 'Alice'], ['age', 30]]

//檢查對(duì)象是否有置頂屬性
Object.hasOwn(person,'name'); //true

// 凍結(jié)對(duì)象
Object.freeze(person);
person.age = 31; // 靜默失?。▏?yán)格模式下報(bào)錯(cuò)）

// 密封對(duì)象
Object.seal(person);
person.location = 'Paris'; // 不能添加新屬性
delete person.name; // 不能刪除屬性

// 屬性與原型操作
const obj = {};

// 定義屬性
Object.defineProperty(obj, 'id', {
  value: 1,
  writable: false, // 不可寫
  enumerable: true, // 可枚舉
  configurable: false // 不可配置
});

// 獲取屬性描述符
const descriptor = Object.getOwnPropertyDescriptor(obj, 'id');
// { value: 1, writable: false, enumerable: true, configurable: false }

// 原型操作
const parent = { greet() { return 'Hello'; } };
const child = Object.create(parent); // 創(chuàng)建繼承parent的對(duì)象
Object.getPrototypeOf(child) === parent; // true

// 設(shè)置原型
const newProto = { bye() { return 'Goodbye'; } };
Object.setPrototypeOf(child, newProto);
child.bye(); // 'Goodbye'

// 其他對(duì)象方法
// 精確比較
Object.is(NaN, NaN); // true（不同于 ===）
Object.is(0, -0); // false（不同于 ===）

// 從鍵值對(duì)創(chuàng)建對(duì)象
const entries = [['name', 'Bob'], ['age', 25]];
const newObj = Object.fromEntries(entries); 
// { name: 'Bob', age: 25 }

// 檢查對(duì)象是否在原型鏈中
Array.prototype.isPrototypeOf([]); // true

// 檢查自身屬性
Object.hasOwn(newObj, 'name'); // true
Object.hasOwn(newObj, 'toString'); // false（繼承屬性）

// 防止擴(kuò)展
Object.preventExtensions(newObj);
newObj.location = 'London'; // 靜默失?。▏?yán)格模式下報(bào)錯(cuò)）

//按條件分組對(duì)象數(shù)組
const inventory = [
  { name: 'asparagus', type: 'vegetables' },
  { name: 'bananas', type: 'fruit' },
  { name: 'goat', type: 'meat' }
];

// 分組
const grouped = Object.groupBy(inventory, ({ type }) => type);
/*
{
  vegetables: [{name:'asparagus', type:'vegetables'}],
  fruit: [{name:'bananas', type:'fruit'}],
  meat: [{name:'goat', type:'meat'}]
}
*/

// 深拷貝
const original = { a: 1, b: { c: 2 } };
const arr = [1,2,[3,4,[55]]];
const copy = structuredClone(original);  // { a: 1, b: { c: 2 } }
const copyArr = structuredClone(arr);   // [1,2,[3,4,[55]]]

// 1. 避免在循環(huán)中創(chuàng)建函數(shù)
// 差
const results = data.map(item => {
  return processItem(item); // 每次迭代創(chuàng)建新函數(shù)
});

// 優(yōu)
function process(item) { /*...*/ }
const results = data.map(process);

// 2. 減少不必要的中間數(shù)組
// 差
const filtered = array.filter(x => x > 10);
const result = filtered.map(x => x * 2);

// 優(yōu)
const result = array.reduce((acc, x) => {
  if (x > 10) acc.push(x * 2);
  return acc;
}, []);

// 3. 大數(shù)據(jù)集使用TypedArray
const largeData = new Float64Array(1000000);

// 1. 工廠模式
function createUser(name) {
  return Object.assign(Object.create(userProto), {
    name,
    createdAt: new Date()
  });
}

// 2. 組合模式
const canEat = { eat() { /*...*/ } };
const canWalk = { walk() { /*...*/ } };
function createPerson(name) {
  return Object.assign({ name }, canEat, canWalk);
}

// 3. 觀察者模式
function createObservable(target) {
  return new Proxy(target, {
    set(obj, prop, value) {
      console.log(`Property ${prop} changed`);
      obj[prop] = value;
      return true;
    }
  });
}

const numbers = [3, 1, 2, 3, 4, 2, 5, 1];

// 方法1: Set + 展開(kāi)運(yùn)算符
const unique1 = [...new Set(numbers)].sort((a, b) => a - b);

// 方法2: filter + indexOf
const unique2 = numbers
  .filter((num, index) => numbers.indexOf(num) === index)
  .sort((a, b) => b - a); // 降序

// 方法3: reduce
const unique3 = numbers.reduce((acc, num) => {
  if (!acc.includes(num)) acc.push(num);
  return acc;
}, []).sort((a, b) => a - b);

console.log(unique1); // [1, 2, 3, 4, 5]
console.log(unique2); // [5, 4, 3, 2, 1]
console.log(unique3); // [1, 2, 3, 4, 5]

function deepMerge(target, ...sources) {
  if (!sources.length) return target;
  const source = sources.shift();

  if (isObject(target) && isObject(source)) {
    for (const key in source) {
      if (isObject(source[key])) {
        if (!target[key]) Object.assign(target, { [key]: {} });
        deepMerge(target[key], source[key]);
      } else {
        Object.assign(target, { [key]: source[key]);
      }
    }
  }
  
  return deepMerge(target, ...sources);
}

function isObject(item) {
  return item && typeof item === 'object' && !Array.isArray(item);
}

// 使用示例
const defaultConfig = {
  api: { baseURL: '/api', timeout: 30000 },
  logging: { level: 'info' }
};

const userConfig = {
  api: { baseURL: 'https://api.example.com' },
  features: { analytics: true }
};

const mergedConfig = deepMerge({}, defaultConfig, userConfig);
/*
{
  api: { baseURL: 'https://api.example.com', timeout: 30000 },
  logging: { level: 'info' },
  features: { analytics: true }
}
*/

// 從API獲取的數(shù)據(jù)
const apiResponse = [
  { id: 1, name: 'Alice', department: 'HR', salary: 60000 },
  { id: 2, name: 'Bob', department: 'IT', salary: 80000 },
  { id: 3, name: 'Charlie', department: 'IT', salary: 75000 }
];

// 1. 獲取IT部門員工
const itEmployees = apiResponse.filter(emp => emp.department === 'IT');

// 2. 計(jì)算IT部門平均薪資
const totalSalary = itEmployees.reduce((sum, emp) => sum + emp.salary, 0);
const avgSalary = totalSalary / itEmployees.length;

// 3. 轉(zhuǎn)換為名稱-薪資映射
const salaryMap = Object.fromEntries(
  itEmployees.map(emp => [emp.name, emp.salary])
);
// { Bob: 80000, Charlie: 75000 }

// 4. 按薪資排序
const sortedEmployees = [...itEmployees].sort((a, b) => b.salary - a.salary);

// 表單數(shù)據(jù)轉(zhuǎn)換為對(duì)象
function formDataToObject(formElement) {
  const formData = new FormData(formElement);
  return Object.fromEntries(formData.entries());
}

// 使用示例
const form = document.querySelector('#userForm');
const userData = formDataToObject(form);
// { name: 'Alice', email: 'alice@example.com', ... }

// 驗(yàn)證表單數(shù)據(jù)
function validateFormData(data) {
  const errors = {};
  
  if (!data.name) errors.name = 'Name is required';
  if (!data.email.includes('@')) errors.email = 'Invalid email format';
  
  return Object.keys(errors).length ? errors : null;
}

// 購(gòu)物車狀態(tài)管理
const cartState = {
  items: [
    { id: 1, name: 'Laptop', price: 999, quantity: 1 },
    { id: 2, name: 'Mouse', price: 25, quantity: 2 }
  ],
  discount: 0.1
};

// 添加商品
function addToCart(item) {
  const existingItem = cartState.items.find(i => i.id === item.id);
  
  if (existingItem) {
    return {
      ...cartState,
      items: cartState.items.map(i => 
        i.id === item.id 
          ? { ...i, quantity: i.quantity + 1 } 
          : i
      )
    };
  } else {
    return {
      ...cartState,
      items: [...cartState.items, { ...item, quantity: 1 }]
    };
  }
}

// 計(jì)算總價(jià)
function calculateTotal(cart) {
  return cart.items.reduce(
    (total, item) => total + (item.price * item.quantity), 0
  ) * (1 - cart.discount);
}

// 深度凍結(jié)對(duì)象（不可變狀態(tài)）
function deepFreeze(obj) {
  Object.freeze(obj);
  
  Object.getOwnPropertyNames(obj).forEach(prop => {
    if (obj[prop] !== null &&
        typeof obj[prop] === 'object' &&
        !Object.isFrozen(obj[prop])) {
      deepFreeze(obj[prop]);
    }
  });
  
  return obj;
}

// 扁平化嵌套對(duì)象
function flattenObject(obj, prefix = '') {
  return Object.entries(obj).reduce((acc, [key, value]) => {
    const prefixedKey = prefix ? `${prefix}.${key}` : key;
    
    if (typeof value === 'object' && value !== null && !Array.isArray(value)) {
      Object.assign(acc, flattenObject(value, prefixedKey));
    } else {
      acc[prefixedKey] = value;
    }
    
    return acc;
  }, {});
}

// 使用示例
const nestedObj = {
  user: {
    name: 'Alice',
    address: {
      city: 'Paris',
      country: 'France'
    }
  },
  roles: ['admin', 'editor']
};

const flatObj = flattenObject(nestedObj);
/*
{
  'user.name': 'Alice',
  'user.address.city': 'Paris',
  'user.address.country': 'France',
  'roles': ['admin', 'editor']
}
*/