JS函数内部属性之arguments和this实例解析


Posted in Javascript onOctober 07, 2018

在函数内部,有两个特殊的对象:arguments和this。

1、arguments

arguments是一个类数组对象。包含着传入函数中的所有参数。但这个对象还有一个名叫callee的属性,该属性是一个指针,指向拥有这个arguments对象的函数。

经典案例:阶乘函数

function factorial(num){
  if(num <= 1){
    return 1;
  }else{
    return num * factorial(num-1);
  }
}

定义阶乘函数一般都要用到递归算法,如上所示,但你会发现,这个函数的执行与函数名factorial紧紧耦合在了一起,为解决这个问题,我们可以使用arguments.callee。

function factorial(num){
  if(num <= 1){
    return 1;
  }else{
    return num * arguments.callee(num-1);
  }
}

我们重写之后,factorial()函数里没有引用函数名factorial。这样无论引用函数时使用的是什么名字,都可以保证正常完成递归调用。例如:

var trueFac = factorial;

factorial = function(){
  return 0;
}

console.log(trueFac(5)); // 120
console.log(factorial(5)); // 0

2、this

函数内部的另一个对象是this,this引用的是函数执行的环境对象(当在网页的全局作用域中调用函数时,this对象引用的就是window)。

window.color = "red";
var o = { color: "blue" };

function sayColor(){
  alert(this.color);
}

sayColor(); // "red"

o.sayColor = sayColor;
o.sayColor(); // "blue"

在上面这个函数sayColor()是在全局作用域中定义的,它引用了this对象。由于在调用函数之前,this的值并不确定,因此this可能会在代码执行过程中引用不同的对象。

当在全局作用域中调用sayColor()时,this引用的时全局对象window;换句话说,对this.color求值会转换成对window.color求值,于是结果就返回了"red"。而当把这个函数赋给对象o并调用o.sayColor()时,this引用的是对象o,因此对this.color求值会转换成对o.color求值,所以返回“blue”。

函数的名字仅仅是一个包含指针的变量。

总结

以上所述是小编给大家介绍的JS函数内部属性之arguments和this实例解析,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

Javascript 相关文章推荐
基于Jquery的文字滚动跑马灯插件(一个页面多个滚动区)
Jul 26 Javascript
js字符编码函数区别分析
Dec 28 Javascript
jquery操作checkbox实现全选和取消全选
May 02 Javascript
JavaScript 七大技巧(一)
Dec 13 Javascript
JS实现的多张图片轮流播放幻灯片效果
Jul 22 Javascript
jquery radio的取值_radio的选中_radio的重置方法
Sep 20 Javascript
基于js实现二级下拉联动
Dec 17 Javascript
JavaScript实现经典排序算法之插入排序
Dec 28 Javascript
javascript基本数据类型和转换
Mar 17 Javascript
JavaScript中的高级函数
Jan 04 Javascript
JavaScript使用面向对象实现的拖拽功能详解
Jun 12 Javascript
解决layui动态添加的元素click等事件触发不了的问题
Sep 20 Javascript
JS如何获取地址栏的参数实例讲解
Oct 06 #Javascript
详谈js的变量提升以及使用方法
Oct 06 #Javascript
浅析js中mvvm模式实现的原理
Oct 06 #Javascript
js for终止循环 跳出多层循环
Oct 04 #Javascript
iView-admin 动态路由问题的解决方法
Oct 03 #Javascript
Angular resolve基础用法详解
Oct 03 #Javascript
解决angularjs service中依赖注入$scope报错的问题
Oct 02 #Javascript
You might like
PHP安全技术之 实现php基本安全
2010/09/04 PHP
重新封装zend_soap实现http连接安全认证的php代码
2011/01/12 PHP
smarty半小时快速上手入门教程
2014/10/27 PHP
php常用的url处理函数总结
2014/11/19 PHP
php使用类继承解决代码重复的问题
2015/02/11 PHP
PHP实现长文章分页实例代码(附源码)
2016/02/03 PHP
PHP安装GeoIP扩展根据IP获取地理位置及计算距离的方法
2016/07/01 PHP
php 命名空间(namespace)原理与用法实例小结
2019/11/13 PHP
载入进度条 效果
2006/07/08 Javascript
JavaScript 高级篇之DOM文档,简单封装及调用、动态添加、删除样式(六)
2012/04/07 Javascript
Js日期选择器并自动加入到输入框中示例代码
2013/08/02 Javascript
jquery垂直公告滚动实现代码
2013/12/08 Javascript
jQuery+css last-child实现选择最后一个子元素操作示例
2018/12/10 jQuery
JavaScript实现无限级递归树的示例代码
2019/03/29 Javascript
vue父组件触发事件改变子组件的值的方法实例详解
2019/05/07 Javascript
vue+elementUI 实现内容区域高度自适应的示例
2020/09/26 Javascript
详解vue之自行实现派发与广播(dispatch与broadcast)
2021/01/19 Vue.js
10个易被忽视但应掌握的Python基本用法
2015/04/01 Python
详解python脚本自动生成需要文件实例代码
2017/02/04 Python
Python使用cx_Oracle调用Oracle存储过程的方法示例
2017/10/07 Python
python opencv 二值化 计算白色像素点的实例
2019/07/03 Python
给Python学习者的文件读写指南(含基础与进阶)
2020/01/29 Python
浅谈cv2.imread()和keras.preprocessing中的image.load_img()区别
2020/06/12 Python
Pytorch 解决自定义子Module .cuda() tensor失败的问题
2020/06/23 Python
一些关于python 装饰器的个人理解
2020/08/31 Python
Ray-Ban雷朋美国官网:全球领先的太阳眼镜品牌
2016/07/20 全球购物
一套PHP的笔试题
2013/05/31 面试题
怎样比较两个类型为String的字符串
2016/08/17 面试题
写一个函数返回1+2+3+…+n的值(假定结果不会超过长整型变量的范围)
2014/09/05 面试题
会计找工作求职信范文
2013/12/09 职场文书
餐厅总经理岗位职责
2013/12/31 职场文书
公立医院改革实施方案
2014/03/14 职场文书
会计毕业生自荐书
2014/06/12 职场文书
事业单位年度考核评语
2014/12/31 职场文书
赢在中国观后感
2015/06/02 职场文书
python基础之类属性和实例属性
2021/10/24 Python