JavaScript进阶6之函数式编程与ES6&ESNext规范

// 使用ES6的箭头函数简化代码
const add = (a, b) => a + b;
const subtract = (a, b) => a - b;
const multiply = (a, b) => a * b;
const divide = (a, b) => a / b;
 
// 使用模板字符串简化字符串拼接
const greet = name => `Hello, ${name}!`;
 
// 使用解构赋值简化参数获取
const printCoordinates = ({x, y}) => console.log(`Coordinates: (${x}, ${y})`);
 
// 使用rest参数简化参数处理
const sum = (...numbers) => numbers.reduce((total, num) => total + num, 0);
 
// 使用spread语法简化数组和对象的复制
const numbers = [1, 2, 3];
const cloneNumbers = [...numbers];
 
const person = { name: 'Alice', age: 25 };
const clonePerson = { ...person };
 
// 使用Promise和async/await简化异步代码
async function fetchUserData(userId) {
  try {
    const response = await fetch(`https://api.example.com/users/${userId}`);
    const user = await response.json();
    console.log(user);
  } catch (error) {
    console.error('Error fetching user data:', error);
  }
}
 
// 使用class和decorator简化面向对象编程
class MyClass {
  @log
  method() {
    console.log('This method has been logged.');
  }
}
 
function log(target, name, descriptor) {
  const originalMethod = descriptor.value;
  descriptor.value = function() {
    console.log(`Calling ${name} with arguments:`, arguments);
    originalMethod.apply(this, arguments);
  };
}
 
// 使用import和export简化模块导入和导出
// math.js
export function add(a, b) {
  return a + b;
}
export function subtract(a, b) {
  return a - b;
}
 
// main.js
import { add, subtract } from './math.js';
console.log(add(5, 3)); // 输出: 8
console.log(subtract(5, 3)); // 输出: 2

这个代码示例展示了如何使用ES6及其后续版本的特性来简化和优化JavaScript代码。箭头函数、模板字符串、解构赋值、rest参数、spread语法、Promise、async/await和装饰器都被用来改进代码质量和可读性。同时，这也演示了如何使用import和export来进行模块化管理。