JavaScript中的this指向完全解析:7步口诀助你掌握
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
"这篇文档详细解析了JavaScript中的`this`指向问题,并提供了一个7步口诀来帮助理解和记忆。口诀包括箭头函数、new关键字、bind方法、apply和call方法、对象方法调用、直接函数调用以及不在函数内部的情况。文档中还包含了大量的示例代码和练习题,旨在通过实际操作加深理解。" JavaScript中的`this`指向是一个关键概念,往往让初学者感到困惑。根据提供的口诀,我们可以逐个解析: 1. 箭头函数: 箭头函数不拥有自己的`this`,它会捕获其所在(即定义时)上下文的`this`值。这意味着箭头函数不能作为构造函数,也不能使用`new`关键字,否则会抛出错误。例如: ```javascript func = () => {} new func() // 抛出错误 ``` 2. new关键字: 当使用`new`关键字调用函数时,函数内部的`this`会被设置为新创建的对象。例如: ```javascript function Foo() { console.log(this); } new Foo(); // 新创建的对象 ``` 3. bind方法: `bind`可以用来设置函数的`this`值。一旦`bind`被调用,返回的新函数的`this`将被固定,不受后续调用的影响。例如: ```javascript function func() { console.log(this); } boundFunc = func.bind(1); boundFunc(); // 1 ``` 4. apply和call方法: 这两个方法都可以用来改变函数的`this`值,并且可以传递参数。`apply`接受一个数组或类数组对象作为参数,`call`则接受逗号分隔的参数列表。然而,箭头函数中`this`不会被这两个方法改变。例如: ```javascript func = () => { console.log(this); } func.apply(1); // 取决于外层`this` ``` 5. 对象方法调用(欧比届点,`obj.`): 当函数是对象的一个属性并以`.`方式调用时,`this`会指向该对象。例如: ```javascript obj = { method: function() { console.log(this); } }; obj.method(); // 对象`obj` ``` 6. 直接调用: 如果函数不是对象的方法,而是独立调用,那么`this`将默认指向全局对象(在浏览器环境中是`window`)。例如: ```javascript function func() { console.log(this); } func(); // 全局对象 ``` 7. 不在函数里: 在某些情况下,如IIFE(立即执行函数表达式)或者事件处理程序,`this`的值取决于具体环境。 通过学习和实践这些规则,开发者可以更好地理解和预测JavaScript中的`this`指向。文档末尾的练习题是巩固这些知识的好方式。
![](https://csdnimg.cn/release/download_crawler_static/72043054/bg1.jpg)
下载后可阅读完整内容,剩余8页未读,立即下载
![docx](https://img-home.csdnimg.cn/images/20210720083331.png)
![docx](https://img-home.csdnimg.cn/images/20210720083331.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://profile-avatar.csdnimg.cn/default.jpg!1)
- 粉丝: 0
- 资源: 1万+
我的内容管理 展开
我的资源 快来上传第一个资源
我的收益
登录查看自己的收益我的积分 登录查看自己的积分
我的C币 登录后查看C币余额
我的收藏
我的下载
下载帮助
![](https://csdnimg.cn/release/wenkucmsfe/public/img/voice.245cc511.png)
最新资源
- 解决Eclipse配置与导入Java工程常见问题
- 真空发生器:工作原理与抽吸性能分析
- 爱立信RBS6201开站流程详解
- 电脑开机声音解析:故障诊断指南
- JAVA实现贪吃蛇游戏
- 模糊神经网络实现与自学习能力探索
- PID型模糊神经网络控制器设计与学习算法
- 模糊神经网络在自适应PID控制器中的应用
- C++实现的学生成绩管理系统设计
- 802.1D STP 实现与优化:二层交换机中的生成树协议
- 解决Windows无法完成SD卡格式化的九种方法
- 软件测试方法:Beta与Alpha测试详解
- 软件测试周期详解:从需求分析到维护测试
- CMMI模型详解:软件企业能力提升的关键
- 移动Web开发框架选择:jQueryMobile、jQTouch、SenchaTouch对比
- Java程序设计试题与复习指南
![](https://img-home.csdnimg.cn/images/20220527035711.png)
![](https://img-home.csdnimg.cn/images/20220527035111.png)
![](https://csdnimg.cn/release/wenkucmsfe/public/img/green-success.6a4acb44.png)