JavaScript 学习手册

免费学习 完整知识体系 快速检索

JavaScript学习手册《箭头函数与 this 绑定》:箭头函数(=>)提供更简洁的语法,并且不绑定自己的 `this`,`arguments`,`super` 或 `new.target`。 **语法:** ```javascript // 单个参数,单行返回 const square = ...

ES6+ 新特性

箭头函数与 this 绑定

【详细说明 & 代码示例】
箭头函数(=>)提供更简洁的语法,并且不绑定自己的 `this`,`arguments`,`super` 或 `new.target`。 **语法:** ```javascript // 单个参数,单行返回 const square = x => x * x; // 无参数 const hello = () => 'Hello'; // 多参数 const add = (a, b) => a + b; // 多行需花括号和 return const multiply = (a, b) => { const result = a * b; return result; }; ``` **this 绑定:** 箭头函数从定义时的外围作用域继承 `this`,而非根据调用方式。 ```javascript function Person(name) { this.name = name; this.greet = function() { setTimeout(function() { console.log(this.name); // this 指向 window(严格模式下为 undefined) }, 100); }; } // 修复:使用箭头函数 this.greet = function() { setTimeout(() => { console.log(this.name); // 正确指向 Person 实例 }, 100); }; ``` **不能用箭头函数作为构造函数(不能用 new),也没有 `prototype` 属性。**

学习提示:建议打开浏览器开发者工具(F12)中的 Console 面板,直接运行代码片段,实时查看输出,加深理解。

全部章节目录(共 48 个知识点)

JavaScript 基础 (1个知识点)

字符串 (1个知识点)

日期与时间 (1个知识点)

错误处理 (1个知识点)

BOM 操作 (1个知识点)

异步编程 (1个知识点)

Promise (1个知识点)

async/await (1个知识点)

Ajax 与请求 (1个知识点)

模块化 (1个知识点)

(1个知识点)

闭包 (1个知识点)

作用域 (1个知识点)

正则表达式 (1个知识点)

框架与库基础 (2个知识点)

使用说明

  • • 本手册涵盖 JavaScript 从基础到 ES6+ 及 Web API 的完整知识体系
  • • 在搜索框输入关键词,快速定位相关知识点
  • • 点击条目标题进入详情页,查看详细说明与代码示例
  • • 页面按分类展示所有知识点,方便系统性学习
  • • 建议打开浏览器开发者工具(F12)的 Console 面板运行代码,加深理解