前端面试 - JS总结 - ES6 (let, 箭头函数, this) 作用域 闭包

// 1. let 关键字：块级作用域，不可重复声明，不提升
{
  let a = 10;
  var b = 1;
 
  // let c = a; // 报错：Cannot access 'a' before initialization
  // let c = b; // 报错：Identifier 'b' has already been declared
}
 
// 2. 箭头函数：简洁语法，不绑定this，没有prototype属性，不能用作构造函数
const sum = (a, b) => a + b;
console.log(sum(1, 2)); // 输出：3
 
// 箭头函数中的this指向定义时所在作用域中的this
const obj = {
  name: 'John',
  greet: function() {
    console.log(`Hello, ${this.name}!`);
  },
  greetArrow: () => console.log(`Hello, ${this.name}!`)
};
 
obj.greet(); // 输出：Hello, John!
obj.greetArrow(); // 输出：Hello, [全局对象或者undefined]!，取决于上下文
 
// 3. 闭包：内部函数可以访问其外部函数的变量
function createCounter() {
  let count = 0;
  return function() {
    count++;
    console.log(count);
  };
}
 
const counter = createCounter();
counter(); // 输出：1
counter(); // 输出：2

在这个例子中，我们使用了let来声明变量，避免了使用var时可能出现的作用域提升和重复声明问题。同时，我们演示了箭头函数的简洁语法和它不同于普通函数的this绑定。最后，我们通过创建一个计数器函数来演示闭包的概念，内部函数可以访问外部函数的变量，并且这个变量在外部函数执行后并没有被销毁。