图3.1.4JavaScript变量对象和数字一样，是JavaScript的一种数据类型，将在下一节详细介绍。如果按下F12打开浏览器控制台，我们可以看到变量variable的详细信息。图3.1.5声明多个变量虽然在一行内声明多个变量可以减少代码行数，但是一次只声明一个变量，代码会比较清晰。......
2023-11-08
JavaScript中this对象的含义及使用方法
【摘要】：this表示当前函数运行的上下文环境，也就是调用该函数的对象。图7.9.1this 指向 window调用函数getMaxNumber()时，this是全局对象window，在网页中显示this转换成字符串之后是"[object Window]"。图7.9.3this指向调用对象大部分情况下，只需要使用这两种形式访问this对象；少数情况下，可以通过特定方式修改this对象。图7.9.4使用apply()函数修改 this7.9.5.html调用函数的call()函数，传入指定参数并修改this对象，如下所示。
JavaScript本质上是基于原型链的面向对象编程语言。面向对象的编程语言有一个特色，它们的函数在运行时，内部有一个调用对象，用this表示。JavaScript的this关键字用来指向当前函数的调用对象。当函数进行简单调用时，this一般指向当前网页的window对象；当函数进行方法调用时，this指向拥有该函数的对象。
this表示当前函数运行的上下文环境，也就是调用该函数的对象。
1.this指向window
直接通过函数名调用函数时，浏览器会为函数绑定默认的this对象，即全局对象window。在这种情况下，因为this指向的对象都是同一个，所以基本不会操作this对象。
7.9.1.html在简单函数调用中访问this对象，如下所示。
动手写7.9.1
执行7.9.1.html，将this转换为字符串之后输出到网页，如下图所示。
图7.9.1 this 指向 window
调用函数getMaxNumber()时，this是全局对象window，在网页中显示this转换成字符串之后是"[object Window]"。
2.this指向调用对象
在函数运行时，面向对象编程语言的this指向的是当前封装的类的实例。在JavaScript中，主要有两种方式让this指向当前实例：
（1）使用new调用构造函数，this指向当前对象；
（2）使用对象调用函数，this指向当前对象。
7.9.2.html使用new操作符调用构造函数，并在构造函数中访问this对象，如下所示。
动手写7.9.2
执行7.9.2.html，将this转换为字符串之后输出到网页，如下图所示。
图7.9.2 this 指向当前对象
7.9.3.html调用对象的函数属性，如下所示。
动手写7.9.3
执行7.9.3.html，将this转换为字符串之后输出到网页，如下图所示。
(www.chuimin.cn)
图7.9.3 this指向调用对象
大部分情况下，只需要使用这两种形式访问this对象；少数情况下，可以通过特定方式修改this对象。
3.修改函数的调用对象
大部分的编程语言，在函数声明之后，this就不能修改了，但是JavaScript的this用法很灵活，允许通过多种方式修改函数运行时的this对象。主要有三种方式修改this对象：
（1）调用函数的apply()函数，传递参数数组，并修改this对象；
（2）调用函数的call()函数，传递指定参数，并修改this对象；
（3）将函数赋值给对象的属性，使用对象调用该函数。
在JavaScript中，所有函数都具有apply()、call()函数，调用这两个函数都可以实现函数调用；最后一种方式实际就是给对象设置函数属性。本节将介绍使用apply()、call()函数两种形式调用函数。
7.9.4.html调用函数的apply()函数，传入任意数量参数并修改this对象，如下所示。
动手写7.9.4
执行7.9.4.html，将this转换为字符串之后输出到网页，如下图所示。
图7.9.4 使用apply()函数修改 this
7.9.5.html调用函数的call()函数，传入指定参数并修改this对象，如下所示。
动手写7.9.5
执行7.9.5.html，将this转换为字符串之后输出到网页，如下图所示。
图7.9.5 使用call()函数修改this对象
apply()和call()函数达到的效果都一样，区别是前者可以传递任意数量的参数，后者必须传递指定数量的参数，因此在开发过程中会更多地使用call()修改this对象。
提示
在JavaScript中，函数运行时this指向的对象就是函数声明时所属的对象，但是可以通过apply()、call()等方式修改，因此this属于运行时绑定，这也是JavaScript动态性的一种表现。
有关零基础JavaScript从入门到精通的文章
- 详细阅读
-
JavaScript中的arguments对详细阅读
JavaScript函数内的特殊变量arguments是函数调用时所有参数的集合；通过arguments对象可以获取任意数量的参数，即使没有形参与之对应。arguments对象是一种类似数组的数据结构，但是没有数组操作的方法。动手写7.3.5执行7.3.5.html，输出arguments到网页，如下图所示。图7.3.5arguments对象使用arguments提高了函数编程的灵活性和容错性。arguments虽然不是关键字，但为了避免冲突，声明变量时不要使用arguments作为变量名。......
2023-11-08
-
JavaScript对象介绍及环形对象引发的详细阅读
图8.1.1对象介绍JavaScript的对象有以下三个特点：◇ 对象可以组织任意类型的数据。动手写8.1.3执行8.1.3.html，打开浏览器控制台，查看环形对象的结构，使用JSON.stringify()序列化环形对象时触发错误“Uncaught TypeError: Converting circular structure to JSON”，如下图所示。图8.1.3递归对象提示环形对象是一种无限循环结构，使用时要特别小心，避免出现不合理的递归访问，造成网页崩溃。......
2023-11-08
-
JavaScript对象属性详细阅读
document对象的属性包括网页节点、网页Cookie、文档标题、文档修改时间和文档关联信息等。表13.2.2document对象属性（续上表）13.2.2.html访问文档对象document的属性，如下所示。动手写13.2.2执行13.2.2.html，输出结果到网页，如下图所示。图13.2.2document对象属性◇ document.body表示文档
节点，从上到下解析HTML文档直至解析到标签之前，document.body都为null。......2023-11-08
-
电位器的型号、含义及使用方法详细阅读
表3.1-18电位器的型号命名及含义如图3.1-27所示，该电位器的型号为WXD3。图3.1-28电位器阻值变化与转角的关系曲线直线规律电位器适用于阻值均匀调节的场合，可作为分压器、限流器使用。......
2023-06-20
-
零基础JavaScript：对象方法详细阅读
表13.2.3document对象方法◇ document.getElementById，即使存在多个相同id，也返回第一个节点，从语义上不应该存在多个相同id。动手写13.2.3执行13.2.3.html，输出结果到网页，如下图所示。图13.2.3document对象方法HTMLCollection和NodeList并不是数组，只是和数组的数据结构类似，不具有数组相关方法，俗称伪数组。函数内部的arguments对象也属于伪数组。提示HTMLCollection使用时一般将其实例转换为数组，比如使用boldCollection=[].slice.call，转换成数组后，节点变化不再影响数组长度。......
2023-11-08
-
JavaScript中括号运算符的使用方法详细阅读
中括号运算符（[]）也属于存取运算符，可以实现点号运算符不支持的功能。图4.7.9中括号运算符点号运算符右侧必须是合法标识符，因此在表达式course.key中key就是属性的名称，但在表达式course[key]中变量key的值才是属性的名称，两者返回结果不一致。数组是一种特殊的对象，其索引全是数字，因此访问数组元素必须使用中括号运算符。动手写4.7.10执行4.7.10.html，输出数组元素到网页，如下图所示。......
2023-11-08
-
AutoCAD2012中文版教程：对象捕捉选详细阅读
“对象捕捉”选项卡如图3-13所示，“对象捕捉”工具栏如图3-14所示。启动对象捕捉功能的方法有以下3种。·通过状态栏上的“对象捕捉”按钮启动或禁止进行对象捕捉。·绘图过程中，在命令行输入对象捕捉的缩写。表3-1列出了对象捕捉各点的缩写及使用范围。但当直线绘制完成后，这两个点都会被认为是对象捕捉中的端点。圆弧也是一样，尽管提示的是起点和终点，但二者对于对象捕捉来说都是端点。·自动捕捉显示：显示对象捕捉名的标签。......
2023-10-21
相关推荐