网页前端后台技巧(CSS+HTML)Web前端开发笔记

【JS】函数实参与形参

2020-01-09  本文已影响0人  德育处主任
微信订阅号:Rabbit_svip


本节目录

  1. 形参
  2. 实参
  3. arguments的特性
  4. arguments的非标准用法
  5. arguments小案例


1.形参

function test(x, y) {
  // todo...
}

上面的代码中,x和y就是形参。形参就是在函数定义时,声明的变量。
在JS中,函数定义并未指定函数形参的类型,甚至不检查形参的个数。

形参数量

function test(x, y) {
    console.log(test.length);
}
test(); // 输出2

通过 length 属性,可以输出形参的数量。


2.实参

function test(x, y) {
  // todo...
}

test(1, 2);

上面代码,第5行里的 1 和 2 就是函数的实参。

在JS中,函数定义并未指定函数形参的类型,函数调用也未对传入的实参值做任何类型检查,甚至实参的数量也没做太大限制。
因此会出现形参与实参数量不相等的情况。
在调用函数时,传入的实参比函数声明时定义的形参数量要少的时候,剩下的形参的值都为 undefined 。(实参比形参少,多出来的形参值都为undefined)。


3.arguments的特性。

当调用函数的时候,传入的实参数量大于函数定义时的形参数量,这种情况下是没办法直接获得未命名值的引用(实参比形参多)。

遇到上面所说的情况,可以用 arguments 这个标识符来解决。

let test = function (x, y) {
    console.log(arguments);
}

test(1, 2, 3, 4); 
// 输出Arguments(4) [1, 2, 3, 4, callee: ƒ, Symbol(Symbol.iterator): ƒ]

上面代码中,在函数体内用 arguments ,可以把传进来的实参都放在一个伪数组中。通过下标可以调用所有实参。

值得注意的是:arguments是伪数组。除了 length 属性外,数组的其他属性,arguments几乎是没有的!

arguments包含一个length属性,这个属性用来标识其所包含元素的个数。

最后还需要注意一点:ES6中箭头函数里是无法使用arguments的!!!


4.arguments的非标准用法

arguments除了定义了伪数组元素外,还定义了 callee 和 caller 属性。在ES5严格模式中,对着两个属性的读写操作都会产生一个类型错误。而在非严格模式下,ECMAScript标准规范定义callee属性指代当前正在执行的函数。caller是非标准的,但大多数浏览器都实现了这个属性,它指代调用当前正在执行的函数的函数。通过caller属性可以访问调用栈。

callee最常出现的地方是函数递归,就是函数自身调用自己。

var factorial = function(x) {
  if(x <= 1) return 1;
  return x * arguments.callee(x-1);
};


5.arguments小案例

求最大值。

function max() {
  var max = Number.NEGATIVE_INFINITY;
  for (var i = 0; i < arguments.length; i++) {
    if(arguments[i] > max) {
      max = arguments[i];
    }
  }
  return max;
}

console.log(max(1, 40, 1, 20, 6, 5)); // 输出 40
上一篇 下一篇

猜你喜欢

热点阅读