JavaScript四种调用模式和this示例介绍


Posted in Javascript onJanuary 02, 2014

JavaScript调用时除了声明时定义的形参外,每个函数接受两个附加参数:this 和arguments,this在面向对象编程中非常重要,它取决于调用模式。

JavaScript有四种调用模式,方法调用模式,函数调用模式,构造器调用模式和apply调用模式。这些模式在初始化关键参数this上存在差异。

方法调用模式:当一个函数被保存为对象的一个属性时,我们称它为一个方法,当一个方法被调用时,this被绑定到该对象上。如果调用表达式包含一个属性取表达式(即一个.点表达式或[script]下标表达式),那么它被当做一个方法调用。

var myObject = { 
value: 0; 
increment: function(inc){ 
this.value += typeof inc === 'number' ? inc : 1; 
} 
}; myObject.increment(); 
document.writeln(myObject.value);//1 
myObject.increment(2); 
document.writeln(myObject.value);//2

方法可以使用this去访问对象,所以它能从对象中取值或修改对象。this的绑定发生在调用的时候。这个超级迟绑定使得函数可以对this高度复用。通过this可以取得他们所属的上下文方法称为公共方法。

函数调用模式:当一个函数并非一个对象的属性时,那么它被当做一个函数来调用 var sum = add(3, 4);//sum值为7
当函数以此模式调用时,this被绑定到全局对象。

构造器调用模式:JavaScript是一门基于原型继承的语言。这意味着可以直接从其他对象继承属性。该语言是无类别的。
如果在函数前面带上new来调用,那么将创建一个隐藏连接到该函数的prototype成员的新对象,同时this将会被绑定到那个新对象上。

Apply调用模式:因为JavaScript是一门函数式的面向对象编程语言,所以函数可以拥有方法。
apply方法让哦我们构建一个参数数组并用其去调用函数。它也允许我们选择this的值。
apply方法接受两个参数,第一个将被绑定给this的值,第二个就是一个参数数组。

Javascript 相关文章推荐
jquery实现瀑布流效果分享
Mar 26 Javascript
jQuery表单域属性过滤器用法分析
Feb 10 Javascript
Javascript显示和隐藏ul列表的方法
Jul 15 Javascript
jQuery学习笔记之回调函数
Aug 15 Javascript
jquery实现左右滑动式轮播图
Mar 02 Javascript
Bootstrap 表单验证formValidation 实现远程验证功能
May 17 Javascript
JavaScript原型继承_动力节点Java学院整理
Jun 30 Javascript
React如何避免重渲染
Apr 10 Javascript
vuejs 动态添加input框的实例讲解
Aug 24 Javascript
JS高阶函数原理与用法实例分析
Jan 15 Javascript
如何基于filter实现网站整体变灰功能
Apr 17 Javascript
vue实现书本翻页动画效果实例详解
Apr 08 Vue.js
ParseInt函数参数设置介绍
Jan 02 #Javascript
JS中Date日期函数中的参数使用介绍
Jan 02 #Javascript
JavaScript中Math对象方法使用概述
Jan 02 #Javascript
javascript数组快速打乱重排的方法
Jan 02 #Javascript
利用进制转换压缩数字函数分享
Jan 02 #Javascript
利用window.name实现windowStorage代码分享
Jan 02 #Javascript
点击按钮自动加关注的代码(sina微博/QQ空间/人人网/腾讯微博)
Jan 02 #Javascript
You might like
PHP 防注入函数(格式化数据)
2011/08/08 PHP
PHP内存缓存Memcached类实例
2014/12/08 PHP
PHP实现的redis主从数据库状态检测功能示例
2017/07/20 PHP
js类中的公有变量和私有变量
2008/07/24 Javascript
JQuery textlimit 显示用户输入的字符数 限制用户输入的字符数
2009/05/14 Javascript
JavaScript toFixed() 方法
2010/04/15 Javascript
jQueryUI如何自定义组件实现代码
2010/11/14 Javascript
JsDom 编程小结
2011/08/09 Javascript
jquery隐藏标签和显示标签的实例
2013/11/11 Javascript
jQuery超简单选项卡完整实例
2015/09/26 Javascript
JS实现兼容各种浏览器的高级拖动方法完整实例【测试可用】
2016/06/21 Javascript
微信小程序 wx.request(object) API详解及实例代码
2016/09/30 Javascript
Bootstrap 3 按钮标签实例代码
2017/02/21 Javascript
ng2学习笔记之bootstrap中的component使用教程
2017/03/09 Javascript
Jquery把获取到的input值转换成json
2017/05/15 jQuery
Angular4 中常用的指令入门总结
2017/06/12 Javascript
React Native 集成jpush-react-native的示例代码
2017/08/16 Javascript
vue父组件向子组件(props)传递数据的方法
2018/01/02 Javascript
Vue 组件注册全解析
2020/12/17 Vue.js
[11:12]2018DOTA2国际邀请赛寻真——绿色长城OpTic
2018/08/10 DOTA
详解Python中heapq模块的用法
2016/06/28 Python
Python实现Selenium自动化Page模式
2019/07/14 Python
python join方法使用详解
2019/07/30 Python
Python接口自动化判断元素原理解析
2020/02/24 Python
python安装cx_Oracle和wxPython的方法
2020/09/14 Python
在pycharm中使用pipenv创建虚拟环境和安装django的详细教程
2020/11/30 Python
CSS3制作漂亮的照片墙的实现代码
2016/06/08 HTML / CSS
英国工艺品购物网站:Minerva Crafts
2018/01/29 全球购物
女子锻炼服装和瑜伽服装:Splits59
2019/03/04 全球购物
高中美术教学反思
2014/01/19 职场文书
班组长安全工作职责
2014/07/15 职场文书
八项规定对照检查材料
2014/08/31 职场文书
2014年初三班主任工作总结
2014/12/05 职场文书
小学语文教学反思范文
2016/03/03 职场文书
公文写作:教你写“建议书”
2019/05/07 职场文书
vue使用refs获取嵌套组件中的值过程
2022/03/31 Vue.js