浅析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 相关文章推荐
ext for eclipse插件安装方法
Apr 27 Javascript
JavaScript实现按照指定长度为数字前面补零输出的方法
Mar 19 Javascript
javascript框架设计之框架分类及主要功能
Jun 23 Javascript
分享有关jQuery中animate、slide、fade等动画的连续触发、滞后反复执行的bug
Jan 10 Javascript
Angularjs的ng-repeat中去除重复数据的方法
Aug 05 Javascript
关于Vue.js 2.0的Vuex 2.0 你需要更新的知识库
Nov 30 Javascript
JavaScript 输出显示内容(document.write、alert、innerHTML、console.log)
Dec 14 Javascript
jQuery+Datatables实现表格批量删除功能【推荐】
Oct 24 jQuery
JQuery样式操作、click事件以及索引值-选项卡应用示例
May 14 jQuery
微信小程序实现下拉框功能
Jul 16 Javascript
js 实现 list转换成tree的方法示例(数组到树)
Aug 18 Javascript
JS实现秒杀倒计时特效
Jan 02 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
文章推荐系统(二)
2006/10/09 PHP
php的SimpleXML方法读写XML接口文件实例解析
2014/06/16 PHP
YII框架页面缓存操作示例
2019/04/29 PHP
PHP 扩展Memcached命令用法实例总结
2020/06/04 PHP
JavaScript 学习点滴记录
2009/04/24 Javascript
javascript最常用与实用的创建类的代码
2010/08/12 Javascript
jQuery布局插件UI Layout简介及使用方法
2013/04/03 Javascript
node.js中的fs.writeFile方法使用说明
2014/12/14 Javascript
jQuery选择器源码解读(一):Sizzle方法
2015/03/31 Javascript
复杂的javascript窗口分帧解析
2016/02/19 Javascript
JavaScript中闭包的写法和作用详解
2016/06/29 Javascript
jquery根据一个值来选中select下的option实例代码
2016/08/29 Javascript
jQuery的 $.ajax防止重复提交的两种方法(推荐)
2016/10/14 Javascript
JS与jQuery判断文本框还剩多少字符可以输入的方法
2018/09/01 jQuery
JavaScript简单实现的仿微博留言功能示例
2019/01/17 Javascript
Vue中Axios从远程/后台读取数据
2019/01/21 Javascript
javascript实现遮罩层动态效果实例
2019/05/14 Javascript
react实现antd线上主题动态切换功能
2019/08/12 Javascript
vue倒计时刷新页面不会从头开始的解决方法
2020/03/03 Javascript
js 闭包深入理解与实例分析
2020/03/19 Javascript
[00:12]2018DOTA2亚洲邀请赛 Somnus丶M出阵单挑
2018/04/06 DOTA
python实现进程间通信简单实例
2014/07/23 Python
Python实现导出数据生成excel报表的方法示例
2017/07/12 Python
把django中admin后台界面的英文修改为中文显示的方法
2019/07/26 Python
关于tensorflow的几种参数初始化方法小结
2020/01/04 Python
浅谈keras使用预训练模型vgg16分类,损失和准确度不变
2020/07/02 Python
英国时尚饰品和发饰购物网站:Claire’s
2017/07/04 全球购物
如何选择使用结构还是类
2014/05/30 面试题
自荐信格式范文
2013/10/07 职场文书
大学生秋游活动方案
2014/02/17 职场文书
材料专业大学毕业生自荐书
2014/07/02 职场文书
单位工作证明格式模板
2014/10/04 职场文书
办公室主任岗位职责
2015/01/31 职场文书
幼儿园圣诞节活动总结
2015/05/06 职场文书
MySQL中你可能忽略的COLLATION实例详解
2021/05/12 MySQL
Navicat连接MySQL错误描述分析
2021/06/02 MySQL