浅析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 相关文章推荐
对textarea框的代码调试,而且功能上使用非常方便,酷
Jun 30 Javascript
jQuery使用empty()方法删除元素及其所有子元素的方法
Mar 26 Javascript
JS控制表单提交的方法
Jul 09 Javascript
javascript实现判断鼠标的状态
Jul 10 Javascript
jQuery实现div随意拖动的实例代码(通用代码)
Jan 28 Javascript
JavaScript获取IP获取的是IPV6 如何校验
Jun 12 Javascript
详解在express站点中使用ejs模板引擎
Sep 21 Javascript
jQuery简单实现对数组去重及排序操作实例
Oct 31 jQuery
JS常见面试试题总结【去重、遍历、闭包、继承等】
Aug 27 Javascript
vue.js实现h5机器人聊天(测试版)
Jul 16 Javascript
如何将Node.js中的回调转换为Promise
Nov 10 Javascript
vue 动态添加的路由页面刷新时失效的原因及解决方案
Feb 26 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 header()函数使用详细(301、404等错误设置)
2013/04/17 PHP
php获取网卡的MAC地址支持WIN/LINUX系统
2014/04/30 PHP
smarty内置函数capture用法分析
2015/01/22 PHP
了解PHP的返回引用和局部静态变量
2015/06/04 PHP
JS保存、读取、换行、转Json报错处理方法
2013/06/14 Javascript
javascript页面上使用动态时间具体实现
2014/03/18 Javascript
JavaScript使用yield模拟多线程的方法
2015/03/19 Javascript
jQuery实现简单的文件上传进度条效果
2020/03/26 Javascript
JavaScript实现广告弹窗效果
2016/08/09 Javascript
JavaScript cookie详解及简单实例应用
2016/12/31 Javascript
JavaScript闭包的简单应用
2017/09/01 Javascript
在 webpack 中使用 ECharts的实例详解
2018/02/05 Javascript
Vue-cli3.X使用px2 rem遇到的问题及解决方法
2019/08/08 Javascript
[09:37]DOTA2卡尔工作室 英雄介绍圣堂刺客篇
2013/06/13 DOTA
简单的Apache+FastCGI+Django配置指南
2015/07/22 Python
python去除字符串中的换行符
2017/10/11 Python
Python正则表达式实现简易计算器功能示例
2019/05/07 Python
tensorflow没有output结点,存储成pb文件的例子
2020/01/04 Python
Python3 读取Word文件方式
2020/02/13 Python
在vscode中启动conda虚拟环境的思路详解
2020/12/25 Python
css3中的calc函数浅析
2018/07/10 HTML / CSS
Html5 Canvas 实现一个“刮刮乐”游戏
2019/09/05 HTML / CSS
uniapp+Html5端实现PC端适配
2020/07/15 HTML / CSS
马来西亚航空官方网站:Malaysia Airlines
2017/07/28 全球购物
对于没有初始化的变量的初始值可以作怎样的假定
2014/10/12 面试题
《灯光》教学反思
2014/02/08 职场文书
心理健康课教学反思
2014/02/13 职场文书
2014年班主任自我评价范文
2014/04/23 职场文书
党员三严三实对照检查材料
2014/10/13 职场文书
教师群众路线教育实践活动个人对照检查材料
2014/11/04 职场文书
初中生思想道德自我评价
2015/03/09 职场文书
2015安全保卫工作总结
2015/04/25 职场文书
MySQL复制问题的三个参数分析
2021/04/07 MySQL
在HTML5 localStorage中存储对象的示例代码
2021/04/21 Javascript
Jmerte 分布式压测及分布式压测配置
2022/04/30 Java/Android
使用Python开发贪吃蛇游戏 SnakeGame
2022/04/30 Python