简单谈谈Javascript函数中的arguments


Posted in Javascript onFebruary 09, 2017

一、arguments的面貌

在javascript中所有的函数内部都包含了一个隐藏的变量叫arguments;它存放着所有传递到这个函数中的参数;

那么我们打开实例看看arguments的输出形式

(function fn(){
 console.log(arguments)
})(1,2,3,4)

简单谈谈Javascript函数中的arguments

结果好像是类似数组的形式打印在控制台,相信大多数人包括我看到这种输出就会认为arguments是一个数组,那么既然是数组就可以用数组的一些方法了吧,再看下一个例子;

(function fn(){
 arguments.push(5)
 console.log(arguments)
})(1,2,3,4)

简单谈谈Javascript函数中的arguments

结果报错了- -!;(在项目中我就是踩到了这个坑);

那我们就会有一个疑惑了,既然是数组为什么不能用push方法呢,其他的像pop,slice也不行么,是的,都不行,虽然arguments也能通过下标的形式获取到对应位置的参数,当本质上不算是真正的数组;

我们通过instanceof打印看看它是不是Array的孩子

(function fn(){
 console.log(arguments instanceof Array)
})()

简单谈谈Javascript函数中的arguments

果不其然真不是数组,那么我们就会联想到它就是个对象了;

虽然它也能用for循环遍历到里面的参数,但把它转为真正的数组才是更好的选择;

二、转化为数组

转化的方法有很多,对象冒充的方式传递给Array.prototype或遍历push到空数组或传递给另一个函数等等。。都可以完成,下面简单介绍几个转化的方法,遍历push到空数组的方法就不细讲了;

第一种方法:

(function fn(){
 var arr = Array.prototype.slice.call(arguments)
 arr.push(5)
 console.log(arr)
})(1,2,3,4)

简单谈谈Javascript函数中的arguments

这种转化方式比较慢,在性能不好的情况下不推荐这种写法;

第二种方法:

function fn() {
 fnArr.apply(null, arguments);
}
function fnArr(a,b,c,d) {
 ···
}

个人推荐这种做法;

总结

以上就是这篇文章的全部内容了,虽然写的不多,但还是希望大家能在项目的过程当中不要误踩了arguments的坑,希望本文能对大家有所帮助。

Javascript 相关文章推荐
Javascript中Array用法实例分析
Jun 13 Javascript
DEDECMS如何为文章添加HOT NEW标志图片
Aug 14 Javascript
JS获取字符串实际长度(包含汉字)的简单方法
Aug 11 Javascript
EasyUi 打开对话框后控件赋值及赋值后不显示的问题解决办法
Jan 19 Javascript
快速使用node.js进行web开发详解
Apr 26 Javascript
JS滚动到指定位置导航栏固定顶部
Jul 03 Javascript
node中的cookie的具体使用
Sep 13 Javascript
利用Webpack实现小程序多项目管理的方法
Feb 25 Javascript
深入理解Node内建模块和对象
Mar 12 Javascript
VUE.CLI4.0配置多页面入口的实现
Nov 25 Javascript
javascript实现蒙版与禁止页面滚动
Jan 11 Javascript
如何通过javaScript去除字符串两端的空白字符
Feb 06 Javascript
javascript 中设置window.location.href跳转无效问题解决办法
Feb 09 #Javascript
微信小程序之picker日期和时间选择器
Feb 09 #Javascript
BootStrap 弹出层代码
Feb 09 #Javascript
jQuery插件form-validation-engine正则表达式操作示例
Feb 09 #Javascript
javascript history对象详解
Feb 09 #Javascript
jquery dialog获取焦点的方法
Feb 09 #Javascript
jQuery实现淡入淡出的模态框
Feb 09 #Javascript
You might like
PHP邮件专题
2006/10/09 PHP
深入php之规范编程命名小结
2013/05/15 PHP
php的memcache类分享(memcache队列)
2014/03/26 PHP
一个网马的tips实现分析
2010/11/28 Javascript
批量实现面向对象的实例代码
2013/07/01 Javascript
原生javaScript做得动态表格(注释写的很清楚)
2013/12/29 Javascript
js解决select下拉选不中问题
2014/10/14 Javascript
JS逆序遍历实现代码
2014/12/02 Javascript
使用Javascript简单实现图片无缝滚动
2014/12/05 Javascript
jQuery中hover方法和toggle方法使用指南
2015/02/27 Javascript
jQuery实现简单的点赞效果
2020/05/29 Javascript
Angularjs中UI Router的使用方法
2016/05/14 Javascript
使用Web Uploader实现多文件上传
2016/06/08 Javascript
浅谈jquery拼接字符串效率比较高的方法
2017/02/22 Javascript
深入理解Angularjs中$http.post与$.post
2017/05/19 Javascript
Js实现京东无延迟菜单效果实例(demo)
2017/06/02 Javascript
IScroll那些事_当内容不足时下拉刷新的解决方法
2017/07/18 Javascript
jQuery动态添加.active 实现导航效果代码思路详解
2017/08/29 jQuery
原生JS实现图片无缝滚动方法(附带封装的运动框架)
2017/10/01 Javascript
ES6/JavaScript使用技巧分享
2017/12/14 Javascript
使用 vue 实例更好的监听事件及vue实例的方法
2019/04/22 Javascript
JS removeAttribute()方法实现删除元素的某个属性
2021/01/11 Javascript
python通过urllib2爬网页上种子下载示例
2014/02/24 Python
PHP实现发送和接收JSON请求
2018/06/07 Python
详解Python给照片换底色(蓝底换红底)
2019/03/22 Python
Django应用程序入口WSGIHandler源码解析
2019/08/05 Python
如何利用Python开发一个简单的猜数字游戏
2019/09/22 Python
html5本地存储 localStorage操作使用详解
2016/09/20 HTML / CSS
公司财务工作总结的自我评价
2013/11/23 职场文书
策划创业计划书
2014/02/06 职场文书
五年级学生评语
2014/04/22 职场文书
2014年预备党员群众路线教育实践活动对照检查材料思想汇报
2014/10/02 职场文书
云南省召开党的群众路线教育实践活动总结会议新闻稿
2014/10/21 职场文书
责任书范本大全
2015/05/11 职场文书
2015年幼儿园安全工作总结
2015/05/12 职场文书
优秀团员主要事迹材料
2015/11/05 职场文书