JavaScript-3.3-JavaScript 函数-函数中的内置对象_函数的内置参数对象-优快云博客

本文深入解析JavaScript函数中的内置对象arguments与this关键字，详细介绍了arguments对象如何存储实参列表，以及通过arguments.callee实现函数递归调用。同时，探讨了this关键字在不同调用上下文中指向的变化。

JavaScript-3.3-JavaScript 函数-函数中的内置对象

函数中的内置对象

函数中的内置对象

一：arguments 对象

arguments 是一个伪数组对象

1、arguments 对象用于存储函数的实参列表

arguments 对象得到第一个作用是保存在调用函数时所赋值的实参列表
当调用函数并使用实参赋值时，实际上参数已保存到 arguments 数组中
即使没有形参，也可以使用 argument[n] 的形式调用参数

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>arguments</title>
</head>
<body>
	<script type="text/javascript">
		function func(){
			// 不论是否有形参，都可以使用 arguments 对象取得实参列表所赋值的数据
			console.log(arguments[0]);
			console.log(arguments[1]);
			console.log(arguments[2]);
			console.log(arguments[3]); // 只有三个实参，读取第四个值为 Undefined
		}
		func(11,22,33);
	</script>
</body>
</html>

效果图
在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>arguments</title>
</head>
<body>
	<script type="text/javascript">
		function func(num1){
			// 实参赋值为 2019，打印arguments 第一个值为 10
			console.log(arguments[0]);
			// 将形参第一个值修改为 2020
			num1 = 2020;
			// 再次打印 arguments 第一个值，将与形参第一个值同步变化为 2020
			console.log(arguments[0]);
		}
		func(2019);
	</script>
</body>
</html>

效果图
在这里插入图片描述

注意
1.arguments 的个数是由实参决定的，不由形参决定
2.对于 arguments 和形参都存在的情况下，形参和 arguments 是同步的

2、使用 arguments.callee 表示当前函数的引用

arguments.callee() 可以调用自身函数执行
在函数内部调用函数自身的写法，称为递归

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>arguments.callee</title>
</head>
<body>
	<script type="text/javascript">
		var num=1;
		function func(){
			console.log(num);
			num++;
			/*
			当 num<=5时，函数递归调用本身
			表示调用函数自身，效果与 func() 相同
			*/
			if(num<=5){
				arguments.callee();
			}
		}
		func();
	</script>
</body>
</html>

效果图
在这里插入图片描述

二：this 关键字

this 关键字指向当前函数调用语句所在的作用域
谁调用函数，this 指向谁

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>this 关键字</title>
</head>
<body>
	<script type="text/javascript">
		function func(){
			/*
			直接使用函数名调用，相当于在 window 对象中调用函数
			this 指向 window 对象
			*/
			console.log(this);
		}
		func();
	</script>
</body>
</html>