【JavaScript】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>
希望大家可以举一反三,触类旁通!