简单谈谈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 相关文章推荐
些很实用且必用的小脚本代码
Jun 26 Javascript
Javascript 调试利器 Firebug使用详解六
Jul 05 Javascript
js判断样式className同时增加class或删除class
Jan 30 Javascript
javascript中的括号()用法小结
Apr 14 Javascript
javascript入门教程基础篇
Nov 16 Javascript
浅析如何利用angular结合translate为项目实现国际化
Dec 08 Javascript
js仿淘宝商品放大预览功能
Mar 15 Javascript
基于jQuery Easyui实现登陆框界面
Jul 10 jQuery
一篇文章让你彻底弄懂JS的事件冒泡和事件捕获
Aug 14 Javascript
深入浅析js原型链和vue构造函数
Oct 25 Javascript
js动态获取时间的方法分析
Aug 02 Javascript
jQuery zTree树插件的使用教程
Aug 16 jQuery
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中var_dump,var_export,print_r三个函数的区别
2013/06/21 PHP
PHP正则匹配日期和时间(时间戳转换)的实例代码
2016/12/14 PHP
PHP 中常量的知识整理
2017/04/14 PHP
PHP批量删除jQuery操作
2017/07/23 PHP
JS中toFixed()方法引起的问题如何解决
2012/11/20 Javascript
轻松创建nodejs服务器(1):一个简单nodejs服务器例子
2014/12/18 NodeJs
JavaScript中对象property的读取和写入方法介绍
2014/12/30 Javascript
JS实现的表格行鼠标点击高亮效果代码
2015/11/27 Javascript
js时间戳转为日期格式的方法
2015/12/28 Javascript
jQuery实现横向带缓冲的水平运动效果(附demo源码下载)
2016/01/29 Javascript
JavaScript的MVVM库Vue.js入门学习笔记
2016/05/03 Javascript
TinyMCE汉化及本地上传图片功能实例详解
2016/05/31 Javascript
jQuery实现表单动态加减、ajax表单提交功能
2018/06/08 jQuery
vue中element-ui表格缩略图悬浮放大功能的实例代码
2018/06/26 Javascript
React事件处理的机制及原理
2018/12/03 Javascript
Vue 组件修改根实例的数据的方法
2019/04/02 Javascript
TypeScript开发Node.js程序的方法
2019/04/30 Javascript
webpack中如何加载静态文件的方法步骤
2019/05/18 Javascript
VUE实现移动端列表筛选功能
2019/08/23 Javascript
JavaScript Reflect Metadata实现详解
2019/12/12 Javascript
JS判断数组四种实现方法详解
2020/06/29 Javascript
使用python编写批量卸载手机中安装的android应用脚本
2014/07/21 Python
python爬虫入门教程--HTML文本的解析库BeautifulSoup(四)
2017/05/25 Python
python matplotlib中文显示参数设置解析
2017/12/15 Python
Python高级编程之消息队列(Queue)与进程池(Pool)实例详解
2019/11/01 Python
python飞机大战pygame游戏框架搭建操作详解
2019/12/17 Python
pytorch dataloader 取batch_size时候出现bug的解决方式
2020/02/20 Python
预备党员思想汇报范文
2014/01/11 职场文书
文科教师毕业的自我评价
2014/01/16 职场文书
秋季运动会广播稿大全
2014/02/17 职场文书
充分就业社区汇报材料
2014/05/07 职场文书
运动会的口号
2014/06/09 职场文书
党风廉政建设个人总结
2015/03/06 职场文书
在酒桌上的敬酒词
2015/08/12 职场文书
公司管理建议书
2015/09/14 职场文书
浅谈Python中的函数(def)及参数传递操作
2021/05/25 Python