深入解析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 相关文章推荐
JavaScript Event事件学习第一章 Event介绍
Feb 07 Javascript
JS匀速运动演示示例代码
Nov 26 Javascript
深入学习JavaScript中的Rest参数和参数默认值
Jul 28 Javascript
jquery图片滚动放大代码分享(2)
Aug 28 Javascript
JQuery学习总结【二】
Dec 01 Javascript
微信小程序 设置启动页面的两种方法
Mar 09 Javascript
Vue form 表单提交+ajax异步请求+分页效果
Apr 22 Javascript
jquery点赞功能实现代码 点个赞吧!
May 29 jQuery
node文件上传功能简易实现代码
Jun 16 Javascript
微信小程序商品详情页规格属性选择示例代码
Oct 30 Javascript
three.js利用射线Raycaster进行碰撞检测
Mar 12 Javascript
前端JS获取URL参数的4种方法总结
Apr 05 Javascript
基于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数组的交集array_intersect(),array_intersect_assoc(),array_inter_key()函数的小问题
2011/05/29 PHP
PHP备份数据库生成SQL文件并下载的函数代码
2012/02/05 PHP
javascript 跨浏览器开发经验总结(五) js 事件
2010/05/19 Javascript
javascript开发随笔二 动态加载js和文件
2011/11/25 Javascript
关于js中alert弹出窗口文本换行问题简单详细说明
2012/12/11 Javascript
编写针对IE的JS代码两种编写方法
2013/01/30 Javascript
JS获取html对象的几种方式介绍
2013/12/05 Javascript
jquery实现的美女拼图游戏实例
2015/05/04 Javascript
jQuery Real Person验证码插件防止表单自动提交
2015/11/06 Javascript
详解JavaScript基本类型和引用类型
2015/12/09 Javascript
基于BootStrap Metronic开发框架经验小结【九】实现Web页面内容的打印预览和保存操作
2016/05/12 Javascript
PassWord输入框代码分享
2016/06/07 Javascript
JavaScript中最容易混淆的作用域、提升、闭包知识详解(推荐)
2016/09/05 Javascript
详解有关easyUI的拖动操作中droppable,draggable用法例子
2017/06/03 Javascript
详解vue2.0的Element UI的表格table列时间戳格式化
2017/06/13 Javascript
[01:00:04]DOTA2上海特级锦标赛B组小组赛#1 Alliance VS Spirit第二局
2016/02/26 DOTA
详解Django框架中用户的登录和退出的实现
2015/07/23 Python
python实现数独游戏 java简单实现数独游戏
2018/03/30 Python
python 爬虫百度地图的信息界面的实现方法
2019/10/27 Python
简单了解python元组tuple相关原理
2019/12/02 Python
解决pyshp UnicodeDecodeError的问题
2019/12/06 Python
css3绘制天猫logo实现代码
2012/11/06 HTML / CSS
CSS3中Animation动画属性用法详解
2016/07/04 HTML / CSS
详解html5 canvas常用api总结(二)--绘图API
2016/12/14 HTML / CSS
AmazeUI的JS表单验证框架实战示例分享
2020/08/21 HTML / CSS
Joie官方网上商店:购买服装和女装配饰
2018/06/05 全球购物
领导调研接待方案
2014/02/27 职场文书
总经理工作职责范文
2014/03/14 职场文书
《果园机器人》教学反思
2014/04/13 职场文书
地陪导游欢迎词
2015/01/26 职场文书
教师节主持词开场白
2015/05/29 职场文书
2016年母亲节广告语
2016/01/28 职场文书
2016年社区中秋节活动总结
2016/04/05 职场文书
创业计划书之物流运送
2019/09/17 职场文书
详解分布式系统中如何用python实现Paxos
2021/05/18 Python
vue.js Router中嵌套路由的实用示例
2021/06/27 Vue.js