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 相关文章推荐
ie8下修改input的type属性报错的解决方法
Sep 16 Javascript
深入探密Javascript数组方法
Jan 08 Javascript
jQuery实现鼠标单击网页文字后在文本框显示的方法
May 06 Javascript
jQuery mobile 移动web(4)
Dec 20 Javascript
Google 地图控件集详解及实例代码
Aug 06 Javascript
jQuery实现导航高亮的方法【附demo源码下载】
Nov 09 Javascript
使用BootStrap实现表格隔行变色及hover变色并在需要时出现滚动条
Jan 04 Javascript
微信小程序实现顶部选项卡(swiper)
Jun 19 Javascript
详解ES6之async+await 同步/异步方案
Sep 19 Javascript
完美解决mui框架off-canvas侧滑超出部分隐藏无法滚动的问题
Jan 25 Javascript
vue滚动tab跟随切换效果
Jun 29 Javascript
vue-cil之axios的二次封装与proxy反向代理使用说明
Apr 07 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 魔术方法详解
2014/11/11 PHP
php提取字符串中网站url地址的方法
2014/12/03 PHP
php使用curl获取https请求的方法
2015/02/11 PHP
PHP获取远程图片并保存到本地的方法
2015/05/12 PHP
javascript div 弹出可拖动窗口
2009/02/26 Javascript
使用jquery读取html5 localstorage的值的方法
2013/01/04 Javascript
jQuery方法简洁实现隔行换色及toggleClass的使用
2013/03/15 Javascript
jquery性能优化高级技巧
2015/08/24 Javascript
详解Bootstrap glyphicons字体图标
2016/01/04 Javascript
Jquery通过ajax请求NodeJS返回json数据实例
2016/11/08 NodeJs
JS定时检测任务任务完成后执行下一步的解决办法
2016/12/22 Javascript
浅谈angular2 组件的生命周期钩子
2017/08/12 Javascript
vue计算属性时v-for处理数组时遇到的一个bug问题
2018/01/21 Javascript
LayerClose弹窗关闭刷新方法
2018/08/17 Javascript
跨域请求两种方法 jsonp和cors的实现
2018/11/11 Javascript
使用js实现一个简单的滚动条过程解析
2019/09/10 Javascript
解决layui数据表格排序图标被超出的表头挤出去的问题
2019/09/19 Javascript
Vue.extend 编程式插入组件的实现
2019/11/18 Javascript
[46:43]DOTA2上海特级锦标赛D组小组赛#1 EG VS COL第三局
2016/02/28 DOTA
[03:16]DOTA2完美大师赛小组赛精彩集锦
2017/11/22 DOTA
Python3.2中Print函数用法实例详解
2015/05/19 Python
深入理解Python中字典的键的使用
2015/08/19 Python
python构建深度神经网络(DNN)
2018/03/10 Python
jupyter notebook引用from pyecharts.charts import Bar运行报错
2020/04/23 Python
Pycharm无法使用已经安装Selenium的解决方法
2018/10/13 Python
python实现抽奖小程序
2020/04/15 Python
基于树莓派的语音对话机器人
2019/06/17 Python
PyTorch中topk函数的用法详解
2020/01/02 Python
对pytorch的函数中的group参数的作用介绍
2020/02/18 Python
keras实现VGG16 CIFAR10数据集方式
2020/07/07 Python
Django视图、传参和forms验证操作
2020/07/15 Python
中职应届生会计求职信
2013/10/23 职场文书
网络营销计划书
2015/01/17 职场文书
自主招生推荐信怎么写
2015/03/26 职场文书
python 网络编程要点总结
2021/06/18 Python
浅谈哪个Python库才最适合做数据可视化
2021/06/28 Python