js中arguments对象的深入理解


Posted in Javascript onMay 14, 2019

前言

在JavaScript中,arguments属于当前对象的一个内置属性,arguments非常类似于Array对象,但是又不是实例的Array。本文主要给大家介绍了关于js中arguments对象的相关内容,下面话不多说了,来一起看看详细的介绍吧

一、在函数调用的时候,浏览器每次都会传递进两个隐式参数

  • 函数的上下文对象this
  • 封装实参的对象arguments

二、arguments 对象

  • arguments 对象实际上是所在函数的一个内置类数组对象
  • 每个函数都有一个arguments属性,表示函数的实参集合,这里的实参是重点,就是执行函数时实际传入的参数的集合。arguments不是数组而是一个对象,但它和数组很相似,所以通常称为类数组对象,以后看到类数组其实就表示arguments。arguments对象不能显式的创建,它只有在函数开始时才可用。
  • arguments还有属性callee,length和迭代器Symbol。
  • arguments同样具有length属性,arguments.length 为函数实参个数,可以用arguments[length]显示调用参数
  • arguments对象可以检测参数个数,模拟函数重载

三、理解点

第一点:arguments对象:可以在函数内访问所有的参数,实参

    实例代码:

function f1(){
  console.log(arguments[0]);
  console.log(arguments[1]);
  console.log(arguments[2]);
 }

 f1(12,23,45); //12 34 45

第二点:在正常的模式下,arguments对象可以在运行的时候进行修改

    实例代码:

function f2(a,b){
  arguments[0] = 10;
  arguments[1] = 20;
  return a + b;
 }

 console.log(f2(4,6)); //30

第三点:在严格的模式下,arguments对象在运行的时候不可以修改,修改arguments对象不会影响到实际的函数参数

    注意:  'use strict' 是开启严格模式

    实例代码:

function f3(a,b){
  'use strict';
  arguments[0] = 10;
  arguments[1] = 20;
  return a + b;
 }

 console.log(f3(3,6)); //9

第四点:通过arguments对象的length属性,可以判断实参的个数

    实例代码:

function f4(){
  console.log(arguments.length);
 }

 f4(2,3,4,5); //4
 f4(1);  //1
 f4();  //0

第五点:arguments是一个对象,不是数组,转换为数组可以采用 slice 和 逐一填入新数组

    实例代码:

var arr = Array.prototype.slice.call(arguments);
  console.log(typeof arr);

  var arr2 = [];
  for(var i = 0; i<arguments.length;i++){
   arr2.push(arguments[i]);
  }
  console.log(typeof arr2);

第六点:arguments的callee属性可以返回对应的原函数,达到调用自身函数的效果,但是在严格模式中是不适用的

    实例代码:

var f5 = function(){
   console.log(arguments.callee===f5); //true
   console.log(arguments.callee===f6); //false
  }
  
  var f6;
  f5(); //返回原函数,调用自身

四、arguments的应用

第一点:arguments.callee为引用函数自身。我们可以借用arguments.length可以来查看实参和形参的个数是否一致

    实例代码:

function add(a, b) { 

 var realLen = arguments.length; 
 console.log("realLen:", arguments.length); 
 var len = add.length; 
 console.log("len:", add.length); 

 if (realLen == len) { 
 console.log('实参和形参个数一致'); 
 } else { 
 console.log('实参和形参个数不一致'); 
 } 

}; 

add(11,22,33,44,66);

第二点:我们可以借用arguments.callee来让匿名函数实现递归

    实例代码:

var sum = function(n) { 

 if(n == 1) { 
  return 1; 
 } else { 
  return n + arguments.callee(n-1); 
  } 
 } 

console.log("sum =", sum(5));

第三点:编写一个函数求传入的若干个数字(不能用数组显示传入)的和

    实例代码:

function add() { 

var len = arguments.length; 
var sum = 0; 

for (var i = 0; i < len; ++i) { 
  sum += arguments[i]; 
} 
return sum; 
}; 

add(11,22,33,44,66);

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
JS判断两个时间大小的示例代码
Jan 28 Javascript
html的DOM中document对象anchors集合用法实例
Jan 21 Javascript
Bootstrap表单Form全面解析
Jun 13 Javascript
浅析$(function) ready和onload 的区别
Sep 03 Javascript
Javascript 创建类并动态添加属性及方法的简单实现
Oct 20 Javascript
js提示框替代系统alert,自动关闭alert对话框的实现方法
Nov 07 Javascript
React入门教程之Hello World以及环境搭建详解
Jul 11 Javascript
Servlet3.0与纯javascript通过Ajax交互的实例详解
Mar 18 Javascript
深入理解Vue.js轻量高效的前端组件化方案
Dec 10 Javascript
JS实现根据数组对象的某一属性排序操作示例
Jan 14 Javascript
微信小程序tab切换可滑动切换导航栏跟随滚动实现代码
Sep 04 Javascript
JS实现密码框效果
Sep 10 Javascript
ios中视频的最后一桢问题解决
May 14 #Javascript
详解可以用在VS Code中的正则表达式小技巧
May 14 #Javascript
vue项目中引入vue-datepicker插件的详解
May 14 #Javascript
JQuery获取可视区尺寸和文档尺寸及制作悬浮菜单示例
May 14 #jQuery
JavaScript中this的全面解析及常见实例
May 14 #Javascript
jquery 验证用户名是否重复代码实例
May 14 #jQuery
记录vue项目中遇到的一点小问题
May 14 #Javascript
You might like
php5.5中类级别的常量使用介绍
2013/10/02 PHP
增强的 JavaScript 的 trim 函数的代码
2007/08/13 Javascript
javascript 处理HTML元素必须避免使用的一种方法
2009/07/30 Javascript
js字符串的各种格式的转换 ToString,Format
2011/08/08 Javascript
基于JQuery模仿苹果桌面的Dock效果(初级版)
2012/10/15 Javascript
JS延迟加载加快页面打开速度示例代码
2013/12/30 Javascript
JavaScript AJAX之惰性载入函数
2014/08/27 Javascript
avalonjs制作响应式瀑布流特效
2015/05/06 Javascript
Javascript随机标签云代码实例
2016/06/21 Javascript
详解nodejs 文本操作模块-fs模块(五)
2016/12/23 NodeJs
socket.io实现在线群聊功能
2017/04/07 Javascript
Vue.js 使用v-cloak后仍显示变量的解决方法
2018/11/19 Javascript
Vue匿名插槽与作用域插槽的合并和覆盖行为
2019/04/22 Javascript
js实现类似iphone的网页滑屏解锁功能示例【附源码下载】
2019/06/10 Javascript
ES6 Object.assign()的用法及其使用
2020/01/18 Javascript
vue 路由缓存 路由嵌套 路由守卫 监听物理返回操作
2020/08/06 Javascript
Python基于pygame实现的弹力球效果(附源码)
2015/11/11 Python
Pycharm编辑器技巧之自动导入模块详解
2017/07/18 Python
新手常见6种的python报错及解决方法
2018/03/09 Python
Python3实现转换Image图片格式
2018/06/21 Python
python 将列表中的字符串连接成一个长路径的方法
2018/10/23 Python
解决python字典对值(值为列表)赋值出现重复的问题
2019/01/20 Python
Apache,wsgi,django 程序部署配置方法详解
2019/07/01 Python
解决Django migrate不能发现app.models的表问题
2019/08/31 Python
使用Rasterio读取栅格数据的实例讲解
2019/11/26 Python
Tensorflow 定义变量,函数,数值计算等名字的更新方式
2020/02/10 Python
Topman美国官网:英国著名的国际平价时尚男装品牌
2017/12/22 全球购物
联想加拿大官方网站:Lenovo Canada
2018/04/05 全球购物
为娇小女性量身打造:Petite Studio
2018/11/01 全球购物
好的自荐信包括什么内容
2013/11/07 职场文书
组工干部对照检查材料
2014/08/25 职场文书
爱护公共设施演讲稿
2014/09/13 职场文书
无房证明范本
2014/09/17 职场文书
爸爸的三轮车观后感
2015/06/16 职场文书
2016年大学生暑期社会实践活动总结
2016/04/06 职场文书
Python入门学习之类的相关知识总结
2021/05/25 Python