ES6新特性：let/const与箭头函数解析

"这篇资源主要介绍了ES6中的两个重要特性：新的变量声明方式（let/const）以及箭头函数的使用。" 在ES6中，`let` 和 `const` 的引入是为了解决`var`声明变量的一些问题，如变量提升和全局作用域。`let` 提供了块级作用域，这意味着变量只在其所在的代码块内有效，而不是整个函数或全局作用域。例如： ```javascript if (true) { let x = 10; } console.log(x); // Uncaught ReferenceError: x is not defined ``` 在上面的例子中，`x` 只在`if`语句块内部可见，尝试在外部访问它会导致错误。这与`var`不同，`var`声明的变量会在其最近的函数作用域内提升到顶部。 `const`同样提供块级作用域，但关键区别在于，它用于声明不可变的常量。一旦赋值，就不能更改： ```javascript const pi = 3.14; pi = 3; // TypeError: Assignment to constant variable. ``` 然而，对于引用数据类型（如对象和数组），`const`只保证引用的不变性，而非值的不变性： ```javascript const person = { name: 'Alice' }; person.name = 'Bob'; // 可以修改对象属性 console.log(person); // {name: "Bob"} person = { name: 'Charlie' }; // 错误，不能重新赋值 ``` 理解这些特性有助于避免一些常见的JavaScript陷阱，尤其是在面试中。 接下来，资源提到了箭头函数，这是ES6中另一种重要的语法糖。箭头函数的语法简洁，且其`this`的行为不同于普通函数。在箭头函数中，`this`被绑定到定义时所在的作用域，而不是调用时的作用域。这意味着你不能像在普通函数中那样使用`call`, `apply`或`bind`来改变`this`的指向： ```javascript const obj = { name: 'Alice', sayName: function() { console.log(this.name); }, arrowSayName: () => { console.log(this.name); // 在箭头函数中，this指向外层作用域 } }; obj.sayName(); // Alice (obj.arrowSayName)(); // undefined，因为this指向全局作用域（在浏览器中是window） ``` 由于箭头函数的`this`特性，它们在React等框架中特别有用，因为它们可以在回调函数和事件处理程序中保持正确的上下文。但是，需要注意的是，如果需要控制`this`的指向，应避免使用箭头函数。 总结来说，`let`和`const`提供了更好的作用域管理和常量定义，而箭头函数则简化了函数表达式的编写并改变了`this`的行为。理解这些概念对于现代JavaScript开发至关重要。