浅析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 相关文章推荐
在线编辑器中换行与内容自动提取
Apr 24 Javascript
图片上传即时显示缩略图的js代码
May 27 Javascript
一个js写的日历(代码部分网摘)
Sep 20 Javascript
支持ie与FireFox的剪切板操作代码
Sep 28 Javascript
超轻量级的基于jquery的三级展开列表
Apr 26 Javascript
JavaScript中逗号运算符介绍及使用示例
Mar 13 Javascript
基于JavaScript实现文字超出部分隐藏
Feb 29 Javascript
javascript事件模型介绍
May 31 Javascript
Radio 单选JS动态添加的选项onchange事件无效的解决方法
Dec 12 Javascript
jquery实现tab选项卡切换效果(悬停、下方横线动画位移)
May 05 jQuery
vue配置多页面的实现方法
May 22 Javascript
小程序实现带年月选取效果的日历
Jun 27 Javascript
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内存缓存功能memcached示例
2016/10/19 PHP
php统计数组不同元素的个数的实例方法
2019/09/26 PHP
js 时间格式与时间戳的相互转换示例代码
2013/12/25 Javascript
jquery 3D 标签云示例代码
2014/06/12 Javascript
node.js中的path.resolve方法使用说明
2014/12/08 Javascript
Javascript闭包与函数柯里化浅析
2016/06/22 Javascript
jq实现左滑显示删除按钮,点击删除实现删除数据功能(推荐)
2016/08/23 Javascript
javascript和jQuery中的AJAX技术详解【包含AJAX各种跨域技术】
2016/12/15 Javascript
浅谈React Event实现原理
2018/09/20 Javascript
js中的深浅拷贝问题简析
2019/05/10 Javascript
微信小程序webview 脚手架使用详解
2019/07/22 Javascript
JavaScript onclick事件使用方法详解
2020/05/15 Javascript
js代码编写无缝轮播图
2020/09/13 Javascript
Python中bisect的用法
2014/09/23 Python
python如何实现excel数据添加到mongodb
2015/07/30 Python
python中使用print输出中文的方法
2018/07/16 Python
Scrapy框架使用的基本知识
2018/10/21 Python
python 内置模块详解
2019/01/01 Python
使用k8s部署Django项目的方法步骤
2019/01/14 Python
python从入门到精通 windows安装python图文教程
2019/05/18 Python
python代理工具mitmproxy使用指南
2019/07/04 Python
Python爬取破解无线网络wifi密码过程解析
2019/09/17 Python
Python生成六万个随机,唯一的8位数字和数字组成的随机字符串实例
2020/03/03 Python
Python装饰器用法与知识点小结
2020/03/09 Python
Python 列表反转显示的四种方法
2020/11/16 Python
使用Python获取爱奇艺电视剧弹幕数据的示例代码
2021/01/12 Python
CSS3的Flexbox布局的简明入门指南
2016/04/08 HTML / CSS
美国折扣香水网站:The Perfume Spot
2020/12/12 全球购物
枚举与#define宏的区别
2014/04/30 面试题
幼师自我鉴定
2014/02/01 职场文书
我的小天地教学反思
2014/04/30 职场文书
研究生简历自我评价范文
2014/09/13 职场文书
市委常委会班子党的群众路线教育实践活动整改方案
2014/10/25 职场文书
优秀班组申报材料
2014/12/25 职场文书
焦裕禄观后感
2015/06/03 职场文书
ant design charts 获取后端接口数据展示
2022/05/25 Javascript