浅析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 相关文章推荐
一段批量给页面上的控件赋值js
Jun 19 Javascript
js列举css中所有图标的实现代码
Jul 04 Javascript
jQuery EasyUI API 中文文档 - Calendar日历使用
Oct 19 Javascript
JavaScript表达式:URL 协议介绍
Mar 10 Javascript
js 三级关联菜单效果实例
Aug 13 Javascript
ajax+jQuery实现级联显示地址的方法
May 06 Javascript
判断访客终端类型集锦
Jun 05 Javascript
jQuery实现的网页左侧在线客服效果代码
Oct 23 Javascript
浅谈JavaScript中promise的使用
Jan 11 Javascript
在Swiper内如何制作CSS3动画效果示例代码
Dec 07 Javascript
通过webpack引入第三方库的方法
Jul 20 Javascript
vuex vue简单使用知识点总结
Aug 29 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中常见的缓存技术实例分析
2015/09/23 PHP
WordPress中调试缩略图的相关PHP函数使用解析
2016/01/07 PHP
Yii框架用户登录session丢失问题解决方法
2017/01/07 PHP
PHP基于回溯算法解决n皇后问题的方法示例
2017/11/07 PHP
PHP ADODB生成HTML表格函数rs2html功能【附错误处理函数用法】
2018/05/29 PHP
PHP内存溢出优化代码详解
2021/02/26 PHP
Javascript 面向对象(一)(共有方法,私有方法,特权方法)
2012/05/23 Javascript
在Javascript中处理字符串之big()方法的使用
2015/06/08 Javascript
使用Promise解决多层异步调用的简单学习心得
2016/05/17 Javascript
JavaScript 详解预编译原理
2017/01/22 Javascript
Js apply方法详解
2017/02/16 Javascript
jQuery滑动到底部加载下一页数据的实例代码
2017/05/22 jQuery
Angularjs实现下拉框联动的示例代码
2017/08/22 Javascript
Vue cli构建及项目打包以及出现的问题解决
2018/08/27 Javascript
React 路由懒加载的几种实现方案
2018/10/23 Javascript
JavaScript基于数组实现的栈与队列操作示例
2018/12/22 Javascript
jQuery实现的简单歌词滚动功能示例
2019/01/07 jQuery
vue中使用[provide/inject]实现页面reload的方法
2019/09/30 Javascript
webpack是如何实现模块化加载的方法
2019/11/06 Javascript
原生js实现轮播图特效
2020/05/04 Javascript
js实现查询商品案例
2020/07/22 Javascript
Tornado Web服务器多进程启动的2个方法
2014/08/04 Python
使用Node.js和Socket.IO扩展Django的实时处理功能
2015/04/20 Python
详解Python中 __get__和__getattr__和__getattribute__的区别
2016/06/16 Python
python实现对输入的密文加密
2019/03/20 Python
详解python 模拟豆瓣登录(豆瓣6.0)
2019/04/18 Python
python如何实现从视频中提取每秒图片
2020/10/22 Python
python3字符串输出常见面试题总结
2020/12/01 Python
网页布局中CSS样式无效的十个重要原因详解
2017/08/10 HTML / CSS
mui几种页面跳转方式对比总结概括
2017/08/18 HTML / CSS
Contém1g官网:巴西彩妆品牌
2020/01/17 全球购物
法院四风对照检查材料思想汇报
2014/10/06 职场文书
学校实习推荐信
2015/03/27 职场文书
2015年社区国庆节活动总结
2015/07/30 职场文书
人事任命书范本
2015/09/21 职场文书
浅谈Python项目的服务器部署
2021/04/25 Python