javaScript中递归和arguments.callee知识点

最新推荐文章于 2023-05-24 11:35:50 发布

程宇寒

最新推荐文章于 2023-05-24 11:35:50 发布

阅读量245

点赞数

文章标签： javaScript js arguments 递归前端开发

本文链接：https://blog.csdn.net/czh500/article/details/115258862

版权

本文介绍了JavaScript中的arguments.callee属性及其在递归调用中的作用，探讨了其不被推荐使用的原因，主要是由于性能影响和闭包问题。同时，提供了两种替代方案，包括使用函数名引用和匿名函数的self调用。文章通过实例展示了这些概念，并提醒读者注意函数名变更可能带来的影响。

摘要由CSDN通过智能技术生成

【JavaScript】arguments.callee的作用及替换方案

arguments.callee的用法

javaScript中递归和arguments.callee

直接上代码和截图

运行结果如下：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>javaScript中递归和arguments.callee知识点</title>
<style type="text/css">
input[type=button] {
	background-color: #8E388E;
	border: 0px solid #8E388E;
	color: #fff;
	width: 160px;
	height: 40px;
	border-radius: 6px; /*把边框做成圆角*/
}

</style>
<script type="text/javascript">
/*
现在已经不推荐使用arguments.callee()；
原因：访问 arguments 是个很昂贵的操作，因为它是个很大的对象，每次递归调用时都需要重
新创建。影响现代浏览器的性能，还会影响闭包。
*/
  
function fn1() {
	console.log("我是fn1....");
}

var fn2 = fn1;

fn1 = function() {
	console.log("哈哈哈....");
}

fn2(); //我是fn1....

fn1(); //哈哈哈....

fn2(); //我是fn1....

console.log("************************");

function a(){
	console.log("a....");
}

a(); //a....

a = function() {
	console.log("go....");
}

a(); //go....

console.log("************************");


function factorial(number) {
/*
arguments为函数内部对象，包含传入函数的所有参数，arguments.callee代表函数名，多用于递
归调用，防止函数执行与函数名紧紧耦合的现象，对于没有函数名的匿名函数也非常起作用.
*/
	console.log("###", arguments, arguments[0]);
	if (number <= 1) {
		return 1;
	} else {
		//arguments.callee代表factorial(即自我调用，说白了就是递归)
		//现在已经不推荐使用arguments.callee()
		return number * arguments.callee(number - 1);
/*
如下这种写法也可以，但是坏处就是外面一旦把函数的名字改了，那么这里也要跟着改名字，说白了，就
是如下写法会造成耦合，不够灵活.
如果后面有和factorial函数同名的函数，那么如下的factorial函数会被后面的同名函数覆盖掉，
所以，使用arguments.callee这种写法更灵活
*/
// 		return number * factorial(number - 1);
	}
}

var trueFactorial = factorial;

factorial = function(){
    return 0;
}

//如果没有使用arguments.callee，将返回0
console.log(trueFactorial(5));//120

console.log(factorial(5));//0

console.log("****************");
//匿名函数的递归
//第一种写法
var result = (function(number) {
	if (number <= 1) {
		return 1;
	} else {
		return number * arguments.callee(number - 1);
	}
})(5);

console.log("***A***", result); //***A*** 120

console.log("****************");
//第二种写法
var result2 = (function(number) {
	if (number <= 1) {
		return 1;
	} else {
		return number * arguments.callee(number - 1);
	}
}(5));

console.log("***B***", result2); //***B*** 120

console.log("****************");

/*
在javaScript中，如果函数名相同、参数列表不同，不会构成函
数的重载，而是在最后的函数会覆盖掉前面的同名函数
*/
function fn66(parm) {
	console.log("****" + parm);
}

fn66("黄晓明"); //江西省赣州市于都县
fn66(); //江西省赣州市于都县

function fn66() {
	console.log("江西省赣州市于都县");
}

fn66("周杰伦"); //江西省赣州市于都县
fn66(); //江西省赣州市于都县

</script>
</head>
<body style="background-color: #CCE8CF;">
<h1>javaScript中递归和arguments.callee知识点</h1>
<input type="button" value="字符串的slice()函数">
<div id="div1" style="background-color: Wheat; height: 100%;">
</div>
</body>
</html>

希望大家可以举一反三，触类旁通！