arguments对象详解



在javascript中,函数是没有重载这一项的,所谓的重载,一个函数可以有多个,就是参数的个数和形式不同所以引用的功能不同,而js不存在函数重载,不管传不传参数,函数里面是否引用,关系都不大,一个函数对应一个功能,但是函数可以模拟函数重载,所以有一个Arguments对象。

定义

arguments是一个对应于传递给函数的参数的类数组对象。

类数组:是数组的形式,有length,但不具有数组的一切方法

描述

arguments对象是所有(非箭头)函数中都可用的局部变量。你可以使用arguments对象在函数中引用函数的参数。此对象包含传递给函数的每个参数,第一个参数在索引0处。

箭头函数没有arguments对象

arguments是函数中必有的对象,用来读取调用该函数的参数

function foo(){
    console.log(arguments[0])  // 1
    console.log(arguments[1])  // 2
    console.log(arguments[2])  // 3
}
foo(1,2,3)

arguments对象不是数组,但可以通过其他方式转化为数组,进而使用数组的方法。

var args = Array.prototype.slice.call(arguments)

var args = [].slice.call(arguments);

var args = Array.from(arguments)

var args = [...arguments]

function foo() {
    var f = Array.prototype.slice.call(arguments);
    // var f = [].slice.call(arguments);
    // var f = Array.from(arguments);
    // var f = [...arguments];
    console.log(f)  // [1,2,3]
    console.log(f instanceof Array) // true
}
foo(1, 2, 3)

属性

arguments既然是个对象,也有它的自带的属性。

  • length 长度,本次函数调用时传入函数的实参数量.

    • 表示的是实际上向函数传入了多少个参数,这个数字可以比形参数量大,也可以比形参数量小
    • 形参:全称“形参变量”,只有在被调用时才分配内存单元,在调用结束时,即刻释放所分配的内存单元。因此,形参只在函数内部有效。函数调用结束返回主调用函数后则不能再使用该形参变量。
    • 实参:全称为"实际参数"是在调用时传递给函数的参数. 实参可以是常量、变量、表达式、函数等, 无论实参是何种类型的量,在进行函数调用时,它们都必须具有确定的值, 以便把这些值传送给形参。 因此应预先用赋值,输入等办法使实参获得确定值。

      形参就是函数声明的参数,实参是函数调用的参数

    function foo(a,b){}  // a,b代表形参
    foo(1,2) // 1,2代表实参
  • callee 当前正在执行的函数
    • 可以用于引用该函数的函数体内当前正在执行的函数(类似于递归)
    • es5之后废弃,但不代表不使用这个callee了
    • callee可以使用在匿名递归函数中。
      • 匿名函数 (通过 函数表达式 或者 函数构造器 创建) 没有名称。因此如果没有可访问的变量指向该函数,唯一能引用它的方式就是通过 arguments.callee。
      function create() {
          return function (n) {
              if (n <= 1)
                  return 1;
              return n * arguments.callee(n - 1);
          };
      }
      
      var result = create()(5);
      console.log(result) // returns 120 (5 * 4 * 3 * 2 * 1)
      • 但不提倡使用callee来递归,最好形成有名函数,进而使用函数名递归。
      function create() {
          return function multiply(n) {
              if (n <= 1)
                  return 1;
              return n * multiply(n - 1);
          };
      }
      
      var result = create()(5);
      console.log(result) // returns 120 (5 * 4 * 3 * 2 * 1)
  • caller 指向调用当前函数的函数
    • 原先用在函数执行的时候调用自身
    • 已废弃,不能用
  • arguments[@@iterator] 返回一个新的Array迭代器对象,该对象包含参数中每个索引的值。
    • 这个意思就是可以调用for-of循环 - -!
    function add(){
        for(var i of arguments){
            console.log(i)   //1 2 3 4 5 6
        }
    }
    add(1,2,3,4,5,6)

    特殊点

    当arguments遇到剩余函数,解构赋值和默认参数的情况:

    • 在严格模式下,剩余参数、默认参数和解构赋值参数的存在不会改变 arguments对象的行为,
    "use strict"
    function func(...a) {
      a[0] = 11
      console.log(arguments);
    }
    func(1,2,3,4,5); // [1,2,3,4,5]
    function func1(a=4) {
      console.log(arguments);
    }
    func1(1); // [1]
    • 当非严格模式中的函数没有包含剩余参数、默认参数和解构赋值,那么arguments对象中的值会跟踪参数的值(反之亦然)
      function func(a) {
          arguments[0] = 99;   // 更新了arguments[0] 同样更新了a
          console.log(a);
      }
      func(10); // 99
      function func1(a) {
          a = 99;              // 更新了a 同样更新了arguments[0]
          console.log(arguments[0]);
      }
      func1(10); // 99
    • 当非严格模式中的函数有包含剩余参数、默认参数和解构赋值,那么arguments对象中的值不会跟踪参数的值(反之亦然)
      function func(a = 55) {
          arguments[0] = 99; // 更新了 arguments[0] 但没更新 a
          console.log(a);
      }
      func(10); // 10
      function func1(a = 55) {
          a = 99; // 更新了 a 但没更新arguments[0]
          console.log(arguments[0]);
      }
      func1(10); // 10
      function func2(a = 55) {
          console.log(arguments[0]);
      }
      func2(); // undefined

总结

前段时间看到arguments对象,不是很懂,所以抽空学习了一下。es6箭头函数的出现,arguments对象相对来说少用了,因为箭头函数没有arguments对象。再加上有一些属性都被遗弃。但是不能不学,所有的知识都是从底层创建出来的,了解底层知识是有好处的。

如果此文有什么不对的地方,欢迎评论私信,大家一起进步。我把我总结的知识点放到GitHub了,如果满意,给个star。

参考文献

MDN https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/arguments

原文地址:https://www.cnblogs.com/sqh17/p/10232185.html

时间: 2024-10-25 12:11:21

arguments对象详解的相关文章

JavaScript 对象详解

1 创建对象的方法 最常见的创建对象方法是通过new调用构造函数,此外还有一个方法就是使用Object.create(),将一个原型对象作为参数传递给Object.create也可以创建一个继承了其属性的新对象.但是和使用new创建对象还有一点差别,那就是构造函数不会被调用.所以如果使用这种方法创建一个foo新对象,其foo.f是undefined的: function Foo(z) { this.f = z; } Foo.prototype.add = function(x, y) { ret

JS变量对象详解

JS变量对象详解 开年之后工作热情一直不是很高,这几天一直处于消极怠工状态.早上不想起床,起床了不想上班.明明放假之前工作热情还一直很高,一直心心念念的想把小程序项目怼出来,结果休假回来之后画风完全不一样了.我感觉自己得了严重了节后综合征.还好撸了几篇文章,勉强表示这一周的时间没有完全浪费.这篇文章要给大家介绍的是变量对象. 在JavaScript中,我们肯定不可避免的需要声明变量和函数,可是JS解析器是如何找到这些变量的呢?我们还得对执行上下文有一个进一步的了解. 在上一篇文章中,我们已经知道

JS的window对象详解

一.说明 他是JS中最大的对象,它描述的是一个浏览器窗口,一般要引用他的属性和方法时,不需要用"Window.XXX"这种形式,而是直接使用"XXX".一个框架页面也是一个窗口. 二.Window窗口对象有如下属性 1.name 窗口的名称,由打开它的连接(<a target="...">)或框架页(<frame name="...">)或某一个窗口调用的 open() 方法(见下)决定.一般我们不会用

js中window对象详解以及页面跳转

js中window对象详解以及页面跳转 转自:http://www.makaidong.com/%E5%8D%9A%E5%AE%A2%E5%9B%AD%E6%90%9C/39219.shtml 1.window.top.window.location = "index.asp"; 2.window.top.location.href="index.asp" 3. window.top.location.replace("index.asp");

JS中的event 对象详解

JS中的event 对象详解 JS的event对象 Event属性和方法: 1. type:事件的类型,如onlick中的click: 2. srcElement/target:事件源,就是发生事件的元素: 3. button:声明被按下的鼠标键,整数,1代表左键,2代表右键,4代表中键,如果按下多个键,酒把这些值加起来,所以3就代表左右键同时按下:(firefox中 0代表左键,1代表中间键,2代表右键) 4. clientX/clientY:事件发生的时候,鼠标相对于浏览器窗口可视文档区域的

mvc-servlet---ServletConfig与ServletContext对象详解(转载)

ServletConfig与ServletContext对象详解 一.ServletConfig对象    在Servlet的配置文件中,可以使用一个或多个<init-param>标签为servlet配置一些初始化参数.(配置在某个servlet标签或者整个web-app下) 当servlet配置了初始化参数后,web容器在创建servlet实例对象时,会自动将这些初始化参数封装到ServletConfig对象中,并在 调用servlet的init方法时,将ServletConfig对象传递给

jQuery的deferred对象详解(转)

jQuery的开发速度很快,几乎每半年一个大版本,每两个月一个小版本. 每个版本都会引入一些新功能.今天我想介绍的,就是从jQuery 1.5.0版本开始引入的一个新功能----deferred对象. 这个功能很重要,未来将成为jQuery的核心方法,它彻底改变了如何在jQuery中使用ajax.为了实现它,jQuery的全部ajax代码都被改写了.但是,它比较抽象,初学者很难掌握,网上的教程也不多.所以,我把自己的学习笔记整理出来了,希望对大家有用. 本文不是初级教程,针对的读者是那些已经具备

JavaWeb学习(三)----JSP内置对象详解

[声明] 欢迎转载,但请保留文章原始出处→_→ 生命壹号:http://www.cnblogs.com/smyhvae/ 文章来源:http://www.cnblogs.com/smyhvae/p/4065790.html 联系方式:[email protected] [系列]JSP学习系列文章:(持续更新) JavaWeb学习(一)----JSP简介及入门(含Tomcat的使用) JavaWeb学习(二)----JSP脚本元素.指令元素.动作元素 JavaWeb学习(三)----JSP内置对象

jQuery的deferred对象详解(转)

jQuery的开发速度很快,几乎每半年一个大版本,每两个月一个小版本. 每个版本都会引入一些新功能.今天我想介绍的,就是从jQuery 1.5.0版本开始引入的一个新功能----deferred对象. 这个功能很重要,未来将成为jQuery的核心方法,它彻底改变了如何在jQuery中使用ajax.为了实现它,jQuery的全部ajax代码都被改写了.但是,它比较抽象,初学者很难掌握,网上的教程也不多.所以,我把自己的学习笔记整理出来了,希望对大家有用. 本文不是初级教程,针对的读者是那些已经具备