深入解析JavaScript中的arguments对象


Posted in Javascript onJune 12, 2016

arguments定义

所有的函数都有一个自己的arguments对象,用来储存它实际接受到的参数,而不局限于函数声明时所定义的参数列表。它不是数组却类似数组,具有数组一样的访问性质及方式,可以由arguments[n]来访问对应的单个参数的值,并拥有数组长度属性length。但是却不具有数组的一些方法。可以通过call把arguments转化成真正的数组,然后进行数组的操作。

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

类数组

1. 判断ARGUMENTS是不是数组

alert(arguments instanceof Array);
alert(arguments instanceof Object);

2. 如何严格的判断一个数据是数组(ARRAY)类的实例

function isArray(value){
  if (typeof Array.isArray === "function") {
    return Array.isArray(value);
  }else{
    return Object.prototype.toString.call(value) === "[object Array]";
  }
}

3. 把ARGUMENTS转换成数组
方法一:内置的类型可以通过prototype找到内置的属性方法,Array.prototype.slice就是访问Array的内置方法slice。通过slice方法,返回一个数组。call是调用一个对象的方法,以另外一个对象替换当前对象。

var arg = Array.prototype.slice.call(arguments,0);

方法二:比方法一性能要差一点,因为它是先创建一个数组,然后再进行的

var arg = [].slice.call(arguments,0);

方法三:通过循环转变成数组

function toArray(arguments){
  var a = [];
  for(var i=0;i<arguments.length;i++){
    a.unshift(arguments.[i]);
  }
  return a;
}

caller

当一个函数被另一个函数调用的时候,被调用的函数会自动生成一个caller属性,指向调用它的函数对象,如果函数未被调用,则caller为null。

function testCaller() {
  var caller = testCaller.caller;
  alert(caller);
}
function aCaller() {
  testCaller();
}
aCaller();

弹出的是函数aCaller的内容。

arguments.callee
arguments.callee指向正在运行的函数自身,返回正被执行的 Function 对象,也就是所指定的 Function 对象的正文。
注意:arguments.length是实参长度,arguments.callee.length是形参长度,通常用来判断形参与实参长度是否一致
通过arguments获得函数的实参,通过arguments.callee获得函数的形参。
在闭包中应用的也比较广泛。

var i = 0;

  function b(num) {

    if (num < 10) {

      num++;

      i++;

      //如果有参数,callee也要把参数带上;

      arguments.callee(num);

    } else {

      //输出2次

      alert("调用了"+i+"次callee!");

    }

  }

  b(8);

 Arguments.callee在闭包中的应用,它提供了一种递归调调用的功能。

//用arguments.callee计算10的阶乘,例如: 1×2×3×4×5×6×7....

  function c(x) {

    return x > 1 ? x * arguments.callee(x - 1) : 1

  } (10);

  //输出6

  alert(c(3));

  //输出3628800

  alert(c(10));

例:callee求1-n的和

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

它可以让一个匿名函数自己调用自己

例:

function list(type){
  var result = "<"+type+"l><li>";
  var args = Array.prototype.slice.call(arguments,1);
  result += args.join("</li><li>");
  result += "</li></"+type+"l>";
  return result;
}
var listHtml = list("o","one","two");
console.log(listHtml);

例2:面试题:下面的console.log结果是[1,2,3,4]的是?

function foo(x){
  console.log(arguments);
  return x;
}
foo(1,2,3,4);
function foo(x){
  console.log(arguments);
  return x;
}(1,2,3,4)

在预解释的时候,function fn(){}(1);会被分开处理,分成两个函数,第一个是function fn() {},而第二个则为匿名函数:(1)。如果第二个不带参数,就会报错,但是上面的函数包含在一个()里面,则是正确的。

(function fn(){
  console.log(arguments);
}(1,2,3,4));
(function foo(x){
  console.log( arguments);
  return x;
})(1,2,3,4)
function foo(){
  bar.apply(null,arguments);
}
function bar(x){
  console.log(arguments);
}
foo(1,2,3,4);
Javascript 相关文章推荐
window.addeventjs事件驱动函数集合addEvent等
Feb 19 Javascript
clientX,pageX,offsetX,x,layerX,screenX,offsetLeft区别分析
Mar 12 Javascript
Javascript引用指针使用介绍
Nov 07 Javascript
html页面显示年月日时分秒和星期几的两种方式
Aug 20 Javascript
js中的this关键字详解
Sep 25 Javascript
jQuery使用height()获取高度需要注意的地方
Dec 13 Javascript
如何解决ligerUI布局时Center中的Tab高度大小
Nov 24 Javascript
关于input全选反选恶心的异常情况
Jul 24 Javascript
vue项目中,main.js,App.vue,index.html的调用方法
Sep 20 Javascript
使用 vue 实例更好的监听事件及vue实例的方法
Apr 22 Javascript
jQuery实现form表单基于ajax无刷新提交方法实例代码
Nov 04 jQuery
jQuery轮播图功能制作方法详解
Dec 03 jQuery
基于css3新属性transform及原生js实现鼠标拖动3d立方体旋转
Jun 12 #Javascript
JS弹出窗口插件zDialog简单用法示例
Jun 12 #Javascript
jQuery实现拖拽页面元素并将其保存到cookie的方法
Jun 12 #Javascript
仅一个form表单 js实现注册信息依次填写提交功能
Jun 12 #Javascript
JS+HTML5手机开发之滚动和惯性缓动实现方法分析
Jun 12 #Javascript
浅谈如何实现easyui的datebox格式化
Jun 12 #Javascript
JQuery的attr 与 val区别
Jun 12 #Javascript
You might like
无数据库的详细域名查询程序PHP版(3)
2006/10/09 PHP
SESSION信息保存在哪个文件目录下以及能够用来保存什么类型的数据
2012/06/17 PHP
php object转数组示例
2014/01/15 PHP
php实现zip压缩文件解压缩代码分享(简单易懂)
2014/05/10 PHP
摘自百度的图片轮换效果代码
2007/11/19 Javascript
juqery 学习之三 选择器 层级 基本
2010/11/25 Javascript
js实现运动logo图片效果及运动元素对象sportBox使用方法
2012/12/25 Javascript
JS修改css样式style浅谈
2013/05/06 Javascript
js判断字符是否是汉字的两种方法小结
2014/01/03 Javascript
js图片预加载示例
2014/04/30 Javascript
js实现按一下删除键删除整个单词附demo
2014/09/05 Javascript
JavaScript实现的多个图片广告交替显示效果代码
2015/09/04 Javascript
ie下js不执行的几种可能
2017/02/28 Javascript
使用openSpeDiv方法实现Ecshop登录弹窗框效果
2017/03/13 Javascript
jQuery插件HighCharts实现的2D堆条状图效果示例【附demo源码下载】
2017/03/14 Javascript
详解angularJs模块ui-router之状态嵌套和视图嵌套
2017/04/28 Javascript
Nodejs中crypto模块的安全知识讲解
2018/01/03 NodeJs
用POSTMAN发送JSON格式的POST请求示例
2018/09/04 Javascript
浅谈vue项目用到的mock数据接口的两种方式
2019/10/09 Javascript
uni-app如何页面传参数的几种方法总结
2020/04/28 Javascript
Jquery 获取相同NAME 或者id删除行操作
2020/08/24 jQuery
Python实现截取PDF文件中的几页代码实例
2019/03/11 Python
基于腾讯云服务器部署微信小程序后台服务(Python+Django)
2019/05/08 Python
pytorch 归一化与反归一化实例
2019/12/31 Python
pytorch GAN生成对抗网络实例
2020/01/10 Python
CSS3实现自定义Checkbox特效实例代码
2017/04/24 HTML / CSS
详解如何使用rem或viewport进行移动端适配
2020/08/14 HTML / CSS
Trunki英国官网:儿童坐骑式行李箱
2017/05/30 全球购物
会计应届生的自荐信
2013/12/13 职场文书
家居饰品店创业计划书
2014/01/31 职场文书
如何撰写岗位职责
2014/02/01 职场文书
经贸日语专业自荐信
2014/09/02 职场文书
领导班子四风问题对照检查材料
2014/09/27 职场文书
超市员工辞职信范文
2015/05/12 职场文书
2015年人民调解工作总结
2015/05/18 职场文书
闭幕词的写作格式与范文!
2019/06/24 职场文书