浅析JavaScript函数的调用模式


Posted in Javascript onAugust 10, 2016

我们说一个函数的调用模式是作为一个函数来调用,是要与其它三种调用模式做区分
函数其他的三种调用: 方法调用模式,构造器调用模式,apply/call调用模式。 

方法的调用模式: 

var obj={
 fun1: function(){
  //方法内容
  this; //指的是window
 }
}

obj.fun1() //方法的调用

构造器的调用: 

function Person(name, age, job){
 this.name = name;
 this.age = age;
 this.job = job;
 this.sayName = function(){
  alert(this.name);
 };
}
var person1 = new Person("Nicholas", 29, "Software Engineer");
var person2 = new Person("Greg", 27, "Doctor");

apply/call调用模式: 

function cat(){}
cat.prototype = {
 food: "fish",
 say: function(){
  alert("I love " + this.food);
 }
};

var blackCat = new cat; 
blackCat.say();

这里如果没有显性的return语句,这个新的对象则会被隐式的return,并成为这个构造器的值。 也就是说这里可以等价于: var blackCat = new cat();
但是如果我们有一个对象 

var whiteDog = {
 food: "bone"
};

我们不想对它重新定义say方法,那么我们可以通过call或apply用blackCat的say方法:
 blackCat.say.call(whiteDog);
所以,可以看出call和apply是为了动态改变this而出现的,当一个object没有某个方法,但是其他的有,我们可以借助call或apply用其它对象的方法来操作。 

用的比较多的,通过document.getElementsByTagName选择的dom 节点是一种类似array的array(arguments等等)。它不能应用Array下的push,pop等方法。我们可以通过:
var domNodes = Array.prototype.slice.call(document.getElementsByTagName("*"));
这样domNodes就可以应用Array下的所有方法了。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript应用:Iframe自适应其加载的内容高度
Apr 10 Javascript
JQuery之拖拽插件实现代码
Apr 14 Javascript
javascript面向对象入门基础详细介绍
Sep 05 Javascript
js模仿windows桌面图标排列算法具体实现(附图)
Jun 16 Javascript
javascript实现简单的页面右下角提示信息框
Jul 31 Javascript
详解微信小程序开发之城市选择器 城市切换
Jan 17 Javascript
JavaScript禁止微信浏览器下拉回弹效果
May 16 Javascript
vue.js或js实现中文A-Z排序的方法
Mar 08 Javascript
vue element-ui 绑定@keyup事件无效的解决方法
Mar 09 Javascript
JavaScript实现新年倒计时效果
Nov 17 Javascript
原生js代码能实现call和bind吗
Jul 31 Javascript
vue中的可拖拽宽度div的实现示例
Apr 08 Vue.js
JavaScript实现刷新不重记的倒计时
Aug 10 #Javascript
JavaScript中自带的 reduce()方法使用示例详解
Aug 10 #Javascript
JS控制静态页面之间传递参数获取参数并应用的简单实例
Aug 10 #Javascript
浅谈JS中的bind方法与函数柯里化
Aug 10 #Javascript
封装的dialog插件 基于bootstrap模态对话框的简单扩展
Aug 10 #Javascript
JS控制静态页面传递参数并获取参数应用
Aug 10 #Javascript
基于JavaScript实现树形下拉框
Aug 10 #Javascript
You might like
php json_encode值中大括号与花括号区别
2013/09/30 PHP
ThinkPHP中url隐藏入口文件后接收alipay传值的方法
2014/12/09 PHP
深入理解PHP之源码目录结构与功能说明
2016/06/01 PHP
yii2.0实现创建简单widgets示例
2016/07/18 PHP
TP5(thinkPHP5)框架使用ajax实现与后台数据交互的方法小结
2020/02/10 PHP
Extjs改变树节点的勾选状态点击按钮将复选框去掉
2013/11/14 Javascript
js抽奖实现随机抽奖代码效果
2013/12/02 Javascript
浅谈Javascript中substr和substring的区别
2015/09/30 Javascript
通过bootstrap全面学习less
2016/11/09 Javascript
深入浅析Vue不同场景下组件间的数据交流
2017/08/15 Javascript
JS 实现百度搜索功能
2018/02/01 Javascript
jquery分页优化操作实例分析
2019/08/23 jQuery
微信小程序3D轮播实现代码
2019/09/19 Javascript
layer弹窗在键盘按回车将反复刷新的实现方法
2019/09/25 Javascript
js 下拉菜单点击旁边收起实现(踩坑记)
2019/09/29 Javascript
vue-cli创建的项目中的gitHooks原理解析
2020/02/14 Javascript
autojs 蚂蚁森林能量自动拾取即给指定好友浇水的实现方法
2020/05/03 Javascript
Vue+Vant 图片上传加显示的案例
2020/11/03 Javascript
[04:03]DOTA2肉山黑名单梦之声 风暴之灵中文配音鉴赏
2013/07/03 DOTA
Python实现检测服务器是否可以ping通的2种方法
2015/01/01 Python
Numpy掩码式数组详解
2018/04/17 Python
python socket网络编程之粘包问题详解
2018/04/28 Python
tensorflow更改变量的值实例
2018/07/30 Python
详解使用PyInstaller将Pygame库编写的小游戏程序打包为exe文件
2019/08/23 Python
python读取当前目录下的CSV文件数据
2020/03/11 Python
Keras:Unet网络实现多类语义分割方式
2020/06/11 Python
对Python 字典元素进行删除的方法
2020/07/31 Python
Django中和时区相关的安全问题详解
2020/10/12 Python
Data URI scheme详解和使用实例及图片base64编码实现方法
2014/05/08 HTML / CSS
制药工程专业毕业生推荐信
2013/12/24 职场文书
学校运动会开幕演讲稿
2014/01/04 职场文书
数控技术专业毕业自荐书范文
2014/02/05 职场文书
哈弗商学院毕业生求职信
2014/02/26 职场文书
升学宴主持词
2014/04/02 职场文书
中国文明网向国旗敬礼活动精彩寄语2014
2014/09/27 职场文书
2015年药房工作总结
2015/04/25 职场文书